Overview
In this course, you'll master modern web development with Svelte 5 and SvelteKit. You'll gain hands-on experience with the latest updates in Svelte 5, enabling you to build responsive, interactive web applications. By the end of the course, you'll have a strong understanding of how to leverage the Svelte framework and SvelteKit’s features to create scalable applications.
The course begins with an in-depth crash course on Svelte 5, covering the structure of Svelte files, reactivity, passing props, and advanced state management techniques. You'll dive into Svelte's templating language and reactive state system to build dynamic, interactive components with ease.
Next, you’ll explore SvelteKit, focusing on routing, server-side data fetching, and creating custom API endpoints. The course provides you with practical skills that will allow you to create modern applications that are optimized for performance and scalability.
This course is designed for developers who want to enhance their web development skills with Svelte and SvelteKit. Beginners with basic JavaScript knowledge will benefit from this course, and developers looking to expand their toolkit with modern web development practices will find this course both valuable and engaging.
Syllabus
Course 1: Svelte 5 & SvelteKit - The Complete Fundamentals Guide
- Offered by Packt. Unlock the power of Svelte 5 and SvelteKit with this comprehensive course. Whether you're new to Svelte or an experienced ... Enroll for free.
Course 2: Build a Product Landing Page with Stripe Integration
- Offered by Packt. In this hands-on course, you'll learn how to create a fully functional product landing page with Stripe payment ... Enroll for free.
Course 3: Build a Developer Portfolio with SvelteKit & Sanity CMS
- Offered by Packt. This course will guide you step-by-step through the process of creating a professional developer portfolio using SvelteKit ... Enroll for free.
Course 4: Full-Stack Web Development with SvelteKit & Supabase
- Offered by Packt. In this course, you'll learn how to build a full-stack web application using SvelteKit and Supabase. By the end of the ... Enroll for free.
- Offered by Packt. Unlock the power of Svelte 5 and SvelteKit with this comprehensive course. Whether you're new to Svelte or an experienced ... Enroll for free.
Course 2: Build a Product Landing Page with Stripe Integration
- Offered by Packt. In this hands-on course, you'll learn how to create a fully functional product landing page with Stripe payment ... Enroll for free.
Course 3: Build a Developer Portfolio with SvelteKit & Sanity CMS
- Offered by Packt. This course will guide you step-by-step through the process of creating a professional developer portfolio using SvelteKit ... Enroll for free.
Course 4: Full-Stack Web Development with SvelteKit & Supabase
- Offered by Packt. In this course, you'll learn how to build a full-stack web application using SvelteKit and Supabase. By the end of the ... Enroll for free.
Courses
-
This course will guide you step-by-step through the process of creating a professional developer portfolio using SvelteKit and Sanity CMS. By the end, you will have a fully functional portfolio site that showcases your skills, projects, and experience with dynamic content fetched from a headless CMS. You’ll learn how to build reusable components, style sections effectively, and handle backend functionality for contact forms, all while applying modern web development practices. The course starts by helping you set up the foundation for your portfolio project. You will establish your app's infrastructure and design key sections such as the hero, about me, work experience, and skills. With each video, you will build and style components, adding functionality along the way. The course's practical approach will ensure that you develop a solid understanding of component-based development and responsive design. As you move through the course, you’ll integrate Sanity as your headless CMS, learning how to set it up, define data schemas, and fetch the data into your SvelteKit frontend. You’ll also work with dynamic routing and process data efficiently to display on your portfolio. This section will ensure that your portfolio is both flexible and scalable for future updates. By the end of the course, you will have a fully deployed developer portfolio hosted on Vercel. This course is perfect for web developers looking to build a personalized portfolio with dynamic content management and modern development tools, helping them stand out in the competitive job market.
-
In this hands-on course, you'll learn how to create a fully functional product landing page with Stripe payment integration. The course is structured to take you from the initial project setup to the complete integration of Stripe for handling payments. You'll build a polished landing page that features several key sections, such as the hero section, chapter previews, author information, and FAQs while incorporating dynamic content and interactivity using Svelte. You’ll begin by setting up your project, working with Svelte, and a CSS reset for consistent styling. From there, you'll build and style the hero section, chapter previews, and the "About the Author" and FAQ sections. You'll also learn how to use Svelte's templating language to create reusable components and dynamically render content based on user inputs, making your page interactive and engaging. Once the page structure and design are in place, you'll dive into integrating Stripe payments. Learn how to set up a Stripe account, understand the core concepts of Stripe integration, and write the necessary code to process payments. You’ll also learn to handle success and failure pages post-payment and configure Stripe webhooks for payment event notifications. This course is ideal for developers interested in building dynamic, modern landing pages with payment integrations. By the end of the course, you’ll be able to deploy your project on Vercel and automate email notifications with SendGrid for seamless digital product delivery upon successful payments.
-
In this course, you'll learn how to build a full-stack web application using SvelteKit and Supabase. By the end of the course, you'll have the skills to develop modern, dynamic applications with robust backend integration, authentication, and data management. You'll start by building foundational components like user authentication and a flexible UI, and progressively integrate advanced features such as user dashboards, book management, and data storage. This hands-on approach allows you to apply your learning in real time through the creation of a Personal Book Library project. The course begins with setting up the project and establishing essential components such as the hero section, flexible button components, and a user-friendly header. You'll then move on to implementing user authentication, both through registration and login forms, along with integrating social login options like Google. The course continues by integrating Supabase for backend services, including database management and authentication flows. You'll also learn to manage state, such as keeping track of the user's login session, and sync data with the backend. As you progress, you'll explore building reusable components like the book card and star rating, as well as creating dynamic pages for individual books and categories. These components will be styled and integrated seamlessly into your project. Further, you'll implement features such as the ability to upload book covers and update book details in the database, enhancing the library's interactivity and user experience. This course is ideal for web developers who want to gain a deeper understanding of full-stack development using modern tools like SvelteKit and Supabase. If you're interested in building scalable, database-driven web applications with clean user interfaces, this course is perfect for you. Prior experience with JavaScript and basic web development concepts is recommended.
-
Unlock the power of Svelte 5 and SvelteKit with this comprehensive course. Whether you're new to Svelte or an experienced developer, this course will walk you through the fundamentals and guide you in mastering the latest features of Svelte 5, along with the robust features of SvelteKit. By the end of the course, you'll be able to build reactive web applications with ease and efficiency. The journey begins with an introduction to the course structure and the new updates in Svelte 5, setting the stage for what's to come. You'll dive deep into the structure of Svelte files, learn how to manage reactive state, and understand the nuances of input handling and side effects. Key concepts such as derived runes and debugging with Inspect rune will be thoroughly explored. You'll also gain practical knowledge on how to pass props across components and implement advanced features like snippets and templating. The second part focuses on SvelteKit, covering its structure and routing systems for both client-side and server-side navigation. You’ll learn to fetch server-side data using the page.server.ts file, and handle data fetching for both the server and client using the load function. To round out your skill set, you'll learn to create custom API endpoints, which will be essential for building dynamic and data-driven web applications. This course is perfect for web developers looking to level up their skills in modern front-end development using Svelte 5 and SvelteKit. Ideal for beginners to intermediate learners, this course will take you through hands-on projects and real-world examples. A basic understanding of JavaScript is recommended to get the most out of the course, but no prior Svelte experience is necessary.
Taught by
Packt - Course Instructors