Roadmap Web Development

Theo dõi lộ trình có cấu trúc của chúng tôi để trở thành lập trình viên web full-stack. Mỗi bước đều xây dựng trên những kiến thức trước đó.

Internet

Hiểu cách thức hoạt động của Internet

HttpDomainHostingBrowserDNS

Nội dung chính:

Cách Internet Hoạt Động

Tìm hiểu về cách thức hoạt động của Internet, bao gồm các giao thức cơ bản như HTTP và HTTPS.

How the Internet Works - MDN →

HTTP và HTTPS

Khám phá cách thức hoạt động của HTTP và HTTPS, bao gồm các khái niệm như request, response, và SSL/TLS.

MDN Web Docs - HTTP →W3Schools - HTTP Tutorial →

DNS là gì?

Tìm hiểu về hệ thống tên miền (DNS) và cách nó hoạt động.

MDN Web Docs - DNS →W3Schools - DNS Tutorial →

1-3 ngàyBeginner

HTML

Học cấu trúc cơ bản của trang web

HTML5Semantic HTMLFormsAccessibility

Nội dung chính:

Các thẻ HTML Cơ Bản

Tìm hiểu về các thẻ HTML cơ bản như <div>, <span>, <a>, <img>, và cách sử dụng chúng để xây dựng cấu trúc trang web.

HTML Tutorial - W3Schools →MDN Web Docs - HTML →

1-2 tuầnIntermediate

CSS

Học cách tạo kiểu cho trang web

CSSResponsive DesignFlexboxGrid

Nội dung chính:

CSS Cơ Bản

Tìm hiểu về các khái niệm cơ bản của CSS, bao gồm cách sử dụng các thuộc tính CSS để tạo kiểu cho các phần tử HTML.

CSS Tutorial - W3Schools →MDN Web Docs - CSS →

1-2 tuầnIntermediate

JavaScript

Học cách lập trình với JavaScript

JavaScriptDOM ManipulationES6+Asynchronous Programming

Nội dung chính:

JavaScript Cơ Bản

Tìm hiểu về các khái niệm cơ bản của JavaScript, bao gồm biến, kiểu dữ liệu, và cấu trúc điều khiển.

JavaScript Tutorial - W3Schools →MDN Web Docs - JavaScript →

2-4 tuầnIntermediate

Quản Lý Mã Nguồn

Học cách quản lý và theo dõi thay đổi trong mã nguồn

GitGitHubGitLabBranchingCollaboration

Nội dung chính:

Git Cơ Bản

Tìm hiểu về Git và các lệnh cơ bản như commit, push, pull

Git Guide →Git Tutorial - W3Schools →

Làm Việc Nhóm với Git

Học cách sử dụng branch, merge và giải quyết xung đột

Git Branching →

Git Flow

Quy trình làm việc hiệu quả với Git trong dự án thực tế

Git Flow Guide →

1-2 tuầnBeginner

Frontend Framework

Làm chủ các framework frontend phổ biến

ReactVueAngularState ManagementRouting

Nội dung chính:

React.js

Framework phổ biến nhất để xây dựng UI với JavaScript

React Official Docs →React Tutorial →

Next.js

Framework React với SSR, routing và nhiều tính năng mạnh mẽ

Next.js Learn →

Quản Lý State

Học cách quản lý state với Redux, Context API, Zustand

Redux Tutorial →

8-12 tuầnIntermediate

Kiểm Thử Frontend

Học cách viết test cho ứng dụng frontend

Unit TestingIntegration TestingE2E TestingJestCypress

Nội dung chính:

Unit Testing với Jest

Viết test cho các component và function riêng lẻ

Jest Getting Started →

Testing Library

Thư viện testing cho React và các framework khác

React Testing Library →

E2E Testing với Cypress

Viết test tự động mô phỏng hành vi người dùng

Cypress Docs →

3-4 tuầnIntermediate

Tối Ưu Hiệu Năng

Học cách tối ưu hiệu năng cho ứng dụng web

Lazy LoadingCode SplittingCachingWeb VitalsSEO

Nội dung chính:

Core Web Vitals

Hiểu và tối ưu các chỉ số hiệu năng quan trọng

Web Vitals →

Tối Ưu Bundle Size

Giảm kích thước bundle với code splitting và lazy loading

Performance Guide →

SEO và Accessibility

Tối ưu website cho công cụ tìm kiếm và người dùng

SEO Guide →Web Accessibility →

3-4 tuầnAdvanced

Frontend Development Path

Tập trung vào giao diện người dùng, trải nghiệm người dùng và các framework hiện đại để xây dựng ứng dụng web tương tác.

8 giai đoạn

33 tuần tối đa