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

Trước đây, mình đã có 1 series kiếm hiệp tên JS Truyền Kì về sự phổ biến và phát triển của JavaScript. Series đó đi sâu về kể chuyện, cũng như giới thiệu về lịch sử của JavaScript.

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

Series này sẽ gồm 4 phần chính:

• Phần 1: Giai đoạn trước 2005 – JavaScript là cái thứ chi chi
• Phần 2: Giai đoạn 2005-2010 – Thời đại của jQuery
• Phần 3.1: Giai đoạn 2010-2014 – JS Framework trỗi dậy
• Phần 3.2: Giai đoạn 2010-2014 – NodeJS náo loạn giới front-end
• Phần 4.1: Giai đoạn 2014 đến nay – NodeJS, BabelJS, Webpack, ReactJS – Tứ đại thiên vương (tạm thời) của JS
• Phần 4.2: Web front-end hiện đại có gì hot

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

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ị:

Đặ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.

Tạm kết

Chà, làm web dev thời 2005 có vẻ dễ ăn quá nhỉ? Công việc thoải mái giông giống back-end bây giờ. Tuy nhiên, giai đoạn nào cũng có cái khổ riêng!

Ở những năm 2005, framework chưa nhiều, hầu như dân developer code tay là chính. Các bạn đọc trên mạng sẽ biết developer thời kì này rất thù ghét Internet Explorer, vì nó chuyên làm bể tanh bành giao diện, lỗi JS tùm lum.

Thế nhưng, mọi chuyện dần sôi động hẳn lên từ giai đoạn 2005 đến 2010, với sự ra đời của Ajax, jQuery, AngularJS. JavaScript dần tìm được nhiều đất diễn hơn trong ngành web developer, vị trí front-end developer xuất hiện.

Muốn biết chi tiết, các bạn nhớ đón xem phần 2 nha!