🎓 دوره آموزشی جامع

📚 اطلاعات دوره

عنوان دوره: Svelte: The Compiler-Driven Revolution: Actively Shaping the Present and Defining the Future of Web Development

موضوع کلی: برنامه نویسی

موضوع میانی: سوِلت (Svelte)

📋 سرفصل‌های دوره (100 موضوع)

• 1. مقدمه‌ای بر Svelte و فلسفه آن
• 2. چرا Svelte؟ مقایسه با سایر فریم‌ورک‌ها
• 3. محیط توسعه Svelte: نصب و راه‌اندازی
• 4. اولین اپلیکیشن Svelte: ساختار پروژه
• 5. مفاهیم اولیه کامپوننت‌ها در Svelte
• 6. سینتکس Svelte: تگ‌های `<script>`, `<style>`, و markup
• 7. ایجاد و رندر کردن متن و مقادیر داینامیک
• 8. کار با ویژگی‌ها (Attributes) در Svelte
• 9. دستورات شرطی (`{#if}`, `{:else if}`, `{:else}`)
• 10. حلقه‌های تکرار (`{#each}`)
• 11. دستورات `key` در حلقه‌های `each`
• 12. مدیریت رویدادها (Event Handling)
• 13. مُدِفایرها (Modifiers) برای رویدادها (مانند `.prevent`, `.stopPropagation`)
• 14. کلاس‌های داینامیک (Dynamic Class Binding)
• 15. استایل‌های درون‌خطی (Inline Styles) و داینامیک
• 16. استایل‌های بلوک (Block Styles) و Scoped CSS
• 17. Props: انتقال داده به کامپوننت‌های فرزند
• 18. Props پیش‌فرض (Default Props)
• 19. Props Destructuring
• 20. Props Validation (با TypeScript)
• 21. Reacting to Prop Changes
• 22. Local Component State
• 23. Handling User Input: Text Inputs
• 24. Handling User Input: Checkboxes and Radio Buttons
• 25. Handling User Input: Select Elements
• 26. Two-Way Data Binding with `bind:value`
• 27. Working with `bind:this` for Element References
• 28. Component Lifecycle Hooks: `onMount`
• 29. Component Lifecycle Hooks: `onDestroy`
• 30. Component Lifecycle Hooks: `beforeUpdate`
• 31. Component Lifecycle Hooks: `afterUpdate`
• 32. Context API: Sharing Data Across Components
• 33. Custom Events: Emitting Events from Child Components
• 34. Event Forwarding
• 35. Slots: Content Projection
• 36. Named Slots
• 37. Scoped Slots
• 38. Using `$$slots` for Dynamic Slot Handling
• 39. Conditional Rendering of Slots
• 40. Layout Components
• 41. Nested Components
• 42. Component Composition Patterns
• 43. Introduction to Svelte Stores
• 44. Writable Stores
• 45. Readable Stores
• 46. Derived Stores
• 47. Custom Stores
• 48. Auto-subscription with `$storeName`
• 49. Manual Subscription and Unsubscription
• 50. Stores as Props
• 51. Using Stores for Global State Management
• 52. Component Libraries in Svelte (e.g., Svelte Material UI, Carbon Components Svelte)
• 53. Routing in Svelte: SvelteKit Introduction
• 54. SvelteKit Project Structure
• 55. Pages and Routes in SvelteKit
• 56. Layouts in SvelteKit
• 57. Loading Data with `load` functions
• 58. API Routes in SvelteKit
• 59. Form Actions in SvelteKit
• 60. Form Data Handling
• 61. Server-Side Rendering (SSR) in SvelteKit
• 62. Static Site Generation (SSG) in SvelteKit
• 63. Incremental Static Regeneration (ISR) with SvelteKit
• 64. Adapters for Deployment (Node, Vercel, Netlify, etc.)
• 65. Handling Assets and Static Files
• 66. Advanced SvelteKit Data Loading
• 67. Error Handling in SvelteKit
• 68. Authentication and Authorization in SvelteKit
• 69. Session Management
• 70. Internationalization (i18n) with SvelteKit
• 71. Using SvelteKit with TypeScript
• 72. Type Safety in Svelte Components
• 73. Type Safety with Stores
• 74. Type Safety in SvelteKit `load` functions
• 75. Type Safety in SvelteKit API Routes
• 76. Testing Svelte Components (Unit Testing)
• 77. Testing Svelte Components (Integration Testing)
• 78. Testing SvelteKit Applications
• 79. End-to-End (E2E) Testing with Playwright/Cypress
• 80. Performance Optimization in Svelte
• 81. Bundle Size Optimization
• 82. Code Splitting
• 83. Lazy Loading Components
• 84. Memoization and Caching
• 85. Web Workers with Svelte
• 86. Server-Sent Events (SSE)
• 87. WebSockets with Svelte
• 88. Progressive Web Apps (PWAs) with SvelteKit
• 89. Accessibility (a11y) in Svelte
• 90. ARIA Attributes and Best Practices
• 91. Svelte Transitions and Animations
• 92. Creating Custom Transitions
• 93. Animating Elements with `transition:` directive
• 94. Animating between component states
• 95. Introduction to Svelte Transitions API
• 96. Using `fly`, `fade`, `slide`, `scale` transitions
• 97. Custom Transitions with CSS
• 98. Custom Transitions with JavaScript
• 99. Keyframe Animations
• 100. Performance Considerations for Animations

Svelte: The Compiler-Driven Revolution: Actively Shaping the Present and Defining the Future of Web Development

آیا به دنبال سرعت، کارایی و تجربه‌ای نوآورانه در توسعه وب هستید؟ آیا می‌خواهید وب‌سایت‌هایی بسازید که در چشم برهم زدنی بارگذاری می‌شوند و تجربه‌ای بی‌نظیر برای کاربران رقم می‌زنند؟ با دوره آموزشی Svelte: The Compiler-Driven Revolution، به دنیای شگفت‌انگیز Svelte قدم بگذارید و قدرت کامپایلر را در دستان خود احساس کنید. این دوره، یک سفر هیجان‌انگیز از مبانی تا پیشرفته‌ترین تکنیک‌های Svelte است، که شما را برای تبدیل شدن به یک توسعه‌دهنده وب حرفه‌ای آماده می‌کند.

Svelte، فریمورک جدید و انقلابی است که با رویکردی متفاوت، توسعه وب را متحول کرده است. به جای استفاده از یک runtime سنگین در مرورگر، Svelte کد شما را در زمان کامپایل به جاوااسکریپت بهینه تبدیل می‌کند. این به معنای وب‌سایت‌هایی سریع‌تر، با حجم کمتر و تجربه کاربری بهتر است. این دوره، کلید ورود شما به این انقلاب است. با ما همراه شوید و آینده وب را از امروز بسازید!

درباره دوره

در این دوره، شما از صفر تا صد Svelte را یاد خواهید گرفت. از نصب و راه‌اندازی گرفته تا ساخت کامپوننت‌های پیچیده، مدیریت رویدادها، کار با APIها، و پیاده‌سازی مسیریابی و مدیریت حالت (state management). دوره با زبانی ساده و قابل فهم، شما را با مفاهیم کلیدی Svelte آشنا می‌کند و با پروژه‌های عملی، مهارت‌های شما را تقویت می‌کند. ما شما را قدم به قدم در این مسیر همراهی می‌کنیم تا به یک توسعه‌دهنده Svelte ماهر تبدیل شوید.

موضوعات کلیدی دوره

• مقدمه‌ای بر Svelte: آشنایی با مفاهیم اولیه، مزایا و فلسفه Svelte.
• تنظیم محیط توسعه: نصب و راه‌اندازی Svelte و ابزارهای مورد نیاز.
• سینتکس Svelte: یادگیری نحوه نوشتن کامپوننت‌ها، استفاده از متغیرها و prop‌ها.
• کامپوننت‌ها و کامپوزیشن: ساخت و ترکیب کامپوننت‌های قابل استفاده مجدد.
• مدیریت رویدادها: کار با رویدادها، handlerها و تعامل با عناصر DOM.
• ری‌اکتیویتی (Reactivity): درک نحوه کارکرد سیستم ری‌اکتیو Svelte و مدیریت state.
• شرط‌ها و حلقه‌ها: استفاده از دستورات شرطی و حلقه‌ها در Svelte.
• کامپوننت‌های سفارشی: ایجاد کامپوننت‌های پیشرفته و سفارشی.
• APIها و داده‌ها: دریافت و نمایش داده‌ها از APIهای مختلف.
• مسیریابی (Routing): پیاده‌سازی مسیریابی در وب‌سایت‌های Svelte.
• مدیریت حالت (State Management): معرفی و استفاده از State Management در Svelte.
• انیمیشن‌ها و ترانزیشن‌ها: افزودن انیمیشن و ترانزیشن به کامپوننت‌ها.
• بهینه‌سازی عملکرد: تکنیک‌های پیشرفته برای بهینه‌سازی وب‌سایت‌های Svelte.
• تست‌نویسی: نوشتن تست برای کامپوننت‌ها و اطمینان از عملکرد صحیح.
• استقرار وب‌سایت: استقرار وب‌سایت‌های Svelte در سرورهای مختلف.

مخاطبان دوره

این دوره برای همه کسانی که به توسعه وب علاقه‌مند هستند، ایده‌آل است. اگر شما:

• یک توسعه‌دهنده فرانت‌اند هستید که می‌خواهید مهارت‌های خود را گسترش دهید.
• به دنبال فریمورکی سریع‌تر و بهینه‌تر برای پروژه‌های خود هستید.
• می‌خواهید با یک فناوری جدید و جذاب در دنیای وب آشنا شوید.
• یا حتی یک مبتدی هستید که می‌خواهید وارد دنیای برنامه‌نویسی وب شوید.

این دوره برای شما طراحی شده است!

چرا این دوره را بگذرانیم؟

با گذراندن این دوره، شما به مزایای بی‌شماری دست خواهید یافت:

• یادگیری از متخصصان: از مدرسان باتجربه و متخصص در زمینه Svelte آموزش می‌بینید.
• کسب مهارت‌های عملی: با انجام پروژه‌های عملی، مهارت‌های خود را در دنیای واقعی تقویت می‌کنید.
• افزایش سرعت توسعه: با استفاده از Svelte، سرعت توسعه وب‌سایت‌های خود را به طور چشمگیری افزایش می‌دهید.
• بهبود عملکرد وب‌سایت: وب‌سایت‌هایی سریع‌تر و با تجربه کاربری بهتر ایجاد می‌کنید.
• افزایش فرصت‌های شغلی: با یادگیری Svelte، مهارت‌های خود را در بازار کار توسعه وب ارتقا می‌دهید.
• پشتیبانی کامل: از پشتیبانی مدرسان و رفع اشکالات خود بهره‌مند می‌شوید.
• دسترسی مادام‌العمر: به محتوای دوره برای همیشه دسترسی خواهید داشت.

سرفصل‌های دوره (100+ سرفصل جامع!)

دوره آموزشی Svelte: The Compiler-Driven Revolution، مجموعه‌ای بی‌نظیر از بیش از 100 سرفصل جامع و کاربردی را در اختیار شما قرار می‌دهد. در اینجا تنها به بخشی از این سرفصل‌ها اشاره می‌کنیم:

بخش ۱: مقدمات و نصب

• معرفی Svelte و تاریخچه آن
• مقایسه Svelte با React و Vue
• تنظیم محیط توسعه: نصب Node.js، npm و VS Code
• ایجاد اولین پروژه Svelte
• ساختار فایل‌های Svelte
• کامپایل کردن و اجرای پروژه‌های Svelte
• ... (ادامه دارد)

بخش ۲: مبانی Svelte

• سینتکس Svelte: آشنایی با تگ‌ها و ساختار
• کامپوننت‌ها و اجزای تشکیل‌دهنده آن‌ها
• استفاده از props و داده‌های ورودی
• مدیریت رویدادها و ارتباط با DOM
• متغیرهای reactive و مدیریت حالت
• دستورات شرطی: if و else
• حلقه‌ها: for و each
• ... (ادامه دارد)

بخش ۳: کامپوننت‌های پیشرفته

• ساخت کامپوننت‌های قابل استفاده مجدد
• کامپوزیشن و ترکیب کامپوننت‌ها
• استفاده از slotها و content projection
• مدیریت state با استفاده از stores
• ایجاد کامپوننت‌های تعاملی
• کار با forms و ورودی‌ها
• ... (ادامه دارد)

بخش ۴: کار با داده‌ها و APIها

• دریافت داده‌ها از APIها با استفاده از fetch
• نمایش داده‌ها در کامپوننت‌ها
• مدیریت خطاهای API
• ارسال داده‌ها به APIها (POST, PUT, DELETE)
• کار با async/await و promise
• ... (ادامه دارد)

بخش ۵: مسیریابی و مدیریت حالت

• مقدمه‌ای بر مسیریابی در Svelte
• نصب و راه‌اندازی Svelte Router
• ایجاد مسیرها و ناوبری بین صفحات
• مدیریت پارامترهای URL
• معرفی Svelte stores برای مدیریت حالت
• ایجاد و استفاده از writable, readable و derived stores
• ... (ادامه دارد)

بخش ۶: انیمیشن‌ها و ترانزیشن‌ها

• مقدمه‌ای بر انیمیشن‌ها و ترانزیشن‌ها در Svelte
• افزودن انیمیشن‌های ساده به کامپوننت‌ها
• استفاده از ترانزیشن‌ها برای جلوه‌های بصری
• ایجاد انیمیشن‌های سفارشی
• انیمیشن‌های ورودی و خروجی
• ... (ادامه دارد)

بخش ۷: تست‌نویسی و بهینه‌سازی

• مقدمه‌ای بر تست‌نویسی در Svelte
• نصب و راه‌اندازی تست‌فریمورک‌ها
• نوشتن تست‌های واحد (unit tests)
• تست کامپوننت‌ها با استفاده از Jest یا Mocha
• بهینه‌سازی عملکرد وب‌سایت‌های Svelte
• استفاده از تکنیک‌های caching
• بهینه‌سازی تصاویر و کدهای CSS
• ... (ادامه دارد)

بخش ۸: استقرار و پروژه‌های عملی

• استقرار وب‌سایت‌های Svelte در Netlify و Vercel
• معرفی پروژه‌های عملی و کاربردی
• ساخت یک وب‌سایت خبری با Svelte
• ایجاد یک اپلیکیشن TODO با Svelte
• ساخت یک فروشگاه آنلاین ساده با Svelte
• ... (ادامه دارد)

با شرکت در این دوره، به یک توسعه‌دهنده Svelte حرفه‌ای تبدیل شوید و آینده توسعه وب را از آن خود کنید!

همین حالا ثبت‌نام کنید!