Svelte.js Course Syllabus

• 1️⃣ Introduction to Svelte

  • What is Svelte?
  • Differences between Svelte, React, and Vue
  • Advantages of using Svelte
  • Setting up a Svelte project
  • Understanding project structure

• 2️⃣ Svelte Basics

  • Components and Reusable UI
  • Variables and Reactivity
  • Handling Events in Svelte
  • Bindings in Svelte (bind: directives)
  • Conditional Rendering ({#if}, {#each}, etc.)

• 3️⃣ Working with Props and State

  • Passing Props between Components
  • Reactivity with $: Syntax
  • Derived State and Stores
  • Svelte Stores (writable, readable, derived)

• 4️⃣ Styling in Svelte

  • Scoped CSS in Svelte
  • Global Styles in Svelte
  • Using Tailwind CSS with Svelte
  • Animations and Transitions in Svelte

• 5️⃣ Routing in Svelte

  • Introduction to svelte-routing
  • Creating Dynamic Routes
  • Navigating between Pages
  • Route Parameters and Layouts

• 6️⃣ Working with Forms & Data Binding

  • Handling Form Inputs
  • Two-Way Data Binding
  • Form Validation in Svelte
  • Handling Form Submissions

• 7️⃣ Fetching Data in Svelte

  • Fetching API Data
  • Using onMount() for API Calls
  • Displaying Data Dynamically
  • Error Handling in API Requests

• 8️⃣ Svelte Stores & State Management

  • Creating and Using Writable Stores
  • Context API in Svelte
  • Global State Management with Stores
  • Derived and Readable Stores

• 9️⃣ Animations & Transitions

  • Basics of Svelte Transitions
  • Customizing Transitions
  • Keyframe Animations
  • Page Transitions

• 🔟 Deploying a Svelte App

  • Preparing for Production
  • Optimizing Svelte Apps
  • Deploying on Vercel / Netlify
  • Best Practices for Deployment

Course Highlights

• 📌 Comprehensive Svelte.js Training
• 💻 Real-time Hands-on Project Building
• 🎓 Certification and Career Guidance