Front-end developer lên trình như thế nào? Bạn đã thực sự hiểu về Front-End?

Front-end developer chịu trách nhiệm về những công việc tiếp xúc trực tiếp với tương tác của người dùng, trong khi back-end developer lại làm việc với data và những công nghệ đằng sau. Vậy, con đường sự nghiệp của một Front-end developer sẽ diễn ra như thế nào? Và nên tích lũy những gì, ở đâu để lên trình nhanh nhất?

Hãy cùng Station D trò chuyện cùng chuyên gia đến từ Chợ Tốt và tìm kiếm câu trả lời cho riêng mình nhé!

Đôi nét về khách mời Trần Trọng Thanh

• Bắt đầu bằng công việc Flash Developer, công việc về những giao diện và trải nghiệm dành cho người dùng tại công ty Pyramid Consulting
• Công tác 3 năm tại Singapore, vị trí UI Developer và Front-end
• Về Việt Nam khởi nghiệp với Nâu Studio
• Hiện tại đang là Principal Web Engineer tại Chợ Tốt

Tại sao anh lại chọn Frontend mà không phải những hướng khác như Backend hay Fullstack?

Mình bắt đầu từ Flash, sau đó tới UI và đến bây giờ là Front-end: tất cả những thứ đó đều xoay quanh một cái giao diện để tương tác trực tiếp với người dùng, điều đó tạo cho mình sự hứng thú rất lớn so với việc làm Backend hay những công việc phải tương tác nhiều với data.

Thử tưởng tượng mình làm ra một cái sản phẩm, 1 front-end website được xuất lên Internet, nó sẽ tiếp xúc được với rất nhiều người dùng trên đó, mình sẽ rất tự hào với sản phẩm, thành quả mà mình đem lại.

Những khái niệm cơ bản về Front-end

Cách hoạt động và một số khái niệm cơ bản cần nắm?

Một lập trình viên Front-end – Front-end Developer sẽ làm ra các thành phần cho một website được chạy trực tiếp trên trình duyệt, những gu lập trình đó là HTML, CSS và JavaScript. Tuy nhiên với xu hướng mới bây giờ cùng những kỹ năng sẵn có của các bạn Frontend thì có thể mở rộng hoạt động cho mình như viết ứng dụng cho mobile theo mô hình hybrid, thậm chí là có thể viết những ứng dụng chạy trên desktop về sử dụng nền tảng web để có thể chạy được trên nhiều hệ điều hành khác nhau. Đó chính là một cái nhìn tổng quát về Front-end.

Ngoài ra theo mình các bạn cần có một số kỹ năng khác thiên về giao diện và trải nghiệm người dùng hơn, ví dụ như bạn phải có khả năng quan sát và chú ý đến chi tiết, nó sẽ giúp ích rất nhiều cho quá trình làm việc.

Vì làm với giao diện, bạn phải có sự nhạy cảm với màu sắc về hình khối và bố cục, như phải chú ý đến canh lề, canh hàng giữa các khối trên giao diện của mình hoặc những icon khi đặt vào nó có ngay giữa hay chưa. Đôi khi nếu mình không có những cảm quan đó thì mình sẽ không để ý và bỏ qua.

Và điều cuối cùng anh nghĩ là một bạn frontend giỏi cần có khả năng tưởng tượng, vì khi làm frontend các bạn rất hay sử dụng các animation hoặc những chuyển động trên trang, bằng khả năng tưởng tượng mình sẽ hình dung được trước những cái đó sẽ xảy ra như thế nào rồi từ đó mới thực hiện lại trong code của mình, như thế chắc chắn nó sẽ chuẩn xác hơn.

Sự khác nhau trong công việc hàng ngày của một Fresher Frontend Dev cho đến cấp bậc Junior, Senior là gì?

Công việc của Fresher chủ yếu là các bạn sẽ làm theo những mẫu có sẵn mà các anh chị đi trước đưa ra. Tiếp theo là Junior thì ở trình độ này các bạn đã có thể làm việc được rồi nhưng vẫn phải tiếp tục học vì những kiến thức chuyên sâu như CSS, JavaScript ở trường không có dạy nên các bạn phải vừa học vừa làm. Đây cũng là khoảng thời gian để các bạn thu nhặt kinh nghiệm cho mình và làm sao để cho công việc trở nên thành thục hơn.

Ngoài ra có một vị trí cũng hay được đưa ra mà anh muốn nói đến là Middle. Với Middle hầu như các công việc cơ bản các bạn đã thành thục rồi, nhưng ở vị trí này các bạn bắt đầu tìm hiểu sâu hơn về những công nghệ mới của Frontend ví dụ như là frameworks và có thể giúp đỡ các bạn ở vị trí thấp hơn giải quyết các vấn đề liên quan.

Đối với Senior thì cái mà vị trí này cần quan tâm nhiều nhất chính là user experience. Khi anh càng lên các vị trí cao hơn thì anh thấy các vị trí này càng đòi hỏi phải tập trung hơn và phải có khả năng hỗ trợ hơn ở một góc độ mới là developer experience. Tại sao lại nói như vậy? Vì khi các bạn đã lên đến vị trí Senior rồi thì các bạn phải làm sao hỗ trợ cho team của mình hoạt động hiệu quả hơn, với kinh nghiệm của mình phải đưa ra được những giải pháp cũng như các framework, các thiết kế để làm sao team mình có thể tạo ra những trải nghiệm tốt nhất cho user.

Ứng tuyển ngay các vị trí tuyển dụng Frontend trên Station D

Nếu muốn theo đuổi con đường Frontend chuyên nghiệp thì cần chuẩn bị những gì, học những nguồn nào theo kinh nghiệm của anh?

Theo anh nghĩ thì trước tiên mình cần trau dồi thêm khả năng đọc tiếng Anh vì những nguồn thông tin cập nhật mới nhất nó không được viết bằng tiếng Việt, nên nếu em có khả năng đọc tốt, khả năng research tốt thì việc học của mình sẽ đạt hiệu quả cao hơn.

Còn về các nguồn học thì anh thấy gần đây có nổi lên một số nguồn platform nổi bật các bạn lập trình viên hay vào để viết bài là Viblo.asia, là trang để các bạn lập trình viên chia sẻ kinh nghiệm của mình. Cũng như các bạn frontend mới học thì các bạn viết rất nhiều bài JavaScript và frontend, đó là những topic mà các bạn rất quan tâm, mình thấy đó cũng là một cái hay. Còn khi các bạn học đại học, để tra cứu thì anh thấy có website Mozilla Developer Network, các bạn có thể search bất cứ chủ đề nào về JavaScript hoặc frontend với các từ khóa thì sẽ cho ra ngay kết quả mà mình tìm. Đây là những nguồn tra cứu công nghệ frontend trội nhất. Còn để thực hành các bạn cũng có thể vào trang “”w3school””, trên đây có khá nhiều các bài tập để mình có thể thực hành.

Nhưng khi mà các bạn lên cao hơn ở tầm vươn ra với thế giới rồi thì anh thấy kênh hữu hiệu nhất để mình cập nhật những kiến thức mới đó chính là thông qua nền tảng Twitter. Vì không giống như Việt Nam, các lập trình viên ở nước ngoài đa số họ sử dụng Twitter nên mình cũng hay lên đó. Đầu tiên các bạn có thể tìm và follow những tác giả của những thư viện vùng mở rồi sau đó từ những người mà bạn follow nó sẽ có các đề xuất để mình tiếp tục follow các topic và các nhân vật KOLs, họ rất hay chia sẻ và giúp mình có thêm những cập nhật mới. Còn nếu các bạn muốn có một nơi để mình tìm những thông tin cập nhật mới bằng tiếng Việt qua facebook thì các bạn có thể tham gia nhóm mà anh đang là admin: Sài Gòn Frontend Developer, anh cũng chỉ join mỗi group đó và hay post lên group đó thôi. Có những cập nhật gì mới hay những cái gì hay ho anh sẽ post lên đó để những bạn có cùng sở thích với mình tiện theo dõi.

Công việc của vị trí Principal Engineer là gì?

Anh sẽ nói qua về Chợ Tốt cho những bạn chưa biết, hiện tại đây là nền tảng rao vặt miễn phí lớn nhất ở Việt Nam. Nơi để người dùng vào trang này hiện tại chia làm 2 nền tảng chính là web và mobile app. Nhiệm vụ chính của anh ở vị trí này là xây dựng một đội ngũ Frontend Engineer mạnh ở Chợ Tốt, từ đó anh sẽ giúp công ty và team đưa ra web app cũng như sản phẩm về web có chất lượng cho nền tảng Chợ Tốt của công ty.

Nói sơ qua về cấu trúc của Chợ Tốt, một team gọi là product và test, các bạn sẽ được phân vào nhiều working group theo những nhóm chức năng của nền tảng, như làm về seller và buyer hoặc liên quan đến molitization. Các bạn frontend trong Chợ Tốt sẽ được phân rải rác vào trong những working group này để làm việc cho những chức năng đó. Các frontend developer đó sẽ họp lại với nhau thành một nhóm gọi là Web Charter, anh sẽ như là thư ký của Web Charter này. Những thử thách ở vị trí này có thể kể đến là mình sẽ hỗ trợ các bạn frontend những vấn đề khó hoặc hóc búa, đôi khi những frontend ở trình độ thấp hơn mà họ không thể giải quyết được như xử lý các vấn đề về performances hay mức độ tải trang cho một số app mà Chợ Tốt đang làm.

Ngoài ra anh sẽ giúp thiết kế những framework sử dụng chung giữa các team với nhau. Thêm nữa anh sẽ giúp chuẩn hóa quy trình để làm sao khi các bạn deliver qua app của mình sao cho nó đạt chất lượng cao thông qua các hoạt động như code review hay là những công cụ kiểm tra social code của bạn. Anh cũng tham gia phỏng vấn tuyển dụng các bạn Frontend và Fullstack Dev vào công ty, giúp cho đầu vào đảm bảo và training đào tạo các bạn sau này.

Lời khuyên và bài học thực tế

Thách thức cụ thể của một Tech Lead và một Principal Software Engineer phải đối mặt, cụ thể ở Chợ Tốt là gì?

Anh nghĩ nhìn chung về vị trí này thì những thách thức hay gặp là giúp cải thiện performance cho web app của mình và làm sao để đưa ra được 1 framework chuẩn và bộ thư viện chuẩn cho toàn bộ team. Bây giờ khi mình đã deliver được rất nhiều website và web app rồi thì team size của mình bắt đầu lớn lên, số lượng nhân sự trong team sẽ nhiều lên thì xu hướng bây giờ là làm sao để các bạn front-end tạo ra được những trang web mới hoặc những chức năng mới cho sản phẩm trên web của mình.

Và một thử thách nữa là mình phải tạo ra một cái design system – một nơi để hệ thống hóa lại những component hoặc các mẫu, chuẩn hóa tất cả lại vào một design system giúp cho các bạn front-end tạo thành một module tùy theo yêu cầu của doanh nghiệp.

Một thử thách khác là làm sao để giúp các bạn Dev Engineer làm việc với nhau tốt nhất theo tiêu chuẩn mà mình đưa ra cũng như với các phòng ban khác trong cùng 1 working group.

Rất nhiều thử thách đặt ra vậy thì, liệu có thách thức nào khiến anh nhớ mãi đến tận bây giờ không?

Anh nghĩ trải nghiệm đáng nhớ nhất của mình ở Chợ Tốt là khi anh vào Chợ Tốt cũng được khoảng 3 tháng, lúc đó anh tham gia một dự án đã gần hoàn thành và sắp release. Yêu cầu lúc đó là đánh giá performance, tốc độ tải trang của app đó trước khi đưa lên production. Kết quả đánh giá khá thấp, đó cũng là challenge đầu tiên của anh, nhiệm vụ của anh cùng với các bạn trong team lúc đó là làm sao để cải thiện điểm này lên.

Bọn anh cùng chung tay đánh giá và xem xét các điểm, các nút thắt cổ chai hoặc những vấn đề đối với bộ đóng gói, kích thước size của nó khá lớn, có một số vấn đề như vậy. Cũng mất một khoảng thời gian cùng làm việc với các bạn trong team sau đó đã cải thiện được rất nhiều. Lúc đó theo anh nhớ thì tool lighthouse của front-end điểm này đã được cải thiện ít nhất cũng gấp 2, gấp 3, tất nhiên là điểm tuyệt đối thì nó cũng không cao lắm so với mong đợi, nhưng so với trước khi anh tiếp nhận và kết quả cuối cùng thì nó đã cải thiện rất nhiều. Nhờ đó anh cũng rút ra được khá nhiều các bài học để đưa ra hướng dẫn và lưu ý để các bạn Junior sau này làm việc có thể cải thiện được những nút thắt cổ chai đó.

Cách anh phân bổ tasks và quản lý team như thế nào?

Vị trí của anh thì đóng vai trò như người điều phối là chính và thư ký cho một nhóm các bạn Front-end Engineer. Các bạn sẽ làm việc cùng với một Fullstack team cùng với những bạn khác như backend, dev, mobile dev và product order, tester. Working group đó chạy theo mô hình scrum như mọi người cũng hay biết. Ở vị trí web charter anh sẽ cố gắng đưa ra một số hoạt động như là họp định kỳ để khi đó mình nắm được tình hình và cách làm việc của các bạn trong working group như thế nào, các bạn có khó khăn gì thì trong buổi họp định kỳ đó mình sẽ đưa ra để mọi người cùng nhau giải quyết. Đó cũng là cách để mình hiểu các bạn hơn, nắm được bạn đang làm gì trong công việc của bạn đó.

Đa số là hoạt động online, mình sử dụng Zira và có các dự án trên đó, mình sẽ đưa ra các ý kiến như về chuẩn hóa, conversion hay những quy chuẩn của team, tùy theo mỗi quy trình mà mình sẽ đưa ra những task cụ thể. Trong các buổi họp chung mình sẽ hướng dẫn cho các bạn, từ đó các bạn sẽ triển khai trong công buổi họp để các bạn liên quan thảo luận với nhau.

Mất bao lâu để trở thành một Senior Front-end Dev? Lời khuyên cho các bạn hiện đang là Junior “trong thời gian dài”.

Theo quan sát và đánh giá của anh về khối lượng công việc cũng như trình độ mà các bạn cần đạt được thì anh nghĩ ít nhất cần 3 năm để đạt được vị trí Senior.

Trong 3 năm đó thứ nhất là để các bạn tích lũy kinh nghiệm làm việc thực tế trong các dự án và để học các kiến thức liên quan. Nên anh nghĩ là sẽ không có shortcut – lối tắt để chỉ sau 1 – 2 năm đã trở thành Senior được. Và khi các bạn Junior vào thì các bạn cũng phải học rất nhiều để nắm vững những framework đó. Để đạt được vị trí Senior thì anh nghĩ mình phải luôn đặt ra những mục tiêu học là những nền tảng của Front-end, về những cái cản bản nhất của JavaScript, CSS.

Như anh đề cập có một số bạn vẫn ở vị trí Junior dù đã đi làm một thời gian khá là lâu anh nghĩ là do các bạn chưa có tinh thần học hỏi, các bạn chỉ đến công ty và làm các task được giao mà thôi. Ở công ty thì các bạn sẽ làm trực tiếp các tính năng và các phần được giao, công việc này phần nào đó sẽ lặp đi lặp lại cho nên để mình có thể tiến xa hơn, hiểu sâu hơn thì bắt buộc các bạn nên tự học thêm về nó.

Có một tip anh rút ra được là dù mình làm ở những cấp độ cao – highlevel nhưng mình vẫn phải luôn đặt ra câu hỏi cách hoạt động của nó như thế nào, research để tìm hiểu cách hoạt động bên dưới của nó. Khi có cái mình thấy hay, thấy tò mò về cách hoạt động thì phải luôn luôn đi tìm hiểu nó và đó cũng là cách để mình có những kiến thức nền tảng cho mình. Qua thời gian mình sẽ có đủ kiến thức và khả năng đạt được vị trí Senior.

Rất cảm ơn những chia sẻ hết sức thiết thực của anh Trần Trọng Thanh. Hy vọng qua bài phỏng vấn lần này, các bạn độc giả sẽ có được những lựa chọn phù hợp cho bản thân. Chúc các bạn đạt nhiều thành công trong cuộc sống.

Có thể bạn quan tâm:

• Lập trình viên Front end ban đầu nên bỏ túi những gì
• Lập trình Front-end và những bài học “trần trụi”
• Nguồn tự học web front-end và web configuration ngon bổ rẻ

Xem ngay những tin đăng tuyển dụng IT mới nhất trên Station D