Master Frontend

Appearance

Master FrontendLộ trình từ Foundation đến Staff-level

Bắt đầu từ Stage 0
Xem toàn bộ lộ trình
🌀

Spiral Learning

3 vòng cho mỗi module — Foundation → Application → Mastery. Hiểu sâu thay vì nhớ nhiều. Mỗi lần lặp lại là lần hiểu sâu hơn.

✅

Exit Criteria rõ ràng

Không sang module tiếp theo khi chưa đạt Exit Criteria. Không đếm ngày, không đếm giờ. Mỗi checkbox phải giải thích được cho người khác.

🏗️

6 Dự án thực chiến

Stage 2–7 là 6 project thật với business context thật. Không demo, không tutorial. SaaS Landing, E-commerce Checkout, Admin Dashboard, Social Feed, Design System, Legacy Migration.

🔄

Core Loop Vĩnh Cửu

Foundation → Project → Production → Incident → Refactor → Teach Back → Open Source → Foundation (lần 2). Không bao giờ "xong" — chỉ có tiến bộ.

🧠

Deliberate Practice

Source Code Reading, Edge Case Lab, War Story Documentation, Teach Back — 4 hoạt động bắt buộc mỗi tuần để chuyển kiến thức thành kỹ năng.

📈

Sẵn sàng phỏng vấn Senior 5+

Stage 8 consolidation — RADIO framework, live coding, system design, behavioral interview, đàm phán lương. Không học để pass, học để trở thành.

8 Stage — Từ nền tảng đến sẵn sàng phỏng vấn ​

StageTênMục tiêuSố module
Stage 0FoundationHiểu máy tính chạy code và trình duyệt render trang trước khi chạm framework18
Stage 1Build & ToolingCầm búa đúng cách — bundler, package manager, monorepo, git workflow6
Stage 2Project 1: SaaS Landing + BlogSản phẩm thực tế đầu tiên — React/Next.js, a11y, animation, mobile, SEO, auth, testing26
Stage 3Project 2: E-commerce CheckoutCheckout flow — state management, Stripe, PWA offline, resilience, animation UX18
Stage 4Project 3: Admin DashboardEnterprise analytics — RBAC, real-time SSE, virtual scroll, Turborepo, OpenTelemetry26
Stage 5Project 4: Social FeedReal-time + AI — WebSockets, optimistic update, gesture, LLM streaming9
Stage 6Project 5: Design SystemComponent library — tokens, Radix, Storybook, Chromatic, micro-frontends15
Stage 7Project 6: Legacy MigrationjQuery → React — Strangler Fig, supply chain security, AI verify, incident response13
Stage 8Tổng hợp & Phỏng vấnConsolidation — portfolio, mock interview, live coding, đàm phán lương12

Triết lý cốt lõi ​

"Không hời hợt, nghiên cứu sâu."

Lộ trình này không tuyến tính.

Bạn không bao giờ "hoàn thành Stage 8".

Thay vào đó, bạn bước vào Core Learning Loop — mỗi vòng lặp giúp bạn nhìn sâu hơn, viết code tốt hơn và giải quyết những bài toán khó hơn.

Master Frontend Spiral Learning Loop

Ý nghĩa từng bước ​

Biểu tượngGiai đoạnÝ nghĩa
🏗FoundationHọc bản chất.
🚀ProjectXây sản phẩm thật.
🌐ProductionDeploy và phục vụ người dùng.
🚨IncidentGặp bug thật, sự cố thật.
🔧RefactorCải tiến sau khi hiểu vấn đề.
👨‍🏫Teach BackViết blog, mentoring.
❤️Open SourceĐóng góp cộng đồng và tiếp tục học.

Quy tắc duy nhất ​

Không sang module sau khi chưa đạt Exit Criteria module trước.

Mỗi checkbox trong checklist là một kiến thức bạn PHẢI giải thích được cho người khác. Nếu không giải thích được, chưa hiểu sâu — quay lại học.

Bắt đầu ​

Master Frontend — Chương trình đào tạo Frontend Engineering