مش ليستة لوجوهات. كل مرحلة بتقولك تتعلم إيه، وليه مهم، وإزاي تعرف إنك اتعلمته فعلاً، وتبني بيه إيه. اتعلم المفاهيم، مش الأدوات.
مجاني، من غير تسجيل
إعداد مصطفى محمد عبدالله, Frontend Team Lead و Senior Software Engineer · آخر مراجعة
إجبارية على الكل، مهما كان ال Framework اللي هتختاره بعد كده.
HTTP و DNS وال Hosting، وال Browser بيعمل إيه بالكود بتاعك.
٤ Topics٤ لازم تعرفهمحوالي ١ أسبوع لو ساعتين في اليوم
Semantic structure، وال Forms، وال Elements اللي بتعمل الشغل بدالك.
٤ Topics٣ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
ال Layout، وال Responsive design، وفيتشرز CSS اللي شالت نص ال JavaScript بتاعك.
٦ Topics٥ لازم تعرفهمحوالي ٥ أسبوع لو ساعتين في اليوم
اللغة وال Browser: ال Syntax وال Data وال DOM وال Events وال Debugging.
٤ Topics٤ لازم تعرفهمحوالي ٥ أسبوع لو ساعتين في اليوم
ورا الكواليس: ال Scope وال Closures و this وال Prototypes وال Event loop وال Async.
٣ Topics٢ لازم تعرفهمحوالي ٤ أسبوع لو ساعتين في اليوم
ال Version control، وإنك تشتغل مع فريق صح. ابدأ تستخدمه من أول يوم.
٢ Topics٢ لازم تعرفهمحوالي ١٫٥ أسبوع لو ساعتين في اليوم
ال Default في أي شغل frontend احترافي. ال Types كتوثيق وكشبكة أمان.
٣ Topics٢ لازم تعرفهمحوالي ٣ أسبوع لو ساعتين في اليوم
npm و pnpm وأخواتهم، و Vite، وال Linters وال Formatters: المكنة اللي حوالين الكود بتاعك.
٤ Topics٤ لازم تعرفهمحوالي ١٫٥ أسبوع لو ساعتين في اليوم
إنك تبني للكيبورد وال Screen readers ولكل الناس. وبقت مطلوبة قانونياً في أماكن كتير.
٣ Topics٢ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
اختار Framework واحد واتعمق فيه. اعمل Track واحد بس، مش التلاتة.
اختار Track واحد بس من دول:
React 19 بعمق، وال Server state، وال Forms، و Next.js لتطبيقات ال Production.
٨ Topics٦ لازم تعرفهمحوالي ١٠ أسبوع لو ساعتين في اليوم
ال Signals وال Dependency injection و RxJS و Angular SSR لتطبيقات Enterprise.
٧ Topics٥ لازم تعرفهمحوالي ١٠ أسبوع لو ساعتين في اليوم
ال Composition API و Pinia و Nuxt لتطبيقات Vue كاملة.
٤ Topics٤ لازم تعرفهمحوالي ٩ أسبوع لو ساعتين في اليوم
اللي بيحوّل 'أقدر أبنيه' ل 'أقدر أطلّعه وأخليه شغال'.
Tailwind، وال Component libraries، وال Design tokens، والشغل مع الديزاينرز.
٣ Topics٢ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
CSR و SSR و SSG و ISR وال Streaming، وإزاي تظهر على Google.
٢ Topics٢ لازم تعرفهمحوالي ١٫٥ أسبوع لو ساعتين في اليوم
REST و GraphQL وال Real-time وال Streaming، من ناحية ال Client.
٣ Topics١ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
Unit و Component و End-to-end tests بتديك ثقة، مش شغل على الفاضي.
٢ Topics٢ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
Core Web Vitals، والصور، والخطوط، وال Bundles، وإنك تقيس قبل ما تحسّن.
٣ Topics٢ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
XSS و CSRF و CORS و CSP وال Auth tokens و OWASP Top 10 للفرونت إند.
٤ Topics٣ لازم تعرفهمحوالي ١٫٥ أسبوع لو ساعتين في اليوم
مش عشان تبقى Backend developer: عشان تشتغل معاه بثقة، وتقدر تطلّع منتج كامل لوحدك.
٤ Topics١ لازم تعرفهمحوالي ٤ أسبوع لو ساعتين في اليوم
Checks أوتوماتيك، و Preview deploys، وإنك تطلّع شغلك بأمان كل يوم.
٤ Topics٢ لازم تعرفهمحوالي ١٫٥ أسبوع لو ساعتين في اليوم
اتعلم بال AI، واشتغل بال AI، وراجع كود ال AI، وابني فيتشرز AI.
٥ Topics٣ لازم تعرفهمحوالي ٢ أسبوع لو ساعتين في اليوم
العمق، والقيادة، وإنك تحوّل مهاراتك لشغل.
Web Components و PWAs و Service workers و Web Workers.
٣ Topicsمفتوحةحوالي ٢ أسبوع لو ساعتين في اليوم
ال Architecture وال System design وال i18n وال Monorepos، وإنك تقود مطورين تانيين.
٥ Topics٣ لازم تعرفهمحوالي ٨ أسبوع لو ساعتين في اليوم
حوّل اللي بنيته لدليل، والدليل لعروض شغل.
٣ Topics٣ لازم تعرفهمحوالي ٤ أسبوع لو ساعتين في اليوم
الموبايل، والديسكتوب، و 3D، و Framework تاني: تروح فين بعد ما تثبّت رجلك.
٤ Topicsمفتوحة
أسرع طريق مش إنك تتعلم كل حاجة. دول أكتر حاجات بتضيّع وقت المبتدئين.
لو بتذاكر حوالي ساعتين في اليوم، أغلب الناس بيبقوا جاهزين لوظيفة Junior في 9 ل 12 شهر: الأساسيات، و Framework track واحد، وال Testing، وال Deployment. ولو بتذاكر Full-time ممكن المدة تتقسم على اتنين. أما الوصول لمستوى Senior فبياخد سنين شغل حقيقي، مش مذاكرة بس.
لأ. ركّز على ال Topics اللي عليها 'لازم تعرفه' الأول. اللي عليها 'اتعلمه بعدين' غالباً بتتعلمها في الشغل، و'اختياري' على حسب هدفك أو الشركة. ومحتاج Framework track واحد بس، مش التلاتة.
React عليه أكتر شغل في العالم. Angular قوي جداً في ال Enterprise وفي أسواق معينة. بص على 20 إعلان وظيفة في السوق اللي عايز تشتغل فيه، وبعدين اختار واحد وكمّل فيه. المفاهيم بتتنقل من واحد للتاني.
أيوه، بس المستوى المطلوب اتغير. ال AI بيكتب كود بسرعة، والشركات محتاجة حد يقدر يحكم على الكود ده، ويبقى مسؤول عن تجربة المنتج، ويتعامل مع ال Accessibility وال Performance وال Security. الأساسيات القوية بقت أهم من الأول، مش أقل.
لأ. مطورين فرونت إند كتير اتعلموا لوحدهم. ال Portfolio القوي وال GitHub النضيف والتحضير الكويس لل Interviews بيفرقوا أكتر عند أغلب الشركات.
محتاج تفهم الباك إند، مش تبقى خبير فيه: HTTP، وال Authentication، وتصميم ال APIs، و Node.js و SQL كفاية إنك تبني App full-stack صغير. ده بيخليك مستقل أكتر بكتير، وبقى مطلوب أكتر.
كل Topic معاه لينكات للدوكيومنتيشن الرسمي، والصفحة بتوضح تاريخ آخر مراجعة. وبتتحدث كل ما ال Ecosystem يتغير.
كل اللي في الصفحة دي مجاني وكامل: تقدر تمشي عليه لوحدك وتتعيّن. ال Mentorship لما تحب حد يبص على شغلك الحقيقي، ويظبّط الخطة على ظروفك، ويفضّل ماشي معاك.
مش متأكد إنك محتاجه؟ غالباً لسه لأ. ابدأ بال Roadmap، وقدّم لما توقف أو تحب Feedback أسرع. مكالمة التعارف هي اللي بنقرر فيها سوا لو ال Mentorship هو الخطوة المناسبة.