Prerequisite learning

Try to finish Part 1 and Part 3 of the learning source at https://learn.svelte.dev/tutorial/welcome-to-svelte

I have created one simple app using svelte, playaround with it to learn about store, event dispatching and property bindings https://svelte.dev/repl/b42abb120dcc482e8c34fbcb14a5cad8?version=4.2.7

Svelte workshop

In this workshop, We will learn svelte by building one expense app,

Run

npm i
npm run dev -- --open

The expense app is now accessible in the browser. The complete solution is available in the main branch code. To complete this workshop, follow the workshop structure given below

Workshop structure

NOTE: The main branch contains all the code necessary to complete the application. Please refer to the main file for the solution

There are four branches: activity-1, activity-2, activity-3, and activity-4.

In each branch, you can find instructions for the corresponding activity in the Readme section.

First, git checkout to the activity-1 branch. You can find the activity todo as part of activity-1 at Readme.md. If you finish it, then move on to activity-2, then activity-3, and so on.

Once you finish activity-4, you will have completed the fully functional expense tracker app.

References

Svelte official tutorial: https://learn.svelte.dev/

Form: https://svelte-forms-lib-sapper-docs.vercel.app/introduction

Chartjs: https://www.chartjs.org/docs/latest/charts/doughnut.html#pie