Lộ trình học lập trình Web từ con số 0

Xin chào tất cả các bạn, mình là Trung Quân aka trungquandev :D. Sau khá nhiều câu hỏi của các bạn gửi tới cho mình, thì hôm nay mình quyết định sẽ phải viết một bài viết thật chi tiết về Lộ trình học lập trình Web từ đầu (từ con số 0) dựa trên kinh nghiệm của mình, đồng thời mình sẽ tự xây dựng giáo trình các bài giảng thực tế cũng như làm thành các bộ video lập trình nền tảng trên YouTube Miễn Phí tới các bạn, đặc biệt dành cho những bạn nào mới lần đầu tìm hiểu tới con đường lập trình Web, giúp các bạn có một cái nhìn bao quát, tiết kiệm thời gian và công sức trong giai đoạn đầu của hành trình sự nghiệp nhé.

“Đây là bài viết chính thức do mình viết ra để hệ thống lại các khóa học nền tảng dưới dạng video mà mình đăng trên kênh YouTube: Trungquandev Official để các bạn tiện theo dõi một cách chính xác nhất từ đầu tới cuối nhé.”

Những nội dung có trong bài:

1. HTML CSS Nền Tảng (Đang xây dựng…)

• HTML – viết tắt của Hyper Text Markup Language, là một ngôn ngữ đánh dấu tiêu chuẩn cho việc tạo ra các trang web và chúng ta sử dụng HTML để tạo ra cấu trúc của một trang Web.

• CSS – viết tắt của cụm từ Cascading Style Sheets, hiểu đơn giản là một dạng ngôn ngữ mà chúng ta sử dụng để tạo kiểu trên trang Web. Hoặc nói một cách dễ hiểu hơn nữa là làm đẹp cho trang web nhé.

Để giúp các bạn hình dung thú vị hơn nữa về HTML và CSS thì mình có 2 chiếc ảnh như sau nha:

ảnh
Ảnh bên trái là có HTML kết hợp CSS còn bên phải là chỉ có HTML

Chắc không cần nói nhiều thêm nữa đâu nhỉ? ^^
Dưới đây là link Playlist khóa học HTML CSS nền tảng miễn phí trên kênh YouTube chính thức của mình nhé:

ảnh

2. JavaScript Nền Tảng (Sắp ra mắt…)

Đón chờ học phần này của mình nhé, sớm thôi, còn bây giờ bạn có thể đọc tiếp từ phần 4 nha ^^

3. Bootstrap + Sass Nền Tảng (Sắp ra mắt…)

Đón chờ học phần này của mình nhé, sớm thôi, còn bây giờ bạn có thể đọc tiếp từ phần 4 nha ^^

4. Nắm được Front-end, Back-end cũng như Full-stack là gì và lựa chọn rẽ hướng sự nghiệp (Nội dung quan trọng)

Từ kinh nghiệm của mình, 3 học phần nội dung phía trước là những kiến thức bắt buộc mà các bạn cần phải nắm được nếu muốn theo con đường lập trình Web, và trước khi nghiên cứu tới các học phần tiếp theo, thì mình sẽ dành chút thời gian để giúp các bạn nắm được 3 khái niệm quan trọng là Front-end, Back-end và Full-stack cũng như để các bạn tự lựa chọn và rẽ sang một hướng đi cụ thể mà các bạn muốn nhé.

• Front-end: Về mặt khái niệm nó là “Lập trình giao diện Website phía Client (máy khách)”, tức là phát triển về mặt giao diện đồ hoạ của trang Web thông qua các ngôn ngữ HTML – CSS – JavaScript để người dùng có thể xem và tương tác với trang Web. Về sau để chuyên sâu tay nghề và có thể đi làm được thì bạn sẽ cần học một hoặc một vài Library / Framework để xây dựng ứng dụng web phía client nhanh hơn, dễ bảo trì hơn như: ReactJS, VueJS hoặc AngularJS…vv

• Back-end: Khái niệm của nó là “Lập trình phía Server (máy chủ)”, tức là thao tác, xử lý logic, lưu trữ / trích xuất dữ liệu từ Database (Cơ Sở Dữ Liệu), hiểu cấu trúc dữ liệu và giải thuật tốt để tạo ra các ứng dụng, các Service giao tiếp được với Database từ đó đưa được dữ liệu về cho phía Client sử dụng. Về ngôn ngữ lập trình để làm Back-end thì rất đa dạng như: JavaScript (Node.js), Java Core, PHP, Ruby, Golang…vv

“Bây giờ bạn hãy tưởng tượng một ví dụ đơn giản chút, giống như trên sân khấu, Front-end là những người biểu diễn các tiết mục ra cho khán giả xem thì ngược lại Back-end là những người làm tất cả hậu cần phía sau sân khấu giúp cho buổi biểu diễn được thành công, cả 2 công việc này đều quan trọng như nhau cả.” – https://trungquandev.com

• Full-stack: Dễ hiểu nhất thì Full-stack chính là sự kết hợp giữa 2 thứ Front-end và Back-end ở trên, nghĩa là bạn sẽ phải có kiến thức đủ tốt ở cả 2 mảng trên để có thể làm việc được ở cả phía Client cũng như phía Server.

ảnh

Dĩ nhiên còn nhiều hướng đi khác nữa mà các bạn có thể đã từng nghe tới như là DevOps, System Engineer, Cloud, Blockchain, AI, Machine Learning…vv nhưng trong phạm vi lập trình Web mà mình hướng tới ở đây, chúng ta sẽ chỉ tập trung vào 3 hướng Front-end, Back-end và Full-stack thôi nhé.

• Tới đây mình tin các bạn đã tự đặt ra câu hỏi cho bản thân là: Nên theo hướng đi nào bây giờ phải không?

• Về câu trả lời thì chắc chắn phụ thuộc vào chính bạn rồi, tuy nhiên mình cũng sẽ đưa ra một số recommend dựa trên kinh nghiệm bản thân để các bạn tham khảo nhé:

  • Nếu bạn nào thích cảm giác vẽ vời trên trang Web, kiểu thích nhìn màu sắc, thích ngắm các mẫu Design – Thiết kế thì mình nghĩ Front-end là sự lựa chọn hợp lý. Lưu ý: Không cần yêu cầu bạn phải có mắt thẩm mỹ cao thì mới làm được Front-end đâu nhé, mình thấy nhiều bạn hay sợ vấn đề này. Thực ra chỉ cần mắt thẩm mỹ của bạn không quá xấu là được :D, còn khi đi làm thực tế sẽ có một đội Design riêng cho dự án, chúng ta chỉ cần tập trung vào code dựa trên bản thiết kế của đội Design thôi là được rồi nhé.

  • Còn nếu bạn thích làm việc nhiều hơn với dữ liệu như thiết kế cấu trúc dữ liệu, luyện tập tư duy xử lý với các nghiệp vụ – Bussiness Logic của dự án, thao tác dữ liệu với Database…vv mà không cần quan tâm tới việc tạo nên giao diện Web thì Back-end có thể sẽ là lựa chọn hợp lý đối với bạn.

  • Và còn lại, nếu bạn cảm thấy một hướng đi là chưa đủ, muốn try hard bản thân, trau dồi mọi kiến thức ở cả 2 mảng Front-end lẫn Back-end thì Full-stack chắc chắn sẽ là lựa chọn mà bạn nên cân nhắc nhé.

  • Về thu nhập: ở cùng một vị trí Developer với số năm kinh nghiệm tương đương nhau thì Full-stack thường là cao nhất, sau đó là tới Back-end rồi đến Front-end, tuy nhiên điều này chỉ là tương đối và con số chênh lệch này nó còn phụ thuộc rất nhiều vào các yếu tố khác bên lề mà sau này các bạn đi làm sẽ hiểu, ví dụ như công ty có tốt không, vốn đầu tư của công ty đó có mạnh không hoặc họ có cần người cho một vị trí cụ thể gấp không…vv nhiều lắm nhé. Nên là đối với khía cạnh thu nhập này, hãy cứ thoải mái không cần phải lo nghĩ nhiều nhé. (“Bật mí nhỏ bên lề là mình đã từng làm Back-end và làm Full-stack rồi, cho tới ở công ty hiện tại tuy mình làm công việc chính là Front-end nhưng thu nhập vẫn rất là cao nhé, thậm chí còn cao hơn cả thu nhập của Back-end ở một số công ty khác nữa.”)

• Và cũng chính vì lời khuyên cuối cùng ở trên mà các phần tiếp theo mình quyết định sẽ dạy các bạn cả Front-end lẫn Back-end luôn để đảm bảo rằng bạn sẽ có một hành trang nền tảng cực kỳ vững chắc ở cả 2 phía, làm bàn đạp thật tốt cho sự nghiệp làm Lập Trình Viên trong tương lai của các bạn nhé.

5. TailwindCSS thực chiến (Đã hoàn thành)

TailwindCSS nó là một khung CSS mã nguồn mở, nó được thiết kế ra nhằm giúp chúng ta tạo ra các ứng dụng web nhanh hơn cũng như dễ dàng hơn. “Đặc biệt, nó rất dễ gây nghiện đó nhé từ kinh nghiệm của mình :D. Vì vậy mình đã quyết định đưa nó vào đây như một nội dung mà các bạn nên học nhé.”

Dưới đây là Playlist khóa Tailwind CSS thực chiến mà mình đã hoàn thiện cho các bạn nhé ^^

ảnh

6. MERN Stack cơ bản (ReactJS + NodeJS + ExpressJS + MongoDB) (Đã hoàn thành)

MERN Stack là một dạng hướng đi của Full-stack, các bạn chỉ cần hiểu đơn giản cụm từ MERN nó là các chữ cái đầu đại diện cho các công nghệ bao quát hết từ Front-end cho tới Back-end lần lượt như sau: MongoDB – ExpressJS – ReactJS – Node.js

Khóa MERN Stack miễn phí này tuy mình để tên là cơ bản để phân biệt với khóa nâng cao trong phần tiếp theo, nhưng mình đảm bảo nội dung khóa sẽ cực kỳ bám sát với dự án thực tế và nội dung không hề đơn giản đâu nhé. Mình cũng đã nhận được rất nhiều review về khóa này rồi, các bạn có thể theo dõi kỹ hơn tại đây nhé:

ảnh

7. MERN Stack Nâng Cao – Học để đi làm – Từ dự án thực tế (Đã hoàn thành)

Như tiêu đề, khóa MERN Stack nâng cao này mình chỉ để đúng một mô tả ngắn gọn và đơn giản đó là “Học để đi làm thực tế” nhé ^^

Hiện tại mình đã và đang dạy các lớp học MERN Stack nâng cao này dưới hình thức online trực tiếp qua Google Meet, cùng code, cùng thảo luận, cùng hướng dẫn, hỗ trợ các bạn trong quá trình học như kiểu “cầm tay chỉ việc” nhé.

Mọi thông tin chi tiết về khóa này mình có làm thành một video cực kỳ chi tiết, các bạn xem ở đây nha:

Và nếu thấy bài viết cũng như video bổ ích, hãy ủng hộ mình bằng cách Đăng ký kênh Youtube Trungquandev Official để mình có động lực tiếp tục viết những bài viết hay cũng như ra thêm nhiều video chất lượng hơn nữa nha, cảm ơn các bạn nhiều !!! https://www.youtube.com/@trungquandev

Cảm ơn các bạn đã dành thời gian đọc bài viết.

Xin chào và hẹn gặp lại các bạn ở những bài viết tiếp theo.

Kindly – ? Trungquandev Official ❤

Tham khảo kiến thức:

https://www.w3schools.com/

https://developer.mozilla.org/

“Thanks for awesome knowledges.”
“From author: trungquandev”