10 thứ front-end developer cần học

HTML, CSS và Javascript là bộ ba kiến thức nền tảng mà bạn bắt buộc phải có được trên con đường trở thành một Front-End Developer. Thế nhưng, nhiêu đó thôi vẫn là chưa đủ, nếu bạn muốn lên những vị trí cao hơn như Senior, Software Architecture… thì cũng cần phải học thêm những kiến thức nâng cao khác.

Dưới đây là danh sách những thứ bạn nên học sau khi đã học xong HTML, CSS và Javascript cơ bản. Cùng Hybrid Technologies khám phá đó là gì nhé!

jQuery

Là một thư viện của Javascript, jQuery là một tập hợp các plugin và extension được dùng để giúp lập trình viên có thể làm việc với Javascript một cách nhanh – gọn – lẹ và tiện hơn. Nếu bạn đã có kiến thức nền tảng về JS, chuyển sang jQuery sẽ dễ dàng hơn nhiều. jQuery giúp cho lập trình viên Front-end có thể thêm vào những elements có sẵn vào trong project và customize lại khi cần thiết.

Bên cạnh đó, chúng ta cũng có thể sử dụng jQuery cho những thứ như countdown timers, search form autocomplete hay thậm chí là các grid layout được tự động rearranging và resizing. Đặc biệt, trong quá trình xin việc, biết thêm về kiến thức về jQuery sẽ giúp bạn có thêm điểm cộng trong CV của mình.

Các hệ thống quản lý Git và Version

Hệ thống quản lý Git và Version thực chất là những kiến thức mà bạn nên nắm rõ cho dù bạn có trở thành một lập trình viên Front-end hay không. Bởi vì các hệ thống quản lý version này sẽ giúp bạn dễ theo dõi các thay đổi đã được tạo ra trong code theo thời gian, cũng như quay trở lại phiên bản trước mà đỡ tốn công sức hơn. 

Ví dụ khi bạn thêm một plugin jQuery tùy biến và đột nhiên một nửa các code bị lỗi, thay vì phải undo và sửa chữa tất cả các lỗi đó, bạn chỉ cần trở lại phiên bản trước đó rồi thử lại với một giải pháp khác. Thế là xong!

Những dịch vụ repo hosting khá nổi tiếng hiện nay và cũng được nhiều người sử dụng gồm có: Github, Gitlab, Bitbucket hay Codebase,…

Javascript nâng cao

Javascript là một hệ sinh thái siêu to khổng lồ mà chưa chắc cả đời này một lập trình viên có thể nắm bắt hết được, đã vậy, nó còn hay thay đổi theo từng ấy năm nhất định nữa. Chính vì vậy để không bị lạc trôi giữa biển hồ JS rộng lớn, sau đây là một số thứ mà bạn cần phải học nếu muốn biết thêm rõ hơn về Javascript sau khi đã học xong những kiến thức nền tảng:

• ES6 (hiện tại thì JS đã ra mắt tới phiên bản ES11, nhưng nếu bạn học tới phiên bản này cũng OK lắm rồi, theo mình thấy thì các browser ngày nay chưa hỗ trợ  được hết các tính năng của ES11 đâu) và Design Pattern (một giải pháp tổng thể cho các vấn đề chung trong thiết kế phần mềm)
• Mô hình MVC và MVVM
• Một số framework của JS: Có rất nhiều framework khác nhau phù hợp với từng yêu cầu khác nhau, chúng không chỉ giúp tăng tốc độ lập trình, mà còn có thể sử dụng các thư viện của JS như jQuery để giảm thiểu việc code lại từ đầu, hay nói cách khác là tái sử dụng lại những cái có sẵn thay vì phải cày lưng code đi code lại. VueJS, ReactJS và AngularJS là những framework nổi tiếng mà bạn có thể khám phá thử sau khi đã nắm vững kiến thức JS nền tảng.
• Code Performance: Tối ưu web performance là một vấn đề mà bạn nên quan tâm khi trở thành một Front-end Developer. Đây là một chủ đề quan trọng vì nó ảnh hưởng rất nhiều tới việc người dùng sử dụng trang web của mình như thế nào. Thật không gì khó chịu hơn khi bạn phải ngồi chờ một trang web mà mất cả mấy phút để load. Code Performance ở đây có thể là Lazy Loading, bỏ bớt các HTTP requests, CDN hay tối ưu hình ảnh.v.v…
• Asynchronous Code (những thứ này rất quan trọng với JS) như: callback, promise, async/wait. Sử dụng asynchronous Javascript sẽ giúp bạn có thể thực hiện các request network dài mà không chặn luồng chính
• Kinh nghiệm làm việc với RESTful Services và APIs

Chuyên sâu về CSS

Để làm việc nhanh hơn với CSS, bạn cũng có thể học thêm một số kiến thức chuyên sâu sau:

• Tổ chức với OOCSS, SMACSS và BEM: Nếu biết cách kết hợp 3 phương pháp này sẽ giúp code bạn trông dễ nhìn hơn, đặc biệt là khi bạn dùng chúng với SASS
• CSS Preprocessor như SASS, SCSS, Styllus LESS: giúp bạn viết CSS nhanh hơn, tiết kiệm được thời gian hơn và có cấu trúc rõ ràng, dễ kiểm soát.
• Một số framework CSS như Foundation, Bootstrap, Materialize, Semantic UI: Vì CSS thường bắt đầu với các elements giống nhau từ dự án này đến dự án khác, nên chúng ta cần 1 framework để defines trước những elements này. Hầu hết các công việc hiện này cho Front-end developer đều cần bạn am hiểu và vận dụng tốt các frameworks này.

Thiết kế Responsive

Khái niệm responsive ra đời kể từ khi ngày càng có nhiều người truy cập vào Internet hơn thông qua các thiết bị điện tử như tablet hay smartphone… thay vì chỉ có mỗi PC. Chính vì vậy mà không có gì phải ngạc nhiên khi bạn lại cần phải nắm bắt về vấn đề thiết kế responsive và mobile sau khi đã học xong HTML, CSS và Javascript cơ bản, bởi vì chúng rất quan trọng với bất kỳ ai muốn trở thành một lập trình viên Front-end.

Thuật ngữ “Responsive Design” ám chỉ cách thiết kế trang web hiển thị tương thích với mọi kích thước thiết bị, tức là bố cục trang web sẽ tự đáp ứng theo hành vi người dùng và môi trường hiển thị. Môi trường này chính là kích thước của trình duyệt, kích thước hoặc hướng xoay thiết bị. Hãy thử tưởng tượng lúc bạn đang đọc bài viết này trên trang web https://jobs.hybrid-technologies.vn/ trên laptop thì giao diện nó sẽ khác như thế nào so với lúc bạn đang đọc ở trên điện thoại: về cách bố trí các elements và cách hiển thị trang web ra sao? Học thêm về thiết kế Responsive không chỉ giúp cho người dùng có được trải nghiệm thú vị hơn khi truy cập website của bạn, mà nó còn giúp chủ sở hữu dễ dàng quản lý các trang web của mình hơn.

Thiết kế mobile cũng bao gồm cả thiết kế responsive, đôi khi trải nghiệm của user mà bạn muốn khi họ vào trang web trên desktop sẽ hoàn toàn khác với những trải nghiệm xảy ra trên mobile.

Kiến thức về Nodejs

Mặc dù Nodejs được dùng để viết code ở phía bên Backend, song những công cụ hiện tại đều sử dụng Nodejs và npm để build, minify hay bundle. Bên cạnh đó, ghi vào CV ngoài việc nắm vững các kiến thức về HTML, CSS, JS cơ bản là một chút am hiểu về Nodejs cũng có ích không kém cho bạn mà đúng không nào.

Testing và Debugging

Đã dấn thân vào con đường IT, có một thứ (ác mộng) bạn không thể tránh khỏi đó chính là bug. Chính vì vậy, bạn cần phải làm quen với quy trình testing và debugging. Chẳng hạn ta có unit testing (một quá trình thử nghiệm individual blocks của source code), unit testing các frameworks sẽ đem đến một method và structure riêng để thực hiện điều đó, nói về vấn đề này thì khá nhiều nên mình sẽ đề cập nó ở bài viết sau nếu có thời gian.

Hay với testing UI (còn gọi là acceptance testing/functional testing), bạn có thể write tests để nó tìm kiếm những thứ như HTML trên một trang web (giống như nếu một người dùng quên điền form thì những cảnh báo sẽ popup lên).

Về vấn đề debug thì tùy vào từng công ty khác nhau sẽ sử dụng các quy trình debug khác nhau.

Khai thác Chrome Developer Tools

Có thể nói trình duyệt web là thứ một Front-end Developer tiếp xúc nhiều nhất chỉ sau IDE. Chrome là một trình duyệt được giới developer ưa chuộng nhất vì sự nhanh nhẹn, tiện lợi và có bộ developer tools vô cùng mạnh mẽ của mình. Biết cách sử dụng chúng sẽ giúp ích rất nhiều cho bạn, trong số đó là những thứ hay ho với tab console nhờ khả năng chạy trực tiếp trên JS của Chrome, từng tab của chrome như networks, sources, elements,… đều có những điểm thú vị khác nhau.

Command Line

Theo một cách nào đó thì GUI trong máy tính là một trong những thứ tuyệt vời nhất mà bạn có thể nghĩ đến khi lập trình. Nếu bạn dành thời gian cho command line, hẳn sẽ thấy ngạc nhiên nhiều về sức mạnh từ cái hình chữ nhật màu đen với con trỏ màu trắng đang nhấp nháy. Không nói đâu xa, dùng command line có thể giúp bạn có nhiều quyền kiểm soát hơn về chức năng của hệ thống, sử dụng các bộ tiền xử lý như SASS/LESS cho CSS hay Haml/Jade cho HTML, các task runner như Gulp và Grunt cho việc tự động hóa nhiệm vụ qua JS,…

Bên cạnh đó, bạn cũng có thể dùng nó cho việc npm cài đặt các package cần thiết, một vài câu lệnh có sẵn của command line cũng giúp ta tiết kiệm kha khá thời gian khi chỉ cần gõ 1 2 dòng lệnh là đã có thể tạo folder làm việc mới và vào Visual Code với lệnh “code”.

Content Management và E-commerce Platforms

Hầu hết các trang web được xây dựng trên hệ thống quản lý nội dung (CMS). CMS thường sẽ được phân thành 3 loại khác nhau: CMS open source, CMS tự code và CMS bị tính phí. Nền tảng thương mại điện tử là một loại hình cụ thể của CMS. CMS phổ biến nhất trên toàn thế giới là WordPress, gần như 60% các trang web có sử dụng một CMS là sẽ dùng WordPress. 

Ngoài CMS WordPress ra thì CMS Joomla, CMS Drupal hay CMS Magento cũng khá nổi tiếng và thông dụng.

Ngoài việc học thêm những kiến thức kể trên thì sau khi học xong HTML,CSS, và Javascript cơ bản, bạn cũng có thể nghĩ đến việc biết thêm các tool liên quan như làm thế nào để code clean, chia cấu trúc project và chia code thành module như thế nào cho phù hợp. Và đặc biệt nhất, là nâng cao trình độ ngoại ngữ cũng như các kỹ năng mềm khác của mình…

Hy vọng qua bài viết này, bạn có thể tìm thấy được những kiến thức cần phải học tiếp theo sau khi đã học HTML, CSS và Javascript cơ bản nhé. Chúc các bạn luôn thành công!

Nguồn: jobs.hybrid-technologies.vn