کتاب صوتی ساخت Progressive Web Apps (PWA)

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

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

عنوان دوره: ساخت Progressive Web Apps (PWA)

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

موضوع میانی: جاوا اسکریپت (JavaScript)

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

• 1. مقدمه‌ای بر جاوا اسکریپت و نقش آن در PWA
• 2. متغیرها، انواع داده و عملگرها در جاوا اسکریپت
• 3. ساختارهای کنترلی (if/else, switch) در جاوا اسکریپت
• 4. حلقه‌ها (for, while, do/while) در جاوا اسکریپت
• 5. توابع: تعریف، فراخوانی، Scope و Closures در جاوا اسکریپت
• 6. آرایه‌ها و متدهای کار با آرایه‌ها در جاوا اسکریپت
• 7. اشیاء و برنامه‌نویسی شی‌گرا در جاوا اسکریپت (مقدماتی)
• 8. ES6+ ویژگی‌ها: let, const, Arrow Functions
• 9. ES6+ ویژگی‌ها: Template Literals, Destructuring
• 10. ES6+ ویژگی‌ها: Spread/Rest Operators, Classes
• 11. مدیریت خطاها (try/catch/finally) در جاوا اسکریپت
• 12. ماژول‌ها در جاوا اسکریپت (ES Modules)
• 13. جاوا اسکریپت ناهمگام (Asynchronous JS): Callbacks
• 14. جاوا اسکریپت ناهمگام: Promises
• 15. جاوا اسکریپت ناهمگام: Async/Await
• 16. مقدمه‌ای بر HTML5 و ساختار صفحات وب
• 17. تگ‌های معنایی و بهینه‌سازی ساختار HTML
• 18. مقدمه‌ای بر CSS3 و استایل‌دهی
• 19. اصول طراحی واکنش‌گرا (Responsive Design) با CSS
• 20. مدل جعبه‌ای (Box Model) و Flexbox در CSS
• 21. معرفی DOM (Document Object Model) و کاربرد آن
• 22. انتخاب و پیمایش عناصر DOM با جاوا اسکریپت
• 23. تغییر محتوا و ویژگی‌های عناصر DOM
• 24. افزودن و حذف عناصر DOM
• 25. مدیریت رویدادها (Event Handling) در DOM
• 26. اعتبار سنجی فرم‌ها با جاوا اسکریپت
• 27. ذخیره‌سازی داده در مرورگر: localStorage و sessionStorage
• 28. ارتباط با سرور: Fetch API و XMLHttpRequest
• 29. کار با داده‌های JSON
• 30. اصول امنیت وب: HTTPS (ضرورت برای PWA)
• 31. PWA چیست؟ مقدمه، مزایا و فلسفه
• 32. معیارهای PWA و چک لیست Lighthouse
• 33. راه‌اندازی محیط توسعه برای PWA (Node.js, npm/yarn)
• 34. فایل Web App Manifest: هدف و ساختار
• 35. پیکربندی Manifest: name, short_name, description
• 36. تنظیم icon‌ها و splash screen در Manifest
• 37. تعیین start_url و display mode در Manifest
• 38. مدیریت تم رنگی (theme_color, background_color)
• 39. افزودن PWA به صفحه اصلی (Add to Home Screen - A2HS)
• 40. تجربه کاربری (UX) در A2HS و نصب PWA
• 41. Service Worker چیست و چگونه کار می‌کند؟
• 42. ثبت (Registration) Service Worker
• 43. چرخه حیات Service Worker: Install Event
• 44. چرخه حیات Service Worker: Activate Event
• 45. مدیریت به‌روزرسانی (Update) Service Worker
• 46. Scope و Lifetime Service Worker
• 47. API کش (Cache Storage API)
• 48. استراتژی‌های کش: Cache Only
• 49. استراتژی‌های کش: Network Only
• 50. استراتژی‌های کش: Cache First (Offline-First)
• 51. استراتژی‌های کش: Network First
• 52. استراتژی‌های کش: Stale-While-Revalidate
• 53. کش‌کردن منابع استاتیک (Pre-caching)
• 54. کش‌کردن منابع دینامیک (Runtime Caching)
• 55. رویداد fetch در Service Worker: رهگیری درخواست‌ها
• 56. ساخت پاسخ‌های سفارشی با fetch event
• 57. استراتژی App Shell برای PWA
• 58. مدیریت خطاها و Fallback در کشینگ
• 59. API همگام‌سازی پس‌زمینه (Background Sync API)
• 60. استفاده از Background Sync برای ارسال داده‌های آفلاین
• 61. معرفی Push Notification API
• 62. درخواست مجوز برای Push Notification
• 63. ارسال Push Notification از سمت سرور (Web Push Protocol)
• 64. دریافت Push Notification در Service Worker (push event)
• 65. نمایش Push Notification به کاربر (showNotification)
• 66. مدیریت کلیک روی Push Notification (notificationclick event)
• 67. گزینه‌ها و اکشن‌ها در Push Notification
• 68. دیباگ کردن Service Worker با DevTools
• 69. Workbox: کتابخانه ابزار برای Service Worker
• 70. معرفی ماژول‌های اصلی Workbox (workbox-routing, workbox-precaching)
• 71. API موقعیت مکانی (Geolocation API)
• 72. API دوربین و رسانه (Media Devices API)
• 73. API کلیپ‌بورد (Clipboard API)
• 74. API اشتراک‌گذاری وب (Web Share API)
• 75. API مدیریت اعتبارات (Credential Management API)
• 76. API پرداخت (Payment Request API)
• 77. API همگام‌سازی پس‌زمینه پیشرفته (Background Fetch API)
• 78. استفاده از IndexedDB برای ذخیره‌سازی داده‌های ساختاریافته
• 79. وب‌سوکت‌ها (Web Sockets) برای ارتباط بلادرنگ در PWA
• 80. بهینه‌سازی عملکرد PWA: ابزارهای Lighthouse
• 81. بهینه‌سازی بارگذاری: Lazy Loading برای تصاویر و کامپوننت‌ها
• 82. بهینه‌سازی تصاویر و رسانه‌ها برای PWA
• 83. بهینه‌سازی فونت‌ها و Critical CSS
• 84. دسترسی‌پذیری (Accessibility) در PWA
• 85. بین‌المللی‌سازی (Internationalization - i18n) برای PWA
• 86. امنیت پیشرفته در PWA: Content Security Policy (CSP)
• 87. سئو (SEO) برای PWA و ایندکس‌شدن
• 88. تحلیل و مانیتورینگ PWA (Google Analytics)
• 89. Web Components در PWA (مقدماتی)
• 90. تشخیص وضعیت شبکه (Network Information API)
• 91. اصول Progressive Enhancement در PWA
• 92. انتخاب فریم‌ورک/کتابخانه برای PWA (مثال: React, Vue, Angular)
• 93. تست PWA: تست‌های واحد، یکپارچه‌سازی و E2E
• 94. تست کارایی و Lighthouse CI در فرآیند CI/CD
• 95. استقرار PWA در هاستینگ استاتیک (Netlify, Vercel, Firebase Hosting)
• 96. بسته‌بندی PWA برای فروشگاه‌های اپلیکیشن (Trusted Web Activity - TWA)
• 97. انتشار PWA در Google Play Store
• 98. نگهداری و به‌روزرسانی PWA در طول زمان
• 99. آینده PWA و تکنولوژی‌های نوظهور
• 100. ساخت یک PWA نمونه کامل از ابتدا تا استقرار (پروژه عملی)

جادوی PWA: با جاوا اسکریپت وب‌سایت‌هایی بسازید که کاربرانتان عاشقش می‌شوند!

آیا می‌خواهید وب‌سایت‌هایی بسازید که سریع، قابل اعتماد و جذاب باشند؟ آیا می‌خواهید کاربرانتان حتی در حالت آفلاین هم به محتوای شما دسترسی داشته باشند؟ با دوره جامع ساخت Progressive Web Apps (PWA) با جاوا اسکریپت، این رویا را به واقعیت تبدیل کنید!

در دنیای امروز، سرعت و کارایی وب‌سایت‌ها اهمیت فوق‌العاده‌ای دارد. کاربران انتظار دارند وب‌سایت‌ها به سرعت لود شوند، در هر دستگاهی به درستی نمایش داده شوند و حتی در صورت قطع اینترنت هم به بخشی از محتوا دسترسی داشته باشند. PWAها دقیقاً همین کار را انجام می‌دهند. با یادگیری PWA، شما نه تنها مهارت‌های خود را به روز می‌کنید، بلکه وب‌سایت‌هایی می‌سازید که تجربه کاربری بی‌نظیری را ارائه می‌دهند و کسب و کار شما را رونق می‌بخشند.

درباره دوره

دوره ساخت Progressive Web Apps (PWA) با جاوا اسکریپت یک دوره جامع و عملی است که از صفر تا صد ساخت PWA را به شما آموزش می‌دهد. شما در این دوره، با مفاهیم کلیدی PWA مانند Service Workerها، Cache API، و Manifest آشنا می‌شوید و یاد می‌گیرید چگونه این مفاهیم را در پروژه‌های واقعی به کار ببرید. در پایان دوره، شما قادر خواهید بود وب‌سایت‌های موجود خود را به PWA تبدیل کنید و وب‌سایت‌های جدیدی را از ابتدا با رویکرد PWA بسازید.

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

• مفاهیم پایه‌ای PWA: آشنایی با فلسفه و مزایای Progressive Web Apps
• ساخت Service Worker: مدیریت کش و ارائه تجربه آفلاین
• استفاده از Cache API: ذخیره‌سازی و بازیابی منابع برای بهبود سرعت
• ایجاد Manifest: تبدیل وب‌سایت به یک اپلیکیشن قابل نصب
• پوش نوتیفیکیشن‌ها: تعامل با کاربران حتی زمانی که در وب‌سایت نیستند
• بهینه‌سازی PWA: بهبود عملکرد و افزایش سرعت لود
• تست و دیباگ PWA: اطمینان از عملکرد صحیح و بدون نقص
• امنیت PWA: محافظت از داده‌های کاربران و جلوگیری از حملات
• پیاده‌سازی Best Practices: رعایت استانداردهای روز دنیا
• تبدیل وب‌سایت‌های موجود به PWA

مخاطبان دوره

این دوره برای افراد زیر مناسب است:

• توسعه‌دهندگان وب (Frontend و Backend)
• طراحان وب
• دانشجویان رشته‌های کامپیوتر و فناوری اطلاعات
• صاحبان کسب و کار که می‌خواهند وب‌سایت خود را به PWA تبدیل کنند
• هر کسی که به یادگیری PWA و ساخت وب‌سایت‌های مدرن علاقه‌مند است

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

گذراندن این دوره به دلایل زیر برای شما مفید خواهد بود:

• افزایش سرعت وب‌سایت: PWAها به سرعت لود می‌شوند و تجربه کاربری بهتری را ارائه می‌دهند.
• بهبود عملکرد آفلاین: کاربران می‌توانند حتی در صورت قطع اینترنت هم به بخشی از محتوای وب‌سایت شما دسترسی داشته باشند.
• افزایش نرخ تبدیل: تجربه کاربری بهتر منجر به افزایش نرخ تبدیل و فروش می‌شود.
• کاهش هزینه‌ها: PWAها نسبت به اپلیکیشن‌های Native ارزان‌تر هستند و نیاز به توسعه جداگانه برای پلتفرم‌های مختلف ندارند.
• بهبود SEO: گوگل به وب‌سایت‌هایی که عملکرد بهتری دارند، رتبه بهتری می‌دهد.
• افزایش تعامل با کاربران: با استفاده از پوش نوتیفیکیشن‌ها، می‌توانید با کاربران خود در ارتباط باشید و آن‌ها را به وب‌سایت خود بازگردانید.
• کسب مهارت‌های مدرن: PWA یک فناوری نوین و پرکاربرد است که یادگیری آن، شما را به یک توسعه‌دهنده حرفه‌ای تبدیل می‌کند.
• ارتقای شغلی: مهارت‌های PWA در بازار کار بسیار ارزشمند هستند و می‌توانند به شما در ارتقای شغلی کمک کنند.
• افزایش رضایت مشتری: ارائه یک تجربه کاربری عالی، رضایت مشتریان شما را افزایش می‌دهد و باعث می‌شود آن‌ها به شما وفادار بمانند.

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

این دوره شامل 100 سرفصل جامع و کاربردی است که تمامی جنبه‌های PWA را پوشش می‌دهد. در اینجا به برخی از مهم‌ترین سرفصل‌ها اشاره می‌کنیم:

• بخش 1: مقدمه‌ای بر PWA
  • 1.1 - PWA چیست؟ تعریف و مفهوم
  • 1.2 - مزایای استفاده از PWA
  • 1.3 - PWA در مقابل وب‌سایت‌های سنتی و اپلیکیشن‌های Native
  • 1.4 - تاریخچه و آینده PWA
  • 1.5 - ابزارهای لازم برای توسعه PWA
• بخش 2: Service Worker
  • 2.1 - Service Worker چیست و چگونه کار می‌کند؟
  • 2.2 - چرخه حیات Service Worker
  • 2.3 - ثبت Service Worker
  • 2.4 - مدیریت رویدادهای Service Worker (Install, Activate, Fetch)
  • 2.5 - استفاده از Service Worker برای Cache کردن منابع
• بخش 3: Cache API
  • 3.1 - معرفی Cache API
  • 3.2 - ایجاد و مدیریت Cache
  • 3.3 - اضافه کردن، حذف کردن و جستجو در Cache
  • 3.4 - استراتژی‌های Cache (Cache First, Network First, Cache Only, Network Only)
  • 3.5 - بهینه‌سازی Cache برای عملکرد بهتر
• بخش 4: Manifest
  • 4.1 - فایل Manifest چیست و چه کاربردی دارد؟
  • 4.2 - ایجاد و پیکربندی فایل Manifest
  • 4.3 - افزودن آیکون‌ها و نام اپلیکیشن
  • 4.4 - تنظیمات Display Mode و Orientation
  • 4.5 - افزودن Short Name و Description
• بخش 5: پوش نوتیفیکیشن‌ها
  • 5.1 - معرفی پوش نوتیفیکیشن‌ها
  • 5.2 - نحوه کارکرد پوش نوتیفیکیشن‌ها
  • 5.3 - دریافت اجازه از کاربر برای ارسال نوتیفیکیشن
  • 5.4 - ارسال نوتیفیکیشن از طریق Push API
  • 5.5 - مدیریت کلیک روی نوتیفیکیشن‌ها
• بخش 6: بهینه‌سازی PWA
  • 6.1 - بهینه‌سازی تصاویر و فونت‌ها
  • 6.2 - استفاده از تکنیک‌های Lazy Loading
  • 6.3 - کاهش حجم کدهای JavaScript و CSS
  • 6.4 - استفاده از Content Delivery Network (CDN)
  • 6.5 - بهینه‌سازی برای موبایل
• بخش 7: تست و دیباگ PWA
  • 7.1 - استفاده از Chrome DevTools برای تست PWA
  • 7.2 - دیباگ Service Worker
  • 7.3 - شبیه‌سازی شرایط آفلاین
  • 7.4 - بررسی عملکرد PWA
  • 7.5 - استفاده از Lighthouse برای بهبود PWA
• بخش 8: امنیت PWA
  • 8.1 - استفاده از HTTPS
  • 8.2 - جلوگیری از حملات Cross-Site Scripting (XSS)
  • 8.3 - جلوگیری از حملات Cross-Site Request Forgery (CSRF)
  • 8.4 - اعتبار سنجی داده‌ها
  • 8.5 - استفاده از Content Security Policy (CSP)
• بخش 9: پیاده‌سازی Best Practices
  • 9.1 - رعایت استانداردهای PWA
  • 9.2 - استفاده از معماری مناسب
  • 9.3 - نوشتن کدهای تمیز و قابل نگهداری
  • 9.4 - مستندسازی کدها
  • 9.5 - استفاده از Git برای مدیریت کد
• بخش 10: تبدیل وب‌سایت‌های موجود به PWA
  • 10.1 - ارزیابی وب‌سایت موجود
  • 10.2 - افزودن Manifest
  • 10.3 - پیاده‌سازی Service Worker
  • 10.4 - تست و دیباگ PWA
  • 10.5 - انتشار PWA

... و بسیاری سرفصل‌های دیگر که به شما کمک می‌کنند به یک متخصص PWA تبدیل شوید.