Lập trình Web Front-end đã thay đổi như thế nào sau 10 năm – Phần 1

Feb 24, 2025

Lời dẫn

Mảng lập trình front-end hiện tại đang rất loạn!!!

Công nghệ front-end thay đổi quá nhanh, framework này framework kia lũ lượt ra đời như nấm sau mưa.

Để hù dân tay ngang mới học front-end, hoặc những người không biết nhiều về lập trình, các bạn chỉ cần lấy những công nghệ phổ biến sau ra “khè” họ.Ember, Angular, React, Express, Grunt, Bower, npm, Broccoli, Gulp, Lodash, Underscore, rxjs, Knockout, Threejs, D3, Backbone, Angular2, Redux, Alt, Reflux, Webpack, Bluebird, Q Mocha, Jasmine, Chai, Koa, Less, Sass, Postcss, Impressjs, Revealjs.

Sự “loạn” này làm đau đầu, “bối rối” cả những developer cứng cựa cho đến newbie developer mới bước chân vào mảng front-end.

Học front-end sao cho hiệu quả?

Do vậy, nhiều bạn học front-end hỏi mình: Làm sao để học front-end cho hiệu quả? Lời khuyên nho nhỏ của mình là:Thay vì bỏ thời gian để chạy theo công nghệ này, công nghệ kia, hãy biết mình cần học gì. Hãy tìm hiểu lý do tại sao chúng ra đời, vấn đề mà chúng giải quyết Hãy tìm hiểu vai trò của từng công nghệ trong thế giới JavaScript hỗn loạn hiện nay.

Do đã trải qua cũng nhiều, mình viết một series ngắn về những thay đổi về công nghệ trong ngành front-end từ trước đến nay. Những bạn nào nghiêm túc muốn theo hướng front-end developer thì nên đọc, ngẫm và tìm hiểu nhé!

Giới thiệu series

Trong series này, chúng ta sẽ đi sâu hơn về chi tiết kĩ thuật, tìm hiểu cách mà developer viết/sử dụng JS , những thay đổi khi dùng JavaScript từ trước đến nay.

Series hơi nặng về kĩ thuật, có vài cột mốc quan trọng nhưng mình hứa là đọc sẽ hay hơn mấy cuốn sách lịch sử nhé!

Web động những năm 2005

Công việc “lập trình web” đã có từ thời lâu lắc lâu lơ, trước cả những năm 2005. Những ngôn ngữ làm web phổ biến thời đó là PHP, Java (Với J2EE), C# (Với ASP.NET WebForm), PERL …

Vào giai đoạn này, 99.99% hoạt động theo cơ chế Server Side Rendering (Số liệu do mình “dự đoán” nên không có nguồn nha):

Khi người dùng vào một trang web, trình duyệt sẽ gửi GET request tới web server
Web server sẽ nhận request, đọc dữ liệu từ database.
Web server sẽ render HTML, trả về cho browser để hiển thị cho người dùng

Mô hình đơn giản về Server Side Rendering

Nói nôm là khi bạn ghé vào trang thiend*a.com, server sẽ trả về kết quả sau để browser hiển thị:

	<html xmlns=”http://www.w3.org/1999/xhtml”>
	<head>
	<title>Tài liệu học tập</title>
	</head>
	<body>
	<ul>
	<li><a href=”http://jav.av”>Tài liệu Nhật</a></li>
	<li><a href=”http://kav.av”>Tài liệu Hàn</a></li>
	<li><a href=”http://vav.av”>Tài liệu Việt</a></li>
	</ul>
	</body>
	</html>

Đặc tính của Server Side Rendering

Một số tính chất của cơ chế server side rendering:

Logic từ đơn giản (validation, đọc dữ liệu) cho đến phức tạp (phân quyền, thanh toán) đều nằm ở phía server
Logic để routing – chuyển trang nằm ở server
Logic để render – hiển thị trang web cũng nằm ở server

Cách hiển thị này rất tốt cho SEO, vì khi bot của Google crawl một trang web, nó sẽ thấy những thứ tương tự người dùng thấy. Bot có thể dựa vào HTML để bóc tách nội dung trang web nhằm đánh index.

Hiện nay, phần lớn các trang web vẫn còn sử dụng cơ chế này, pha thêm 1 chút JavaScript để làm hiệu ứng này nọ. Công nghệ cũ không có nghĩa nó là công nghệ lỗi thời các bạn nhé!

Front-end developer những năm 2005

Quay lại những năm 2005 nha! Thời đó, JavaScript còn khá là … cùi bắp và vô dụng!

Tại sao vậy? Vì đa phần logic đã nằm ở phía server, nên JavaScript chỉ có tác dụng validation một số dữ liệu ở client, nhằm giảm tải cho server thôi.

Ở giai đoạn này, dân developer chưa phân ra làm front-end hay back-end mà chỉ có web developer và web designer.

Web Designer là những người design ra giao diện web trong photoshop dưới dạng file PSD/file ảnh. Nếu có khả năng, họ có thể làm ra giao diện bằng HTML/CSS luôn
Web Developer là những người biết một ngôn ngữ lập trình như C#, PHP, Java để code phía server. Họ cũng phải biết về HTML/CSS để hiện thực những design (còn gọi là cắt HTML) do web designer đưa ra. Nếu may mắn gặp Web Designer biết code thì chỉ việc gắn HTML vào là được.

Thời bấy giờ chỉ có web designer và web developer chứ chưa có front-end với back-end gì đâu nhé

You need to login in order to like this post: click here