Lộ trình tự học Fullstack 6 tháng theo tuần.¶

Hiện tại lộ trình này mình viết cho cá nhân mình dùng nên nó vẫn chưa được hoàn chỉnh. Mình cũng sẽ chỉnh sửa và cải thiện trong quá trình học luôn.

Thời gian học lộ trình này chỉ mang tính chất ước lượng

Bạn có thể sẽ hoàn thành nó chậm hơn hoặc nhanh hơn so với thời gian mà chương trình đề cập. Phần này tùy thuộc vào bạn. Vậy nên, kể cả khi mình hoàn thành nó sau 6 tháng cũng không vấn đề gì. Điều quan trọng nhất là cần duy trì thói quen học hàng ngày.

Chọn lộ trình khác¶

Nếu bạn muốn học những lộ trình khác thì có thể thử:

Lộ trình mình viết lại để khắc phục những "nhược điểm" (theo cá nhân mình thôi nha) của TOP và FCC:

FCC quá tập trung vào làm bài tập thực hành: Nghe có vẻ hơi ngược đời nhưng cách học của mình muốn là "học kiến thức nền tảng và đi xây dựng những dự án mà mình chọn". Mình khi học FCC hay cố hoàn thành bài tập cho xong mà không cảm thấy như đống kiến thức đó được sử dụng thực tế.
TOP không thống nhất trong nguồn tài nguyên: Họ gợi ý mỗi việc học một phần kiến thức ở một trang khác nhau. Mình nghĩ là nó khá hay cho việc học thêm, nhưng nó khá phức tạp và phải chuyển qua chuyển lại các trang khác. Dù vậy nhưng lộ trình này cũng gợi ý kiểu vậy :D nhưng nó ít hơn.

Lộ trình học¶

Lộ trình sẽ được chia ra làm 26 tuần. Cách học cơ bản của lộ trình là trong mỗi tuần sẽ có những phần kiến thức mà bạn cần (mình nghĩ là cần) học. Bạn hoàn toàn có thể bỏ qua những phần bạn đã học từ trước hoặc muốn học sau (Khi dự án bạn muốn xây dựng cần đến phần kiến thức đó). Lộ trình này được xây dựng dựa trên lộ trình Fullstack của Repo này.

Về phần dự án hàng tuần, thử nghĩ xem bạn muốn làm ứng dụng gì. Bạn có thể đọc Hướng dẫn xây dựng dự án cơ bản để học cách bắt đầu lên ý tưởng.

Mỗi tuần bạn nên thử làm ít nhất một dự án (một ứng dụng đơn giản để áp dụng các nội dung bạn đã học trong tuần, gì cũng được). Mình sẽ để một danh sách gợi ý bên dưới.

Tuần 1: HTML, CSS¶

Bạn sẽ học¶

HTML/CSS cơ bản và responsive design

Nguồn tài nguyên học¶

Nguồn học cơ bản:

Nếu học trên FullStackOpen thì học phần Part 0 - Fundamentals of Web apps

Đọc thêm các nội dung khác liên quan đến HTML/CSS:

Giới thiệu về DOM - Tìm hiểu về DOM (Document Object Model). Sẽ có một chút phần code của JavaScript, bạn có thể bỏ qua và chỉ cần tập trung vào hiểu DOM là gì.
Guide to Writing Semantic HTML - Cách viết semantic HTML (Semantic HTML refers to the use of HTML markup to convey the meaning of the content on a web page, rather than just its appearance)
Don't click here

Tuần 2: JavaScript cơ bản¶

Bạn sẽ học¶

JavaScript cơ bản

Các nội dung cơ bản như: variables (biến), loops (vòng lặp), functions (hàm), và arrays (chuỗi).
Tìm hiểu về các chức năng ES6 như let, const, và arrow functions.
DOM manipulation

Nguồn tài nguyên học¶

30-Days-Of-JavaScript - Học từ đầu - Khóa này đã có người dịch sang Tiếng Việt và bạn có thể đọc luôn: Bản dịch Tiếng Việt của 30-Days-Of-JavaScript.
33 Concepts Every JavaScript Developer Should Know - Tổng hợp những concepts mà "JS devs" nên biết
Nếu bạn thích học thêm thì học khóa JavaScript nâng cao

Trong lúc học HTML/CSS/JS bạn có thể đọc thêm một số bài viết này¶

Command Line Basics - Tìm hiểu cách sử dụng giao diện dòng lệnh cơ bản cho các hệ điều hành Unix-based (MacOS, Linux .etc.)

Tuần 3: Backend (Phần 1)¶

Thường mình thấy trong các khóa học hoặc chương trình khác thì mọi người thường hay cho học Frontend trước. Chương trình này sẽ lựa chọn Backend để khởi đầu trước.

Trích từ một bình luận của một vozer khác trên Thread Fullstack của tôi:

mình nghĩ nên bắt đầu từ BE trước, nắm vững các kiến thức cơ bản về DB, OOP, thuật toán, mạng, Linux,... rồi học liên quan đến setup, build web trên server qua Docker, VPS,... sau đấy mới move dần qua FE. Bắt đầu từ SSR để làm quen với HTML, CSS, JS sau đó chuyển qua CSR làm quen với các lib, framework như React, Vue, Angular

Thanks bác, lộ trình này sẽ học Backend trước rồi mới học Frontend

Bạn sẽ học¶

Những kiến thức cơ bản về Internet: Cách Internet hoạt động, HTTP, tên miền, hosting, DNS, trình duyệt bla bla.
Tìm hiểu về JavaScript runtime environment và Web Server
Viết HTTP servers.
Lựa chọn ngôn ngữ Backend bạn muốn học (JavaScript, Ruby, Java, Go, Rust .etc.) và học cơ bản của nó. Chương trình này sẽ lựa chọn Node.js
Version Control System (Git và Github):
Từ gà tới pro Git và Github trong 20 phút - Tự học Git siêu tốc
Git and Github Crash Course

Nguồn tài nguyên học¶

Awesome Lập trình - Danh sách tổng hợp tài nguyên học lập trình và khoa học máy tính bằng Tiếng Việt.

Nếu bạn đang học Rust thì hãy đọc Hướng dẫn cày Rust

Đọc thêm¶

Commit Messages - Học cách viết Commit Message mỗi khi thực hiện commit trong Git.
Problem Solving - Giải quyết vấn đề trong lập trình.
Understanding Errors - Hiểu về lỗi trong lập trình (Bài viết này tập trung vào JS, nhưng đọc để hiểu về tư duy về lỗi lập trình khá hay)
Clean Code - Phần lớn thời gian lập trình được dành để đọc Code. Hướng dẫn viết Code dễ đọc.

Tuần 4: Backend (Phần 2)¶

Bạn sẽ học¶

Học HTTP basics, request-response cycle.
Tạo REST APIs.

Tài nguyên học¶

Khóa Node.js và Express.js của F8

Nếu bạn cũng đang học Rust như mình thì:

Có thể bạn sẽ muốn đọc thêm¶

Tuần 5: NoSQL Databases (MongoDB)¶

Bạn sẽ học¶

Tìm hiểu về NoSQL concepts
Perform CRUD operations with MongoDB.
Tìm hiểu về schema design và indexing:
Database Schema Design - Thiết kế cơ sở dữ liệu.
Index trong database là gì? Tại sao cần Index Database?

Nguồn tài nguyên học¶

A Comprehensive NoSQL Tutorial Using MongoDB
Learn About NoSQL Databases in This 3-hour Course
Database Design Course - Learn how to design and plan a database for beginners - Một khóa trên FCC về thiết kế cơ sở dữ liệu
A humble guide to database schema design - Bạn nhớ đọc bình luận cả ở trong bài hướng dẫn này lẫn trên Reddit.

Tuần 6: SQL cơ bản¶

Bạn sẽ học¶

Học SQL syntax.
Thực hiện CRUD operations với SQL databases (e.g., MySQL or PostgreSQL).

Nguồn tài nguyên học¶

Fullstack Vỡ Lòng - Tính đến thời điểm viết lộ trình này thì có 8 bài viết, chủ yếu là về MySQL.
SQLBolt - Learn SQL with simple, interactive exercises
CRUD Nodejs với MySQL

Tuần 7: ORMs (Sequelize/Mongoose)¶

Bạn sẽ học¶

Tìm hiểu về Object-Relational Mapping.
Sử dụng Sequelize cho SQL và Mongoose cho MongoDB.
Understand model relationships - Đây là bài viết về Mô hình quan hệ - thực thể (Entity – Relationship Model) (Bọn mình cũng sẽ học về nội dung này trong khóa Database Design ở tuần 5).

Nguồn tài nguyên học¶

Nếu bạn chưa học MongoDB:
MongoDB - cơ bản (phần 1) - Đây về cơ bản là bản dịch của MongoDB Tutorial. Phần dịch này có lẽ đã bao trùm gần hết các chủ để ở phần đầu. Bạn có thể đọc tiếp từ phần Advanced MongoDB.
Advanced MongoDB
Introduction to Mongoose for MongoDB
Mongoose cho MongoDB, Nodejs

Tuần 8: React cơ bản¶

Nhiều Framework quá @@!¶

Mình viết lộ trình này để mình học và mình chưa hiểu lắm về vụ Framework. Số lượng Framework nhiều quá nên hơi chóng mặt, với một phần là hiện trạng "1m2 8 ông front-end" nên cá nhân mình nghĩ là bạn nên chọn những gì bạn muốn học (Hoặc học Framework mà công việc của bạn cần, không bắt buộc phải học React.js, ví dụ như Vue, Stelve .etc.). Thử đọc mấy ông vozer chém gió chút (mình chưa đọc hết, để tìm hiểu thêm xong mình sẽ viết một bài riêng sau):

Trả lời tất cả những câu hỏi về Front End !!! - Trang 20 của Thread này nói về Next.js với React.js và một số vấn đề xoay quanh nó.
Nextjs sẽ là tương lai cho web dev framework

Bạn sẽ học¶

Học React nền tảng: JSX, components, props, và state.
Sử dụng React Developer Tools.

Nguồn tài nguyên học¶

Đọc thêm:

Tuần 9: Styling React Apps¶

Bạn sẽ học¶

styled-components documentation
Thiết kế (styling) ứng dụng React sử dụng Tailwind CSS hoặc styled-components.
Học responsive design trong React

Nguồn tài nguyên học¶

Tuần 10: TypeScript cơ bản¶

Bạn sẽ học¶

Học TypeScript syntax và static typing.
Tích hợp TypeScript với React.
Tìm hiểu về type declarations cho APIs và models.

Nguồn tài nguyên học¶

Tuần 11: Next.js cơ bản¶

Bạn sẽ học¶

Học server-side rendering (SSR) và static site generation (SSG) - Hoặc đọc Thread trên StackOverflow về chủ đề này.
Xây dựng ứng dụng thân thiện với SEO (SEO-friendly).

Nguồn tài nguyên học¶

Tìm hiểu về Next.js (Phần 1)
Learn Next.js - 16 chapters that take you from React to Next.js - Học trên trang của Next.js

Tuần 12: Monorepos và Turborepo¶

Bạn sẽ học¶

Học monorepos và tìm hiểu cách sắp xếp nhiều dự án khác nhau (?).
Sử dụng Turborepo để tối ưu performance.

Nguồn tài nguyên học¶

Tuần 13: Websockets & RTC cơ bản¶

Bạn sẽ học¶

Học Giao tiếp thời gian thực với Websockets.
Học RTC cho video/audio communication.

Nguồn tài nguyên học¶

Tuần 14: Testing cơ bản¶

Bạn sẽ học¶

Học unit và integration testing:
Sự khác nhau giữa Unit, Integration và Functional Testing
What's the difference between unit tests and integration tests?
Sử dụng Jest và React Testing Library (Nếu bạn chọn học React ở trên, cá nhân mình không học nên sẽ bổ sung phần này sau)
Test APIs và các frontend components.
Sơ lược về API Testing
Học cách test API đơn giản và dễ dàng trong 10 phút

Nguồn tài nguyên học¶

API Testing With Postman - Khóa này bằng Tiếng Việt.
Postman Beginner's Course - API Testing

Tuần 15: Authentication & JWT¶

Bạn sẽ học¶

Tìm hiểu về khái niệm xác thực người dùng Authentication và phân biệt sự khác nhau giữa Authentication và Authorization
Sử dụng JWT (JSON Web Token) và cookies cho session management:
JWT và Session một số thông tin bạn nên biết
JWT – JSON Web Tokens và Session Cookies trong việc Authentication
JSON Web Token hay Session Cookies, đâu mới là chân ái ?
Lưu JWT trong cookie hay local storage?

Nguồn tài nguyên học¶

Session, cookie, CORS, JWT, SSO - Danh sách phát của F8

Tuần 16: Tối ưu cơ sở dữ liệu¶

Bạn sẽ học¶

Tìm hiểu về kĩ thuật tối ưu cơ sở dữ liệu (database optimization techniques). Ví dụ như indexing, query optimization .etc.

Nguồn tài nguyên học¶

Tuần 17: Khái niệm Backend nâng cao¶

Bạn sẽ học¶

Học thêm về asynchronous programming và error handling (Lưu ý cho ai chưa biết thì hai khái niệm này không chỉ giới hạn trong JavaScript).
Học middleware chaining - Theo mình tìm hiểu thì khái niệm này chỉ giới hạn trong Express.js. Đọc bài 'Express Middleware' is just a fancy way of chaining a bunch of functions.
Các khái niệm Backend "cao cấp hơn":

Cập nhật dự án của bạn¶

Viết API và có thêm những tính năng nâng cao như rate limiting và complex queries:
API Rate Limiting là gì và một số thuật toán hay dùng
What does it mean to be able to write "complex" SQL queries?

Nguồn tài nguyên học¶

Tuần 18: Ref, Populate, và API Design¶

Đang trong quá trình thêm

Tuần 19: Các chức năng Frontend nâng cao¶

Bạn sẽ học¶

Học dynamic form handling, animations, và accessibility features trong React.
Tìm hiểu về Framer Motion cho animations.

Tuần 20: Project Planning¶

Bạn sẽ học¶

Lên kế hoạch cho một capstone project (Dự án tốt nghiệp)
Định nghĩa các tính năng, Tạo high-level (HLD) và low-level designs (LLD)

Ghi chú¶

Đây sẽ là một dự án (tương đối) lớn. Trước khi bắt tay vào làm dự án này, bạn nên hoàn thành một số các dự án cỡ nhỏ và vừa. Bạn có thể xem Những DỰ ÁN CÁ NHÂN nên làm khi TỰ HỌC lập trình của ông Dev để tìm hiểu thêm.

Nếu bạn vẫn chưa biết bắt đầu từ đâu để phát triển một ứng dụng nhỏ, hãy đọc Hướng dẫn lên kế hoạch cho một dự án lập trình

Tuần 21: Capstone Backend Development¶

Sau khoảng một tuần lập kế hoạch và học thêm một số các khái niệm liên quan đến HLD và LLD, bây giờ sẽ là lúc bắt đầu.

Bạn sẽ làm¶

Xây dựng phần Backend cho dự án tốt nghiệp của bạn.
Implement CRUD APIs, authentication, và error handling.

Tuần 22: Capstone Frontend Development¶

Bạn sẽ làm¶

Xây dựng Frontend cho dự án tốt nghiệp của bạn.
Có thể sử dụng React/Next.js với Tailwind CSS.

Tuần 23: Real-Time Features trong Capstone¶

Bạn sẽ học¶

Thêm những tính năng real-time sử dụng Websockets hoặc RTC.
Implement live chat hoặc real-time notifications

Tuần 24: Testing và Deployment¶

Bạn sẽ học¶

Test ứng dụng
Deploy lên một nền tảng cloud (e.g., Vercel, Heroku)

Nguồn tài nguyên học¶

Tuần 25: Linting và Performance Optimization¶

Bạn sẽ học¶

Thiết lập các công cụ Linting (e.g., ESLint, Prettier).
Tối ưu performance cho cả Backend và Frontend.
Học về caching strategies

Đọc thêm¶

Tuần 26: Final Enhancements & Portfolio¶

Thêm thắt chỉnh sửa đôi chút cho dự án tốt nghiệp

Đặc biệt chút¶

Thêm dự án vào trang Portfolio của bản thân.
Chuẩn bị đi phỏng vấn với dự án đó, và một resume nữa.
Tạo một portfolio cá nhân sử dụng Next.js.
Showcase tất cả 10 dự án trong portfolio của bạn.

Sau khi hoàn thành¶

Sau khi bạn hoàn thành xong 26 tuần này, sẽ còn rất nhiều thứ nữa bạn (cần) nên học để có thể cải thiện hơn nữa sản phẩm của bạn. Dưới đây là một số gợi ý (Chưa được cập nhật hết):

Học hết chương trình Khoa học máy tính
Học Quy trình phát triển phần mềm - Khi đi làm thì sẽ thường dùng Agile/Scrum. Xem Scrum cơ bản - Quy trình phát triển phần mềm