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é.

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:

==== 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

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

[thaonguyenxuan]

Anh có thể làm video nói về hướng blockchain trong tương lai được không ạ ví dụ như ngôn ngữ solidity, em thấy blockchain đang dần trở thành thế lực nên sẽ có nhiều việc làm trong tương lai ạ, ai muốn anh Hoàng làm về chủ đề này thì like giúp mình nhé ❤️

[ninjaa]

Khá là quan tâm nhưng mà ngồi xem xong vlog đúng kiểu : " ta chỉ là hạt cát trong một đại dương xanh" .
Em sinh viên năm nhất vẫn còn nhiều thứ phải học.
Mong anh tiếp tục ra nhưng video chất lượng !!

[justacannoli]

Mong a Hoàng có 1 video so sánh giữa 2 mảng React với mấy web CMS như Wordpress

[thanhatnguyen]

thanks a, youtuber IT có tâm nhất vn <3

[cuonginh]

E xem nhiều videos lại thích cách nói nhanh của a, không dài dòng mà tiếp thu lại rất nhanh

[lamtranvinh]

Hôm nào a rãnh live coding 1 trang home page đi a. Chỉ cách những thiết lập cơ bản và tư duy khi code giao diện ạ.
Chúc a năm mới sức khoẻ ạ!

[thuo]

Cảm ơn ông về video clip này nha. Những tổng hợp này tuy đơn giản nhưng thật ra mang ý nghĩa rất lớn, nó giúp những bạn chuyên làm về một mảng hiểu về mảng còn lại (FE hiểu thêm về BE và ngược lại). Biết được công nghệ đang phát triển như thế nào và công ty mình đang làm có đi đúng với xu hướng hay ko.

[O...Maiden...O]

sao thấy ít ai quan tâm tới webassembly vậy, công nghệ mới cũng khá hay ho mà mn :( mong mn quan tâm ủng hộ để anh zai làm 1 video về công nghệ này

[kamaruno]

Cám ơn đóng góp của anh cho cộng đồng, chúc anh nhiều sức khỏe và nhiệt huyết trong năm mới

[nathanngo]

Đang làm về Data Engineer, rất quan tâm về những chủ để ntn để hiểu hơn mấy ông Back-end làm gì kkk. Tks a.

[lamtruonghoang]

nói kỹ là tới tết năm sau luôn á anh. thanks anh, năm mới nhiều may mắn.

[TungLe-vrzp]

Mong anh làm tiếp về backend đi ạ =)))

[TuanVu-bjfj]

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!!!!

[TuNguyen-nqdf]

Quá đỉnh luôn anh, nhờ anh em mới nhận ra thế giới này rộng lớn <3

[MinhTechie]

Video hay. Nhiều người bảo công nghệ cross platform như React Native chỉ đú được 1 thời gian rồi ngủm nhưng mình thấy 2022 rồi React Native, Flutter vẫn sống khỏe. Càng ngày càng cải thiện hơn.

[dongnhinguyen]

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

[phucnguyennhu]

Cảm ơn anh Hoàng vì một tiếng video bổ ích

[tunnguyen]

Em mong sẽ có vid tổng hợp các site, group để cập nhật thông tin, công nghệ, v.v khi rảnh rỗi ạ

[dragonsanji]

TOP bạn ơi ^^ đầy đủ cho 1 nhìn tổng quát