4.1 Lịch sử phát triển web: từ HTML đến HTML5 và CSS3
Vào đầu những năm 1990, thế giới đã chứng kiến sự ra đời của phát triển web nhờ Tim Berners-Lee. Anh ấy thực sự là lập trình viên Frontend đầu tiên: tự nghĩ ra HTML và tự mình viết, tự tạo trình duyệt đầu tiên. Một lập trình viên frontend thực sự không bị chặn bởi sự thiếu trình duyệt.
Dù khi đó CSS và JavaScript còn chưa ra đời, nên việc tạo các trang web đơn giản hơn. Có thể nói rằng Tim Berners-Lee là lập trình viên "old-school" đầu tiên, người đã làm việc với Frontend trước khi có JavaScript và CSS của các bạn.
Năm 1995 Internet Engineering Task Force (IETF) đã phê chuẩn HTML 2.0 là tiêu chuẩn chính thức đầu tiên của HTML. Phiên bản này bao gồm các thẻ và thuộc tính cơ bản cho phép tạo các trang web đơn giản. HTML 2.0 đã đặt nền tảng cho sự phát triển tiếp theo của phát triển web.
HTML 3.2 và HTML 4.0: mở rộng khả năng
Năm 1997 là một cột mốc quan trọng trong lịch sử HTML. Năm đó, HTML 3.2, do W3C consortium phát triển, đã được phát hành. Bản này bao gồm hỗ trợ bảng, applet Java và các công thức toán học, mở rộng đáng kể khả năng của các lập trình viên web.
Cũng trong năm đó, HTML 4.0 xuất hiện và mang lại nhiều cải tiến đáng kể. Hỗ trợ style bằng CSS, cải thiện ngữ nghĩa và các phần tử mới làm cho HTML 4.0 trở thành một công cụ mạnh mẽ cho việc tạo ra các trang web phức tạp và có cấu trúc tốt hơn. Việc đưa vào style CSS cho phép các lập trình viên tách nội dung khỏi hình thức, giúp quản lý style dễ dàng và đơn giản hóa thiết kế.
CSS: cuộc cách mạng trong style hóa trang web
Tiêu chuẩn đầu tiên của CSS (Cascading Style Sheets) đã được W3C phát hành vào 1996. CSS cho phép các lập trình viên style hóa tài liệu HTML, tách các thành phần hình ảnh khỏi cấu trúc trang. CSS1 cung cấp khả năng style cơ bản cho văn bản và hình nền.
Năm 1998, CSS2 đã được giới thiệu, thêm vào các khả năng mới như hỗ trợ media query, định vị tuyệt đối và tương đối cùng với các style phức tạp hơn cho in ấn.
CSS3, bắt đầu xuất hiện vào năm 2011, giới thiệu kiến trúc module. Điều này cho phép giới thiệu các tính năng mới theo từng giai đoạn, bao gồm các animation, gradient, transformation và layout cải tiến.
HTML5: kỷ nguyên mới trong phát triển web
HTML5, được phát triển nhờ hợp tác giữa WHATWG và W3C, là một bản cập nhật lớn và được chính thức giới thiệu vào năm 2014. HTML5 đã thêm hỗ trợ cho multimedia (video và audio), các phần tử mới để cải thiện ngữ nghĩa (như <article>,<section>, <header>,<footer>), định dạng cải tiến cho biểu mẫu web và các API mới để làm việc với đồ họa và đa luồng.
HTML5 mở rộng đáng kể khả năng của các lập trình viên web, cho phép tạo ra các ứng dụng web tương tác và động hơn. Hỗ trợ các phần tử multimedia và các API mới làm cho ứng dụng web mạnh mẽ và chức năng hơn.
4.2 Từ jQuery đến Angular và React
Càng nhanh internet, các trang web càng nặng nề. Càng nhiều CSS và JavaScript. Để làm cho việc viết bớt phức tạp, người ta bắt đầu sử dụng các thư viện khác nhau. Một trong những thư viện phổ biến nhất là jQuery.
jQuery: Tiện lợi khi làm việc với JavaScript
jQuery được tạo bởi John Resig và phát hành vào tháng 1 năm 2006 tại hội nghị BarCamp ở New York. Mục tiêu của jQuery là đơn giản hóa việc tương tác với tài liệu HTML, xử lý các sự kiện, animation và tương tác Ajax cho phát triển web nhanh chóng.
jQuery nhanh chóng trở nên phổ biến nhờ các phương pháp đơn giản và dễ hiểu, che giấu sự phức tạp khi làm việc với JavaScript và các vấn đề trình duyệt chéo. Các chức năng chính của nó bao gồm:
- Các selector, cho phép dễ dàng tìm kiếm và thao tác với các phần tử DOM
- Xử lý sự kiện đơn giản
- Animation và hiệu ứng
- Tích hợp với Ajax để tạo các trang web tương tác
jQuery đã làm thay đổi cách tiếp cận phát triển web, làm cho nó dễ tiếp cận và thuận tiện hơn cho các lập trình viên.
Angular: Giới thiệu các ứng dụng web động
Một phản ứng khác đối với sự phức tạp ngày càng tăng của các trang web là sự xuất hiện của framework Angular. AngularJS lần đầu tiên được giới thiệu bởi Google vào tháng 10 năm 2010. Dự án được tạo bởi Misko Hevery và Adam Abrons để đơn giản hóa phát triển của các ứng dụng trang đơn động (SPA).
AngularJS cung cấp các công cụ mạnh mẽ để phát triển phía client, bao gồm:
- Ràng buộc dữ liệu khai báo thông qua directive
- Các dịch vụ tích hợp để làm việc với HTTP request
- Ràng buộc dữ liệu hai chiều, cho phép tự động cập nhật view khi dữ liệu model thay đổi
- Tính module và khả năng kiểm thử mã
Năm 2016, Google đã giới thiệu phiên bản hoàn toàn cải tiến của Angular (Angular 2 trở lên), trở thành nền tảng cho phát triển các ứng dụng web mở rộng và hiệu suất cao với TypeScript.
React: Cuộc cách mạng trong render UI
React được tạo bởi Jordan Walke từ Facebook và lần đầu tiên được phát hành vào tháng 3 năm 2013. React là câu trả lời cho nhu cầu của Facebook trong việc cải thiện hiệu suất và hỗ trợ các giao diện người dùng phức tạp.
React giới thiệu một cách tiếp cận mới cho phát triển giao diện người dùng, dựa trên component và virtual DOM:
- Kiến trúc component, cho phép tạo các component có thể tái sử dụng và cô lập
- Virtual DOM, tối ưu hóa việc cập nhật giao diện, làm cho nó nhanh hơn và hiệu quả hơn
- Ràng buộc dữ liệu một chiều, đơn giản hóa gỡ lỗi và quản lý trạng thái ứng dụng
React nhanh chóng giành được sự phổ biến và trở thành nền tảng cho phát triển nhiều ứng dụng web hiện đại nhờ vào hiệu suất và tính linh hoạt của nó. Nó cũng trở thành nền tảng cho các thư viện và framework khác, như React Native cho ứng dụng di động.
Ba công nghệ này — jQuery, Angular và React — đã đóng vai trò quan trọng trong tiến hóa phát triển web, mỗi công nghệ mang lại những cách tiếp cận và công cụ độc đáo của riêng mình, đơn giản hóa đáng kể việc tạo ra các ứng dụng web hiện đại.
4.3 Node.js, Electron, React Native
HTML5, CSS3, JavaScript 2016 đã trở thành các công nghệ mạnh mẽ đến mức Web vượt khỏi trình duyệt và trở thành công nghệ Frontend Fullstack hoàn chỉnh. Và backend là người đầu tiên cảm nhận.
Node.js: sự chiếm lĩnh của backend
Node.js được tạo bởi Ryan Dahl và lần đầu tiên phát hành vào tháng 5 năm 2009. Mục tiêu chính của Node.js là cung cấp môi trường thực thi cho JavaScript ngoài trình duyệt, cho phép sử dụng JavaScript cho phát triển phía server. Node.js được xây trên engine V8 của Google, đảm bảo hiệu suất cao và tốc độ thực thi.
Node.js sử dụng I/O không chặn (input/output, nhập/xuất), cho phép xử lý nhiều kết nối đồng thời mà không chặn luồng chính. Ngoài ra, nó có một hệ sinh thái module phong phú, có sẵn qua npm (Node Package Manager), đơn giản hóa phát triển và tích hợp các thư viện và công cụ khác nhau. Và nhờ vào engine V8, Node.js đảm bảo xử lý nhanh chóng và hiệu quả các yêu cầu.
Electron: sự chiếm lĩnh của máy tính bàn
Viết UI tuyệt vời cho máy tính bàn là một nhiệm vụ khó khăn, và đây là HTML5+CSS3 đang ở bên cạnh. Vậy nên hãy sử dụng... Vì thế, các lập trình viên đã tạo ra một mẹo nhỏ: ứng dụng của bạn mở ra cửa sổ chính, trong cửa sổ này tích hợp một trình duyệt (thành phần WebView), và vào trình duyệt này tải mã HTML5, CSS3 + JavaScript.
Thư viện Electron, ban đầu được biết đến như Atom Shell, được tạo ra bởi GitHub cho trình biên tập mã Atom. Phiên bản đầu tiên của Electron đã được phát hành vào tháng 7 năm 2013. Mục tiêu của Electron là cho phép các lập trình viên tạo ra các ứng dụng máy tính bàn bằng cách sử dụng công nghệ web, như HTML, CSS và JavaScript.
Electron cho phép tạo ra các ứng dụng có thể chạy trên Windows, macOS và Linux với cùng một cơ sở mã. Electron kết hợp khả năng của công nghệ web và sức mạnh của Node.js, cho phép truy cập vào hệ thống file và các tài nguyên hệ thống khác. Các lập trình viên có thể sử dụng các framework và thư viện web hiện tại để tạo ra các giao diện và chức năng.
React Native: ứng dụng di động
React Native được phát triển bởi Facebook và lần đầu tiên được giới thiệu vào tháng 3 năm 2015. Mục tiêu của React Native là cung cấp khả năng tạo các ứng dụng di động native cho iOS và Android bằng cách sử dụng JavaScript và React.
React Native sử dụng các component native, đảm bảo hiệu suất so sánh được với các ứng dụng native. Trong khi đó, các lập trình viên có thể viết mã hoạt động trên cả iOS và Android, đơn giản hóa đáng kể phát triển và giảm thời gian hỗ trợ.
Tất cả đều giống như với Electron: trên mọi cửa sổ của ứng dụng di động mở ra WebView, vào đó tải một "trang web" viết bằng HTML5, CSS3 và JS. Mọi người kỳ vọng rằng các ứng dụng di động sẽ thay thế các trang web trên điện thoại, nhưng tất cả đã diễn ra ngược lại: các trang web đã bắt đầu thay thế các ứng dụng native.
Ngày nay, Frontend Fullstack Software Engineer là nghề IT được yêu cầu nhiều nhất trên thế giới. Vậy quyết định trở thành lập trình viên Frontend là quyết định đúng đắn và xa vời!
GO TO FULL VERSION