Web (7) - Lộ trình học web front-end

Bài trước: Web (6) - Muốn làm web cần học những gì

---

1         Lộ trình học web front-end

Học tới phần này là bạn đang hướng tới một nghề cụ thể. Đó là nghề làm web. Tất nhiên, có thể bạn còn do dự, không biết đi theo rồi có làm được không? Lỡ học xong không xin được việc thì sao? Đam mê, sở thích của mình là gì nhỉ? Cứ tiến lên thôi bạn nhé. Nhiều bạn cứ nặng nề về đam mê, sở thích. Hãy thực tế một chút, học lấy cái nghề để kiếm việc, kiếm tiền, để tồn tại, để sống cái đã. Hãy học và làm nghề dựa vào sở trường, vì nó có vẻ lâu bền và hợp lý hơn là dựa trên đam mê, sở thích (có tính nhất thời và dễ thay đổi).

Ngoài ra, bạn nhớ thực hành và áp dụng các cách học sao cho có hiệu quả.

Chúng ta cùng nhìn lại quy trình để tạo ra một sản phẩm web:


Chúng ta sẽ học để làm việc ở bước 6, thực hiện “Cài đặt” hay lập trình ứng dụng web.

Cụ thể hơn, bạn xem lại Tháp quản lý sản phẩm ở hình sau,


Theo quy trình trên, sau bước 10, và 11, chúng ta đã có bản thiết kế (UX/UI) của ứng dụng web. Công việc tiếp theo là làm phần front-end và back-end cho ứng dụng.

Làm UI/UX và back-end là các nhánh công việc khác, bạn có thể tự tìm hiểu thêm. Phần này sẽ giúp bạn học để làm phần front-end của một ứng dụng web (bước 12).

Hiểu một cách đơn giản, làm web front-end là việc chuyển đổi từ bản thiết kế (UI/UX) sang HTML, CSS và JavaScript.

Một cách bài bản, để làm phần front-end, các bạn phải học hết Kiến thức đại cương, và Kiến thức cơ sở ngành. Một số chủ đề cần học như:

Tiếng Anh căn bản & chuyên ngành CNTT

Nhập môn CNTT

Nhập môn lập trình

Kỹ thuật lập trình

Phương pháp lập trình hướng đối tượng

Kỹ năng mềm

Cấu trúc dữ liệu và thuật giải

Cơ sở dữ liệu

Hệ điều hành

Kiến trúc máy tính và hợp ngữ

Mạng máy tính

Phần mềm Quản lý phiên bản/quản lý mã nguồn: Git, hoặc SVN, hoặc TFS

Kĩ năng và thái độ liên quan đến kĩ thuật: cách viết mã, lựa chọn giải thuật, tổ chức mã nguồn chuyên nghiệp. Kĩ năng và thái độ liên quan đến môi trường làm nghề: cách làm việc chuyên nghiệp, hiệu quả và hạnh phúc với nghề.

Nếu vì lý do gì đó, bạn không thể học tuần tự các chủ đề có tính nền tảng như trên, thì bạn vẫn có thể bắt đầu ngay vào việc học để làm web front-end. Trong quá trình học, bạn thấy thiếu kiến thức gì thì học bổ sung.

Lộ trình học để làm phần front-end (tham khảo trên trang https://roadmap.sh/frontend):

Web căn bản

– Hoạt động của Internet

– Giao thức HTTP

– Trình duyệt web

– DNS

– Tên miền (domain name)

– Lưu trữ website (hosting)

HTML

– HTML căn bản

– Forms và validation

– Quy ước đặt tên và kinh nghiệm viết mã

CSS

– CSS căn bản

– Các kĩ thuật tạo bố cục trang (layout): float, positioning, display, box model, CSS grid, flex box

– Responsive và media queries

JavaScript

– JavaScript căn bản

– DOM

– Fetch API, Ajax

– ES6+

– Hoisting, event bubbling, scope, prototype, shadow DOM, strict

Quản lý phiên bản

– Git căn bản

– Github, hoặc Gitlab, hoặc Bitbucket

Chương trình quản lý gói

– Npm, hoặc yarn, hoặc pnpm

CSS architecture

– BEM

CSS preprocessor

– SASS

– PostCSS

Build tools

– Linters and formatters

– Task runners (npm scripts)

– Module bundlers (vite, hoặc esbuild)

Framework

– React, hoặc Angular, hoặc Vue

Modern CSS

– Styled components

– CSS modules

CSS framework

– Bootstrap

– Tailwind

Kiểm thử phần mềm (Testing your Apps)

 

… (còn nữa)

 

Các bạn nên học tuần tự các chủ đề ở bảng trên, theo thứ tự từ trên xuống dưới. Nếu không, sẽ rất khó hiểu, dễ dẫn tới chán nản và bỏ cuộc.

Bạn cũng nên để ý, nếu đọc nhiều trên mạng sẽ thấy có nhiều lộ trình học. Mỗi lộ trình có sự khác biệt nhau một chút. Điều này cũng dễ hiểu, bởi để đi tới đích thì luôn có nhiều hơn một con đường. Vì vậy, hãy cứ chọn một lộ trình mà bạn thấy thích, và học theo nó. Trong quá trình học sẽ linh hoạt học thêm các chủ đề mà bạn thấy cần, thấy hữu ích.

 ---

Cập nhật: 12/3/2024

Bài sau: Web front-end (1) - Web là gì?

-----

Tải tài liệu đầy đủ: Tự học HTML căn bản

-----

LIÊN HỆ TÁC GIẢ