دوره پروژه محور: ساخت وبسایت با HTML و CSS همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

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

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

عنوان دوره: دوره پروژه محور: ساخت وبسایت با HTML و CSS

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

موضوع میانی: توسعه وب: فرانت‌اند**

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

• 1. مقدمه‌ای بر ساخت وب‌سایت
• 2. آشنایی با زبان HTML
• 3. ساختار اصلی صفحات HTML
• 4. عناصر متنی در HTML
• 5. ایجاد لینک‌ها در HTML
• 6. کار با تصاویر در HTML
• 7. فهرست‌ها در HTML
• 8. جداول در HTML
• 9. فرم‌ها در HTML
• 10. عناصر معنایی (Semantic) در HTML5
• 11. عناصر چندرسانه‌ای در HTML5 (صدا و ویدئو)
• 12. آشنایی با زبان CSS
• 13. نحو و قواعد CSS
• 14. انتخابگرها در CSS
• 15. قواعد عمومی CSS
• 16. رنگ‌ها و پس‌زمینه‌ها در CSS
• 17. مدیریت فونت‌ها در CSS
• 18. کادربندی و حاشیه در CSS
• 19. فاصله‌گذاری در CSS (Margin و Padding)
• 20. مدیریت اندازه و ابعاد عناصر
• 21. مدیریت نمایش عناصر (Display)
• 22. موقعیت‌دهی عناصر (Position)
• 23. تکنیک‌های چیدمان (Layout) با Float
• 24. تکنیک‌های چیدمان با Flexbox
• 25. تکنیک‌های چیدمان با Grid
• 26. تبدیلات (Transforms) در CSS
• 27. انتقال‌ها (Transitions) در CSS
• 28. انیمیشن‌ها (Animations) در CSS
• 29. طراحی واکنش‌گرا (Responsive Design)
• 30. استفاده از Media Queries
• 31. بهینه‌سازی تصاویر برای وب
• 32. مدیریت فونت‌های سفارشی (Custom Fonts)
• 33. کار با آیکون‌ها (Icon Fonts)
• 34. مقدمه‌ای بر پیش‌پردازنده‌های CSS (Sass/Less)
• 35. نصب و پیکربندی Sass
• 36. نحو Sass (متغیرها، توابع)
• 37. نحو Sass (درون‌آمیزی، Mixins)
• 38. نحو Sass (وراثت، Extend)
• 39. سازماندهی فایل‌های CSS
• 40. اصول طراحی رابط کاربری (UI Design)
• 41. اصول تجربه کاربری (UX Design)
• 42. اصول دسترسی‌پذیری (Accessibility) در وب
• 43. کار با ابزارهای توسعه‌دهنده مرورگر
• 44. اشکال‌زدایی (Debugging) HTML و CSS
• 45. معرفی فریم‌ورک‌های CSS (Bootstrap)
• 46. نصب و راه‌اندازی Bootstrap
• 47. استفاده از کامپوننت‌های Bootstrap
• 48. شخصی‌سازی Bootstrap
• 49. معرفی فریم‌ورک‌های CSS (Tailwind CSS)
• 50. نصب و راه‌اندازی Tailwind CSS
• 51. استفاده از کلاس‌های Utility در Tailwind
• 52. شخصی‌سازی Tailwind CSS
• 53. ساخت فرم‌های سفارشی
• 54. طراحی هدر و فوتر واکنش‌گرا
• 55. ایجاد منوهای ناوبری (Navigation Menus)
• 56. طراحی کارت‌های اطلاعاتی (Cards)
• 57. ساخت گالری تصاویر واکنش‌گرا
• 58. پیاده‌سازی اسلایدرها و کاروسل‌ها
• 59. طراحی صفحات فرود (Landing Pages)
• 60. بهینه‌سازی سرعت بارگذاری صفحات
• 61. مدیریت کش مرورگر
• 62. استفاده از SVG در وب
• 63. مقدمه‌ای بر JavaScript برای فرانت‌اند
• 64. مبانی JavaScript (متغیرها، انواع داده)
• 65. ساختار کنترلی در JavaScript (شرط‌ها، حلقه‌ها)
• 66. توابع در JavaScript
• 67. اشیاء و آرایه‌ها در JavaScript
• 68. کار با DOM (Document Object Model)
• 69. تغییر محتوا و استایل با JavaScript
• 70. مدیریت رویدادها (Events) در JavaScript
• 71. اعتبارسنجی فرم‌ها با JavaScript
• 72. ارسال داده‌ها با Fetch API
• 73. مفاهیم اولیه AJAX
• 74. کار با JSON
• 75. مدیریت خطاها در JavaScript
• 76. ساخت اسلایدر با JavaScript
• 77. پیاده‌سازی منوهای بازشو (Dropdowns)
• 78. طراحی مودال‌ها (Modals) با JavaScript
• 79. مقدمه‌ای بر فریم‌ورک‌های JavaScript (React/Vue - رویکرد کلی)
• 80. مبانی کامپوننت‌ها در فریم‌ورک‌ها
• 81. مدیریت وضعیت (State Management)
• 82. مسیریابی (Routing) در برنامه‌های تک‌صفحه‌ای
• 83. ساخت یک پروژه نمونه (HTML/CSS)
• 84. طراحی ساختار اصلی پروژه
• 85. پیاده‌سازی بخش هدر و ناوبری
• 86. طراحی بخش محتوای اصلی
• 87. ساخت فوتر و اطلاعات تماس
• 88. افزودن تصاویر و آیکون‌ها
• 89. بهینه‌سازی برای دستگاه‌های مختلف
• 90. تست و اشکال‌زدایی نهایی
• 91. ملاحظات امنیتی در توسعه وب (مبانی)
• 92. اصول پایگاه داده (مبانی، سازگار با قوانین)
• 93. مقدمه‌ای بر سیستم‌های مدیریت محتوا (CMS) - رویکرد سازگار
• 94. جمع‌بندی و گام‌های بعدی در توسعه وب