Tổng hợp Full Lộ Trình và các Công Nghệ Web nên học năm 2022



Nay là đầu năm 2022, nhiều bạn quan tâm đến việc học lập trình web, nên mình làm vlog chia sẻ lộ trình học lập trình web, phân biệt front-end/back-end, và các công nghệ web nên học trong năm 2022 luôn nhé.

Nhớ subscribe cho mình nhe:

Channel Tôi Đi Code Dạo là nơi mình chia sẻ những kiến thức, kinh nghiệm về ngành lập trình mà mình đạt được trong quá trình làm việc. Những kiến thức này sẽ biến các bạn từ một coder trở thành developer – lập trình viên thứ thiệt.
Nhớ ghé thăm và subscribe channel để xem clip mới vào 8H TỐI T3 hàng tuần nha!

Timestamp
00:00 – Giới thiệu vlog
01:02 – Phân loại front-end, back-end, full-stack developer
02:10 – Công nghệ, lộ trình học và làm front-end
03:15 – Nhập môn bằng HTML, CSS, JavaScript
04:10 – Nâng cao: các CSS framework phổ biến
05:33 – Các JS Framework phổ biến như ReactJS, Angular, VueJS
07:05 – Deploy code front-end ở đâu
08:12 – Công nghệ, lộ trình học và làm back-end
08:55 – Các ngôn ngữ/framework để làm web back-end
10:05 – Dăm ba loại Database và Message Queue
11:40 – Phân biết Rest và GraphQL
13:03- Code bakc-end xong deploy ở đâu
14:17 – Các công nghệ web khác
15:45 – Một số tool phổ biến anh em nên biết

Ghé thăm mình tại:
Blog:
Fanpage:

==== Nội dung slide ====
Lập trình web năm 2022 có gì hot?
Tổng quan lộ trình học, công nghệ sử dụng

Clip này có gì hot?
01
Phân loại
02
Công nghệ front-end

03
Công nghệ back-end
04
Các mảng khác + tool

Dăm ba loại Web Developer
Front-end
Back-end
Lưu trữ và xử lý dữ liệu, code API
Fullstack
Ôm cả front-end lẫn back-end, gì cũng chơi
Code giao diện và interaction

Công nghệ, lộ trình
làm front-end
01

Làm giao diện (UI) và tương tác (UX)
Cắt HTML/CSS từ Photoshop/Figma
Code giao diện, animation, chuyển trang
Gửi/nhận dữ liệu tới server, làm việc với back-end

(Những cái người dùng thấy)
Làm front-end là làm gì?

Bộ 3 front-end nhập môn
(học trên kênh Code Dạo)
Thêm chức năng, tương tác cho web
HTML
Xương sườn cấu tạo trang web
Mông má style cho
trang web đẹp lên
CSS
JavaScript

Nâng cao: CSS Preprocessor

Nâng cao: CSS Framework
Ngon, bổ, rẻ, phổ biến
Bootstrap
Mới mẻ, phá cách
Tailwind CSS
Mới mẻ, gọn nhẹ, dễ dùng
Bulma
Phong cách Material UI
Materialize

Nâng cao: JS Framework
Ngon, phổ biến, tài liệu nhiều
React
Dài dòng, code ổn, có cấu trúc
Angular
Mới lạ, nhiều cái hay, tài liệu sida
Vue
Mới, có tiềm năng, chưa phổ biến
Svelte
Sida vì có vue2 vue3

Bonus: Code front-end deploy ở đâu?
Github Pages
Netlify
Vercel

Công nghệ, lộ trình
làm back-end
02

Bảo mật, lưu trữ, xử lý dữ liệu dưới database
Quản lý, phân quyền (đăng nhập, đăng ký)
Gửi/nhận dữ liệu từ front-end qua API

(Người dùng không thấy)
Làm back-end là làm gì?

Các ngôn ngữ/framework để làm back-end
PHP
C#
Java
Ruby
Python
JavaScript
Kotlin
Rust
Golang
ASP.NET MVC
Spring/Struts
Laravel/Symfony
Flash/Django
Express/Koa
Ruby on Rails

Ngày xửa ngày xưa, người ta code web chỉ cần back-end + HTML/CSS

Không cần JS hay đống framework nặng vl
Có thể bạn đã biết

Dăm ba loại Database
No SQL
SQL
PostgreSQL
Microsoft SQL Server
MySQL/MariaDB
Amazon RDS/Azure SQL
MongoDB
CouchDB
DynamoDB
Redis (Cache)
Nâng cao: Message Queue
RabbitMQ
Kafka
Amazon SQS
Azure Service Bus

REST vs GraphQL
Mỗi endpoint là 1 URL
Phổ biến, nhiều document, best practice
Dễ code, nhiều framework hỗ trợ
REST API
GraphQL
Dùng 1 endpoint duy nhất, có docs sẵn
Chưa phổ biến, back-end hơi khó code
Tiện dụng, tiết kiệm bandwidth

Bonus: Code back-end
deploy ở đâu?
Cloud
Digital
Ocean
Heroku

Công nghệ
Web khác + 1 số tool
03

Một số công nghệ web khác
Static
Site Generator
Server
Side
Rendering
CMS/Site
Builder

Bonus – Một số tool khác (học trên kênh Code Dạo)
Chrome Dev Tool

HẾT RỒI Á!
(nhớ subscribe nha)
Các bạn quan tâm vlog kỹ thuật
thì like và comment nha

#fullstack #vlog_ki_thuat #laptrinhweb

Nguồn: https://phpday.vn/cong-dong-php/

Xem thêm: https://phpday.vn/cong-dong-php/tai-lieu-php/

Bình luận

  1. Ông nào thấy con mèo chỗ 7:23 quen quen thì like nha 🐧

  2. Nói như đi ăn cướp

  3. Anh có thể nói chậm lại được ko :)))

  4. ông hoàng thik xem 2ten giống bạn tui

  5. Thật ra là để tập nghe tiếng Việt :)))

  6. Cái tailwind mình vẫn dùng class do mình tự viết. Nhưng thay vì viết css thuần thì mình dùng @apply để dùng tailwind sẽ chuẩn và nhanh hơn.

  7. Bạn ơi, thuê bạn test giúp độ bảo mật 1 bộ source php thuần thì được ko bạn ?

  8. Em có 1 góp ý nhỏ về cách trình bày: anh nên nói chậm lại 1 chút, nên nói từng quãng rồi nghỉ không nên nói liên tục nhưng nếu ghép từng đoạn video anh nói thì anh nên ghép sao cho giữa các đoạn nói mượn hơn chậm hơn. Cảm ơn anh đã đọc.

  9. Deploy ở GCP nghe nói tốt, với được tặng 300$ để trải nghiệm miễn sao có tk Google nữa

  10. Rất chi tiết và cụ thể, bổ ích cho newbie như mình! Mong là Hoàng sẽ dành thời gian làm 1 bài về các chứng chỉ mà newbie nên kiếm và kiếm ở đâu(only for newbie Hoàng nhé). Thanks!!!!

  11. Mỗi lần xem video của a, em đều phải giảm xuống 0.5 để nghe cho rõ :))

  12. em cám ơn anh <3

  13. Vuejs thì tài liệu đúng là củ chuối thật sự !

  14. Mr Hoàng nói rõ ra cho đại chúng còn nghe với. Chứ cứ phải pause rồi replay nhiều lần quá. Mệt

  15. video đáng lẽ phải nhiều view hơn, nhiều thông tin vậy mà <3

  16. e coi videos toàn chỉnh 1.5 mà gặp a e chào thua lun á kkkk

  17. Em học BE mà giờ vẫn còn ngáo cái REST API, anh làm clip nhỏ nói về cái này đc ko anh? Chờ em xem youtube nhiều nguồn mà vẫn ko hiểu cách dùng nó như thế nào ấy ạ

  18. A nói chậm một chút nghe sẽ thấm hơn a ơi.

  19. Anh làm về Mobi ik anh

  20. nói chậm lại ti tí a ưiii

  21. Tự học Frontend để dùng làm nghề tay trái thì liệu có ổn không ạ ??

  22. Anh làm các thủ thuật vui vs web đi vd như sửa nội dung hiển thị v.v.. dễ dễ mọi người làm theo được

  23. nghe mà sợ a bị lẹo lưỡi luôn á =)))

  24. Deploy giờ build hết container không cần quan tâm cài cắm server nữa =)))

  25. Anh cho em hỏi nếu như mình muốn làm full stack thì có phải giỏi về các phần cấu trúc dữ liệu không anh

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *