Welcome to Beginner SvelteKit: the complete course to start your journey building Svelte applications.
This course covers the Svelte basics as well as SvelteKit features. We'll be building an ecommerce site during this course. Each module contains the code for that specific part, so feel free to clone it and use it for reference as you follow along.
In this course, we will begin by covering the Svelte basics:
- What is Svelte and why use it?
- Creating a new SvelteKit project
- Svelte's reactivity
- Working with Svelte components
After covering the basics of Svelte, we will begin learning about SvelteKit features like:
- SvelteKit's file-based routing
- Creating layouts
- Using endpoints and the load function
- Prefetching data
- Adapting the app for deployment
By the end of this course, you will have a complete and solid foundation to begin building apps with SvelteKit.
If you're already familiar with some Svelte topics, feel free to jump ahead past certain modules. If you're completely new, let's spend some time discussing why we are using Svelte and why you might consider learning it.
Today, most popular frameworks utilize the virtual DOM. This means that the reactivity of these frameworks is tied to the virtual DOM. Without the virtual DOM, it would be completely unaware when there are changes to the data. Svelte, however, takes a different approach. Instead of looking at the virtual DOM for changes, Svelte writes code that surgically updates the DOM when your app's state changes, allowing us to achieve true reactivity.
In the next module, we will create a new SvelteKit project and go through each file to understand the structure of a SvelteKit project.
Continue learning SvelteKit on Vercel: