Angular, một framework JavaScript mạnh mẽ, đang trở thành lựa chọn hàng đầu cho phát triển giao diện web (front-end) bởi Google. Rất nhiều công ty lớn như Forbes, General Motors, Upwork… đang ứng dụng Angular vào các dự án của mình.
Để trở thành một Front-end Developer giỏi, việc nắm vững Angular là điều không thể thiếu.
Bài viết này tổng hợp từ cuộc phỏng vấn anh Trần Thuận Nghĩa – Software Engineer tại VinID, người có nhiều năm kinh nghiệm với Angular, sẽ giúp bạn hiểu rõ hơn về:
- Angular là gì? Phân biệt AngularJS và Angular như thế nào?
- Có nên bắt đầu sự nghiệp với vị trí Front-end Developer?
- Những tố chất cần thiết để thành công trong lĩnh vực Front-end.
- Tài liệu học Angular hữu ích và lời khuyên từ chuyên gia.
Mục Lục
Từ Cử Nhân Tài Năng Đến Software Engineer Tại VinID
Chào anh Nghĩa, anh có thể chia sẻ một chút về quá trình học tập và làm việc của mình được không?
Trước đây, tôi học lớp Cử nhân tài năng ngành Công nghệ thông tin tại Đại học Khoa học Tự nhiên. Trong quá trình học, tôi cũng tham gia một số cuộc thi lập trình và đạt được một số giải thưởng, ví dụ như giải 3 cuộc thi lập trình ACM toàn quốc.
Tuy nhiên, vì cảm thấy chán và một phần ham chơi, tôi đã quyết định bỏ học giữa chừng để đi làm.
Thời điểm đó, tôi vấp phải nhiều chỉ trích. Mọi người cho rằng tôi sẽ không làm được gì. Tôi đã cố gắng rất nhiều để chứng minh rằng không có bằng đại học, tôi vẫn có thể thăng tiến trong công việc. Năng lực là yếu tố quyết định, chứ không phải tấm bằng.
Và thực tế chứng minh, tôi không thất nghiệp mà vẫn theo đuổi công việc Developer cho đến bây giờ.
Bước Chân Vào Thế Giới Angular
Công việc đầu tiên của anh sau khi dừng việc học là gì?
Tôi làm Partner cho Sino Corporation. Công ty này chuyên về các sản phẩm mã vạch (barcode). Nhiệm vụ của tôi là viết phần mềm đi kèm để hỗ trợ sử dụng sản phẩm. Đây cũng là lần đầu tiên tôi tiếp xúc với Angular.
Vậy, theo anh, Angular là gì?
Angular là một JavaScript framework được phát triển bởi Google, dùng để xây dựng giao diện web (Front-end).
Ví dụ, nếu làm thủ công, bạn có thể tạo ra 10 sản phẩm mỗi ngày. Nhưng nếu có công cụ hỗ trợ, bạn có thể tạo ra 100, thậm chí 1000 sản phẩm.
Angular cũng tương tự như vậy. Nếu không sử dụng framework này, Developer sẽ mất rất nhiều thời gian để hoàn thiện giao diện web.
Ngoài tiết kiệm thời gian, còn lý do nào khác khiến Developer sử dụng Angular không?
Theo tôi, ngoài việc giúp tiết kiệm thời gian, Angular còn được ưa chuộng vì những lý do sau:
- Được Google “chống lưng”: Điều này tạo cho Developer cảm giác an tâm, rằng framework này sẽ không dễ dàng bị “khai tử”.
- Cộng đồng người dùng lớn: Khi gặp vấn đề, bạn sẽ nhanh chóng nhận được sự hỗ trợ từ cộng đồng.
- Phát triển ứng dụng Single-page Application (SPA): Đây là loại ứng dụng chạy trên trình duyệt mà không cần tải lại trang mỗi khi thao tác.
Cá nhân tôi thích Angular vì framework này được viết bằng ngôn ngữ TypeScript do Microsoft phát triển. TypeScript giúp code dễ đọc, dễ bảo trì hơn.
Sự khác biệt chính giữa AngularJS và Angular là gì?
AngularJS là tên gọi của Angular phiên bản 1 (ra đời năm 2009), được viết bằng JavaScript.
Còn Angular là tên gọi chung cho các phiên bản Angular từ 2 trở lên (ra đời năm 2016), được viết bằng TypeScript – một phiên bản nâng cao của JavaScript.
Kiến trúc của Angular và AngularJS hoàn toàn khác nhau. Hiện tại, AngularJS không còn được Google hỗ trợ nâng cấp nữa.
Công Việc Hàng Ngày Của Một Front-End Developer Với Angular
Công việc hàng ngày của anh ở vị trí Front-end Developer là gì?
Cũng như các công ty áp dụng mô hình Scrum, chúng tôi tổ chức họp hàng ngày để thảo luận về các vấn đề đang gặp phải.
Ví dụ: chưa nhận được API từ team Back-end hoặc API chưa có đủ thông tin. Sau đó, tôi bắt tay vào giải quyết các công việc:
- Viết và chỉnh sửa giao diện theo yêu cầu. Ví dụ: viết xử lý cho các hiệu ứng (animations), thay đổi các yếu tố (elements), các nút (buttons)…
- Sử dụng Git để quản lý source code.
- Review code, review UI/UX.
- Viết component có thể tái sử dụng.
- Định nghĩa bộ style button, icon, color … cho hệ thống và áp dụng.
- Tối ưu performance của website: tốc độ load trang, hình ảnh…
Tôi thấy rằng, so với Back-end Developer, công việc của Front-end Developer có phần khó hơn. Back-end chỉ cần đảm bảo “code chạy là được”, input cái này sẽ output ra cái kia. Còn với Front-end, code chạy được chỉ là một phần, việc hiển thị giao diện như thế nào lại là một câu chuyện khác.
Sai Lầm và Bài Học
Anh có thể chia sẻ về một sai lầm đáng nhớ và bài học rút ra từ đó được không?
Trước đây, tôi từng mắc sai lầm khi viết code ở phía giao diện, dẫn đến trang web bị crash. Tức là khi một trang phải xử lý quá nhiều dữ liệu, bộ nhớ (memory) không đáp ứng được.
Khi nhận được thông báo lỗi, tôi mới phát hiện ra code của mình trong lưới (grid) bị loop – tình trạng vòng lặp, cứ nửa giây lại gọi hàm kiểm tra dữ liệu trong lưới.
Với lưới chỉ có 2-3 dòng thì không sao, nhưng khi tăng lên 100 dòng thì xảy ra crash. Cụ thể, khi Tester kiểm thử, họ test với số lượng chi tiết đơn hàng quá ít, nên không phát hiện ra vấn đề. Nhưng khi release và khách hàng sử dụng, chi tiết đơn hàng lên đến hàng trăm, hàng ngàn dòng thì lỗi xảy ra.
Mặc dù không gây ra hậu quả nghiêm trọng, nhưng đó vẫn là lỗi của tôi khi không lường trước được tình huống này. Tôi đã phải sửa lại syntax trong code và mất thêm 2 ngày để khắc phục.
Sau này, tôi đọc các đề xuất (recommend) từ trang chủ của Angular và thấy họ cũng khuyến cáo không nên viết code như vậy. Giá mà tôi biết điều này sớm hơn!
Từ đó, tôi theo dõi các bài viết về Angular thường xuyên hơn (chủ yếu trên trang Medium). Mỗi ngày, tôi đều nhận được các bài viết mới liên quan đến các tiêu chí mà tôi đã chọn.
Tôi đọc các bài chia sẻ kinh nghiệm về Angular để biết các vấn đề có thể xảy ra. Tất nhiên, không thể nhớ hết tất cả các trường hợp, nhưng khi cần, tôi biết rằng nó có tồn tại để tìm lại.
Ví dụ, bạn đọc báo và biết đến sự tồn tại của máy hút bụi. Sau này, khi bạn có nhu cầu làm sạch bụi bẩn mà không tốn nhiều thời gian và công sức, bạn sẽ nhớ ngay đến công cụ này để tìm kiếm và mua nó.
Ngoài ra, khi test, tôi không chỉ quan tâm đến tính năng mà còn xem xét cả khả năng xảy ra vấn đề. Ví dụ, thay vì test trên số đơn hàng, tôi sẽ quan tâm hơn đến số chi tiết đơn hàng…
Có điều gì về nghề Front-end Developer khiến anh ngạc nhiên không?
Tôi thấy nhiều bạn đang hiểu sai về Front-end Developer. Họ nghĩ rằng chúng tôi, ngoài việc code, còn phải biết cắt file photoshop ra file HTML nữa (cười).
Kỹ Năng và Tố Chất Cần Thiết
Theo anh, những kỹ năng và tố chất nào là cần thiết đối với một Front-end Developer?
Có trách nhiệm với công việc.
Dù chưa biết mình làm tốt hay không, hãy cố gắng hết mình. Đừng làm việc một cách đối phó, với suy nghĩ “code chạy là được”. Nếu biết các rủi ro tiềm ẩn, hãy giải quyết chúng trước và luôn tìm cách để tăng hiệu suất làm việc.
Trước đây, tôi chỉ viết component dùng chung cho dự án (A) mà tôi đang làm. Sau này, khi chuyển sang dự án (B) khác, tôi muốn sử dụng lại các component này thì tôi phải copy rồi paste sang. Điều này khá mất thời gian. Nếu các component ở A có thay đổi, B cũng không được cập nhật.
Vì vậy, tôi đã chuyển các component này thành các package trên npm. Chỉ cần tải (install) package và phiên bản tương ứng là có thể sử dụng được.
Có kiến thức về UI, UX.
Ở một số công ty nhỏ, không có kinh phí thuê Designer, Front-end Developer phải đảm nhận luôn nhiệm vụ thiết kế UI, UX. Vì vậy, bạn cần tự học hỏi và rút kinh nghiệm từ những phần mềm xung quanh, xem vì sao phần giá thường sử dụng màu đỏ, nút này để màu xám, thông tin kia được in đậm….
Khi tôi tham khảo phần mềm kế toán MISA, tôi thấy người dùng không muốn bấm quá nhiều nút và hiển thị quá nhiều thông tin không cần thiết. Nếu sau này tôi làm phần mềm tương tự, tôi sẽ tránh mắc phải lỗi này.
Tôi nhớ có một lần tôi tự ý đổi giao diện Front-end vì thấy không hợp lý, khi đó tôi còn làm Technical Leader cho Smartlog. Đa số cấp dưới của tôi đều phản ứng lại, nói rằng: đổi giao diện mà không báo với khách hàng thì không được, giao diện mới khó nhìn, nhìn không quen… Nhưng tôi vẫn giữ nguyên ý kiến của mình.
Như Facebook, họ đổi giao diện mà đâu có báo trước với mình. Những người dùng sau cũng không biết giao diện trước như thế nào…
Sau đó, khách hàng vẫn sử dụng giao diện mới bình thường. Thực tế là ai cũng có xu hướng phản ứng với những thay đổi, nên đôi khi mình phải phân biệt xem cái nào hợp lý và giữ vững quan điểm.
Luôn cập nhật công nghệ, phiên bản mới.
Nếu ứng dụng/phần mềm của bạn viết bằng Angular 4, nhưng phiên bản mới nhất đã lên đến Angular 8, Angular 9 mà bạn vẫn không cập nhật (upgrade) vì ngại rủi ro, thì đó là một điều không tốt.
Lời Khuyên Cho Người Mới Bắt Đầu
Anh có nghĩ Front-end Developer là một khởi đầu tốt cho những người mới bước vào ngành IT không?
Điều này còn tùy thuộc vào sở thích của mỗi người. Nếu bạn không muốn đi sâu vào data hay phân tích hệ thống, bạn có thể chọn Front-end.
Nhưng nếu muốn tiến xa hơn trong sự nghiệp, tôi khuyên các bạn nên học chính quy để được dạy về cách tư duy logic như lập trình hướng đối tượng, cấu trúc dữ liệu và giải thuật… Điều này giúp bạn hiểu rõ bản chất của ngôn ngữ lập trình.
Nếu bạn chỉ xem Front-end như một công việc tay ngang, chỉ đơn giản copy và paste, làm tương tự miễn sao ra được giao diện, thì sự nghiệp của bạn sẽ có giới hạn.
Một người mới trở thành Front-end Developer (chưa có kinh nghiệm thực tế) nên làm gì nếu dự án đầu tiên quá phức tạp?
Nếu dự án phức tạp, bạn nên đặt câu hỏi với những người có kinh nghiệm trong team, nhưng lưu ý không nên hỏi quá nhiều. Hãy đặt mình vào vị trí người được hỏi, họ còn có công việc riêng và không thể giải đáp cho bạn mãi được.
Bản thân tôi cũng vậy, tôi chỉ hỏi những ý chính (theo kiểu từ khóa) rồi sau đó tự tìm hiểu thêm.
Ví dụ, tôi hỏi:
- Ở Front-end đang sử dụng những thư viện gì?
- Tổ chức các thư mục (module) như thế nào?
- Chức năng của từng thư mục là gì?
- Có gì cần lưu ý hay không?
Chứ không hỏi những câu hỏi quá chi tiết như: “Code chỗ này nghĩa là gì vậy anh?” nhiều lần.
Tài Liệu Tham Khảo Hữu Ích
Anh có thể chia sẻ những tài liệu mà anh đã từng tham khảo về Angular và Front-end không?
Tôi đã tham khảo khá nhiều tài liệu, nhưng tôi đánh giá cao nhất những nguồn sau:
- Angular.io: Website giúp người mới tìm hiểu và làm quen với Angular. Bạn sẽ học được những khái niệm, syntax cơ bản trong Angular và cách tạo một project Angular.
- Khóa học Angular từ cơ bản đến nâng cao: Nhận diện những lỗi thường gặp khi sử dụng Angular và biết cách xây dựng một ứng dụng thương mại điện tử với Angular, Firebase, Bootstrap 4.
- Angular 2 Notes for Professionals: Ebook miễn phí, được tổng hợp và biên soạn dựa trên những chia sẻ của các chuyên gia Angular trên Stack Overflow. Trình bày tất tần tật các tính năng của Angular cũng như các mẹo hữu ích để làm việc hiệu quả với chúng.
- Angular Crash Course for Busy Developers: Khóa học này khá hữu ích với những developer bận rộn. Chỉ cần dành ra 10 giờ học, bạn sẽ nắm được những kiến thức chủ chốt nhất về Angular framework.
Bạn có phải là Front-end Developer và là “fan” của Angular? Hãy chia sẻ bài viết này để giúp cộng đồng Developer cùng phát triển!