Note This article is a part of a series of tutorials "Creating an Electron application with Svelte 3 and TypeScript".

Check out the rest if you haven't yet 😉.

In the previous article we implemented an interactive search. The next natural step is to display the search results!

As a reminder, in part 2 I made a mockup of the application that we are building. That's how the list of result was represented:

The list of articles in our mockup, highlighted

What can we get from this?

  • Our application has a top menu (that we already created) and a content section
  • The content section is divided in two panels, the list of articles is on the left side, and article detail on the right side
  • The list is displayed vertically, and is likely to be scrollable
  • Every r...
Read full post

Note This article is a part of a series of tutorials "Creating an Electron application with Svelte 3 and TypeScript".

Check out the rest if you haven't yet 😉.

Before starting to work on our project, let's define a plan and a set of goals.

We know that we want to interact with Wikipedia's API, so what do we need for this? A first version would be like this. I will keep our goals simple for now, we can always add more things later.

hand drawn mock-up
A hand-drawn mock-up of our initial goal (click on the picture to see it full screen)

Abstractly we have 3 components:

  • a simple search for in a menu bar available at the top of the application. The first version will only have an input text and a button to call the API.
  • a listing of search results in a left pan
  • a right pan to vi...
Read full post

Note This article is a part of a series of tutorials "Creating an Electron application with Svelte 3 and TypeScript".

Earlier this month the team behind the web UI framework Svelte announced they are now officially supporting TypeScript. I didn't follow the project before this announcement, but I see it as a good motivation to try it out. For this reason I decided I would create a simple Electron application interfacing with Wikipedia's public API, and will document the process through a serie of tutorials.

I read Svelte's documentation yesterday for the first time, so I'm really new to the framework, though from what I've seen so far it should be quite fast to pick up. As mentioned in the title, I'm going to use Svelte 3 and TypeScript. Let's start with the initi...

Read full post