۱
گام ۱ · ۴ هفته
مبانی وب و دسترس‌پذیری
صفحهٔ معنایی و واکنش‌گرا با فرم و پیمایش صفحه‌کلید بساز.
آخر این گام، این رو بساز: یه صفحهٔ معرفی واکنش‌گرا بساز؛ با Tab توش حرکت کن و کدت رو توی Git نگه دار.
htmlcssaccessibilitygit
پیشنهاد هوشمند و قابل اجرا
مسیر شغلی و نقشه راه یادگیری تو
هدف، زمان و مهارت‌های فعلیت رو مشخص کن؛ من، زرنگو، مسیر مناسب رو پیشنهاد می‌دم و قدم‌هاش رو با منابع متناسب برات می‌چینم.
منبع آموزشی۳۵
پیشنهادهای برتر۱۱
زمان هفتگی۶
مسیرهای پیشنهادی؛ برای دیدن نقشه راه انتخاب کن
نقشه راه پیشنهادی
۳ جلسه یادگیری و ۲ تمرین در هفتهتوسعهدهنده فرانت‌اند
من زرنگوام؛ لازم نیست همهٔ ابزارها رو یک‌جا یاد بگیری. هر گام رو با یه خروجی کوچک تمام کن و بعد برو سراغ بعدی.
مدت‌ها برآوردی هستند و با ساعت هفتگی تو تنظیم می‌شن؛ پروژه و مرور بخشی از زمان یادگیری است.
۲
گام ۲ · ۵ هفته
رابط کامپوننتی با TypeScript
تابع، درخواست غیرهم‌زمان، وضعیت کامپوننت و props تایپ‌شده رو تمرین کن.
آخر این گام، این رو بساز: یه فهرست قابل جست‌وجو با React بساز و برای داده‌ها تایپ مشخص بنویس.
javascripttypescriptreact
۳
گام ۳ · ۴ هفته
مرز سرور و کلاینت
صفحه‌های App Router، وضعیت بارگذاری و دریافت دادهٔ سرور رو در برنامهٔ کوچک تمرین کن.
آخر این گام، این رو بساز: یه صفحهٔ جزئیات با دادهٔ سرور و حالت بارگذاری و خطا منتشر کن.
nextjsdatabasesecurity
۴
گام ۴ · ۳ هفته
تست و انتشار
کار اصلی کاربر و دسترسی صفحه‌کلید رو تست و پروژهٔ منتشرشده رو مستند کنید.
آخر این گام، این رو بساز: تست یه کار اصلی کاربر رو بنویس، لینک پروژه و راهنمای اجرا رو به یه نفر بده.
testingportfolioperformance
این مسیر، جمع‌بندی و پیشنهاد زرنگو با کمک منابع زیره؛ زمان‌ها تخمینی‌اند و تضمین استخدام نیستند.
roadmap.sh · Frontend DeveloperOfficial learning referenceبازبینی: ۲۵ مهر ۱۴۰۵
دوره‌های مناسب این مسیر
منابع با بودجه و زبان انتخابی تو فیلتر شده‌ان.
MDN · انگلیسی
آموزش توسعهٔ وب MDN
با برنامهٔ آموزشی MDN، استانداردهای وب، HTML معنایی، CSS و JavaScript را از پایه شروع کنید. متن منبع انگلیسی است.
برنامه‌نویسیمبتدی
web.dev · انگلیسی
آموزش دسترس‌پذیری وب
معرفی عملی محتوای معنایی، دسترسی صفحه‌کلید، فرم دسترس‌پذیر و رابط فراگیر.
طراحیمبتدی
React · انگلیسی
شروع کار با React
با راهنمای رسمی React، کامپوننت، JSX، پراپ، رویداد و مدیریت وضعیت مشترک را یاد بگیرید.
برنامه‌نویسیمبتدی