دوره فشرده‌سازی کد در Vite همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

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

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

عنوان دوره: دوره فشرده‌سازی کد در Vite

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

موضوع میانی: وایت (Vite)

📋 سرفصل‌های دوره

• 1. مبانی Vite و آشنایی با محیط توسعه
• 2. نصب و راه‌اندازی Vite
• 3. ساختار پروژه در Vite
• 4. نحوهٔ استفاده از ماژول‌ها و واردات
• 5. مفاهیم Hot Module Replacement (HMR)
• 6. کار با فایل‌های CSS و پیش‌پردازنده‌ها
• 7. استفاده از SASS/SCSS در Vite
• 8. پشتیبانی از Less و Stylus
• 9. مدیریت Asset ها و تصاویر
• 10. بهینه‌سازی بارگذاری Asset ها
• 11. استفاده از SVG در Vite
• 12. مقدمه‌ای بر کامپوننت‌های Vue.js
• 13. ساخت اولین کامپوننت Vue
• 14. ارتباط بین کامپوننت‌ها
• 15. مدیریت State در کامپوننت‌ها
• 16. استفاده از Props و Emits
• 17. مفهوم Slots در کامپوننت‌ها
• 18. معرفی Vue Router برای Single Page Application
• 19. تنظیم مسیرها در Vue Router
• 20. پارامترهای مسیر و Navigation Guards
• 21. استفاده از Vuex برای مدیریت State مرکزی
• 22. تعریف State، Mutations و Actions در Vuex
• 23. Modules در Vuex
• 24. مقدمه‌ای بر فشرده‌سازی کد
• 25. اهمیت فشرده‌سازی کد در وب
• 26. انواع روش‌های فشرده‌سازی
• 27. فشرده‌سازی کد در Vite: Overview
• 28. پیکربندی پیش‌فرض فشرده‌سازی در Vite
• 29. استفاده از Rollup برای فشرده‌سازی
• 30. تنظیمات Rollup در Vite
• 31. گزینه‌های فشرده‌سازی Rollup (terser)
• 32. تغییر الگوریتم فشرده‌سازی
• 33. فشرده‌سازی CSS
• 34. استفاده از CSSNano
• 35. تنظیمات فشرده‌سازی CSS
• 36. فشرده‌سازی تصاویر
• 37. بهینه‌سازی تصاویر با Vite Plugin
• 38. استفاده از فرمت‌های جدید تصویر (WebP)
• 39. فشرده‌سازی فونت‌ها
• 40. نحوهٔ بارگذاری بهینهٔ فونت‌ها
• 41. مدیریت Chunk ها در Vite
• 42. تقسیم کد (Code Splitting)
• 43. تنظیمات Chunk در Rollup
• 44. ایجاد Chunks سفارشی
• 45. بهینه‌سازی بارگذاری اولیهٔ برنامه
• 46. Lazy Loading کامپوننت‌ها
• 47. Lazy Loading Route ها
• 48. تنظیمات Lazy Loading در Vite
• 49. اهمیت Preloading و Prefetching
• 50. استفاده از Link Preload
• 51. استفاده از Link Prefetch
• 52. تکنیک‌های پیشرفتهٔ فشرده‌سازی
• 53. حذف کد مرده (Dead Code Elimination)
• 54. Code Shaking در Rollup
• 55. تنظیمات Code Shaking
• 56. استفاده از Tree Shaking با Vue.js
• 57. بهینه‌سازی وابستگی‌های پروژه
• 58. مدیریت نسخه‌های کتابخانه‌ها
• 59. استفاده از CDN برای کتابخانه‌های پرکاربرد
• 60. تکنیک‌های Caching در مرورگر
• 61. مدیریت Service Workers
• 62. تنظیم Service Worker برای Caching
• 63. استفاده از Vite PWA Plugin
• 64. پیکربندی Manifest فایل
• 65. بهینه‌سازی عملکرد نهایی برنامه
• 66. ابزارهای تحلیل عملکرد
• 67. استفاده از Lighthouse
• 68. تحلیل نتایج Lighthouse
• 69. بهینه‌سازی برای موبایل
• 70. تست عملکرد در دستگاه‌های مختلف
• 71. مقدمه‌ای بر Micro Frontends
• 72. معماری Micro Frontends با Vite
• 73. مزایای استفاده از Micro Frontends
• 74. چالش‌های Micro Frontends
• 75. استفاده از Vite برای Micro Frontend
• 76. امنیت در Vite
• 77. تنظیمات امنیتی Vite
• 78. جلوگیری از حملات XSS
• 79. مدیریت صحیح Secret ها
• 80. استفاده از Environment Variables
• 81. پیکربندی Environment Variables در Vite
• 82. امنیت Environment Variables
• 83. مستندسازی پروژه
• 84. نوشتن README جامع
• 85. مستندسازی کامپوننت‌ها
• 86. استفاده از Storybook (با رویکرد سازگار)
• 87. تست واحد (Unit Testing)
• 88. مقدمه‌ای بر Jest
• 89. تنظیم Jest با Vite
• 90. نوشتن تست‌های واحد برای کامپوننت‌ها
• 91. تست یکپارچه‌سازی (Integration Testing)
• 92. مقدمه‌ای بر Cypress
• 93. تنظیم Cypress با Vite
• 94. نوشتن تست‌های یکپارچه‌سازی
• 95. مراحل استقرار (Deployment)
• 96. آماده‌سازی پروژه برای Production
• 97. فشرده‌سازی نهایی کد
• 98. تنظیمات Production در Vite
• 99. استقرار بر روی سرورهای وب
• 100. کانفیگ Nginx برای Vite