Một số công cụ cần thiết được các senior web developer tin dùng

HTML and CSS code developing screenshot. Abstract web site source listing on black background with colored syntax

Nếu bạn là một Web developer thì những công cụ sau đây sẽ giúp ích cho bạn rất nhiều, đây là những công cụ mà mình đang thường xuyên sử dụng trong công việc code hàng ngày.

1. Code Editor

Trình soạn thảo code được coi là công cụ căn bản nhất của một lập trình viên. Trong khi lập trình IOS có Xcode, lập trình Android có Android Studio, lập trình .Net có Visual Studio thì lập trình Web cũng có các công cụ khác nhau như Sublime text, Netbean, Eclipse, Notepad++, …

Việc của lập trình viên là chọn cho mình một công cụ phù hợp, dễ dùng nhất, code nhanh nhất, hỗ trợ tối đa cho công việc. Bạn có thể tham khảo Sublime text vì nó khá nhẹ và nhiều Plugin hỗ trợ.

2. Package manager và task runner

Tiếp theo, bạn cần phải có package manager, là công cụ để quản lý các thư viện, tự động hoá việc cài đặt và cập nhật giúp tiết kiệm thời gian, tránh phức tạp phiền phức. Đồng thời bạn cũng cần task runner để tự động hoá một số thao tác thường gặp trong quá trình làm việc. Bạn có thể dùng composer, bower, npm hay gulp.

3. Quản lý phiên bản

Việc dùng một hệ quản lý phiên bản mã nguồn là rất cần thiết, nó giúp quy trình làm việc code theo nhóm đơn giản hơn rất nhiều. Để sử dụng bạn cần cài đặt một git client như: tortoisegit, git for windows hay sourcetree và một dịch vụ repository hosting như Github hay Bitbucket.

4. CSS preprocessors

CSS preprocessors giúp bạn viết code CSS nhanh hơn, thống nhất hơn với sự mở rộng như: hỗ trợ biến, hàm, compile và nén các tập tin CSS. Có 2 CSS preprocessor phổ biến nhất là less và sass, mình sử dụng sass, compiler cho nó thì có thể dùng CodeKit, Koala hay dùng compiler mặc định của less và sass luôn.

5. Frontend framework

Bạn vẫn có thể code hoàn toàn trang web của mình bằng Html, CSS, nhưng việc đó rất mất thời gian trong khi bạn cần nhanh hơn để theo kịp tiến độ dự án, suy cho cùng cái bạn cần là tạo ra sản phẩm tốt và nhanh nhất. Sử dụng Frontend framework giúp bạn nhanh chóng tạo ra giao diện và làm việc nhóm hiệu quả hơn khi đồng đội của bạn cũng cùng sử dụng Framework đó.

Với web, bạn có thể sử dụng Bootstrap vì nó rất phổ biến, ngoài ra có một framework khá nổi tiếng khác là Foundation 3 cũng khá tốt.

6. Backend framework

Tương tự như Frontend, Backend giúp bạn tối giản những công việc phải làm thường xuyên như thêm hay sửa/xoá dữ liệu bằng các framework cho bạn làm việc nhanh hơn, giảm lỗi phát sinh không cần thiết. Bạn có thể tham khảo Laravel và Codeigniter nếu làm việc chủ yếu với PHP.

7. Các chrome extension hữu ích

Ngoài chrome developer tool quen thuộc thì bạn cũng nên cài vài extension mở rộng như Color zilla để chọn màu trên trang web nhanh và chính xác, measureit để đo đạc khi cắt giao diện cho chuẩn.

8. Nguồn ảnh và chỉnh sửa ảnh

Bạn có thể lên FreePik để tìm kiếm hình ảnh, hầu hết ảnh ở đây đều miễn phí và cho phép tải ở định dạng bitmap hay vector. Dân lập trình web thường không chuyên sâu về đồ họa, tuy nhiên bạn vẫn cần biết sử dụng Photoshop hoặc illustrator ở mức cơ bản để có thể cắt giao diện sang html hoặc css. Ngoài ra, bạn có thể sử dụng gimp cho phép hỗ trợ đầy đủ các tác vụ thông thường và miễn phí.

Khi thiết kế hoặc khi code, đôi khi bạn cần một màu nào đó ngay lập tức hãy đến website: https://color.hailpixel.com/ bạn sẽ có một màu đẹp.

9. Nguồn icon và font

Có 2 cách để tạo icon trên web, một là dùng icon ảnh và một là dùng icon font, mỗi cách có ưu nhược điểm khác nhau. Để tìm icon bạn có thể lên IconFinder, IconMonster để tìm, hoặc sử dụng các icon font có sẵn như FontAwesome, Fontello. Font chữ cho web có rất nhiều trên google font, với sự phổ biến của CSS3, việc nhúng font chữ lên web đã trở nên rất đơn giản.

10. Thư viện Javascript

Có rất nhiều thư viện JavaScript bạn có thể sử dụng cho dự án của mình, phổ biến nhất là jQuery, Angular Js, React Js hoặc Vue.js. Mục đích cuối cùng cũng chỉ là tiết kiệm thời gian công sức, tạo ra sản phẩm nhanh và hoàn thiện.

11. Bug Tracking

Bugsnag chính là công cụ tuyệt vời cho bạn quản lý lỗi, lập trình viên sẽ nhận được email đầy đủ thông tin, thuận tiện cho việc sửa lỗi hiệu quả.

12. Vẽ Wireframe và thể hiện ý tưởng

Wireframe là bản phác thảo thô mô tả tổng quan về sản phẩm, giúp dễ dàng truyền đạt ý tưởng tăng hiệu quả giao tiếp giữa các thành viên trong team. Mình sử dụng phần mềm miễn phí là Pencil project.

13. Tạo và quản lý task với Jira, Redmine

Khi bạn làm việc trong một công ty phần mềm, bạn có thể sẽ được (hoặc bắt buộc) phải sử dụng một phần mềm quản lý task như Jira hoặc Redmine, nó giúp kiểm soát theo dõi vấn đề và lỗi phát sinh trong quá trình của một dự án. Ban đầu bạn có thể sẽ khá khó sử dụng, nhưng sau này bạn lại thích nó và muốn áp dụng vào team của mình.

14. Viết và chia sẻ

Với các bạn lập trình viên nói chung và web developer nói riêng, viết blog công nghệ và chia sẻ kinh nghiệm lập trình là một cách rất tốt để tự học và giúp đỡ cộng đồng. Thật dễ dàng để tạo cho mình một blog bằng wordpress và chia sẻ code của bạn bằng jsfiddle, jsbin, hay codeshre.io.

Bạn cũng cần có thói quen ghi lại mọi thứ, đôi khi ở một nơi nào đó, bạn bất chợt có một ý tưởng hay một cách giải quyết vấn đề mới. Hãy ghi lại ngay bởi sau đó bạn rất có thể sẽ quên mất, mình hay dùng google keep trên điện thoại để ghi chép ngay lúc đó, rất tiện lợi, Ngoài google keep, evernote cũng là một dịch vụ tuyệt vời.

15. Một số công cụ khác

Google Webmaster Tool: là một công cụ hỗ trợ bạn quản lý website được cung cấp miễn phí bởi Google.

Google Analytic: là một công cụ phân tích website hết sức tin cậy, đây được xem là công cụ rất hiệu quả dành cho những Webmaster và những người làm SEO khi muốn thống kê những thông tin về website của mình.

Zoho mail: giúp bạn taọ email theo tên miền miễn phí, dạng như: your_name@domain.com rất chuyên nghiệp.

Techtalk via Viblo