TOOL HỮU ÍCH CHO FRONT-END DEVELOPER BẠN ĐÃ BIẾT? (PHẦN 1)

TOOL HỮU ÍCH CHO FRONT-END DEVELOPER BẠN ĐÃ BIẾT? (PHẦN 1)

Phát triển một website có tính thẩm mỹ toàn diện có thể là một việc rất dễ làm nản lòng ngay cả đối với các Front-end Developer có kinh nghiệm lâu năm. Bạn phải xác định xu hướng, các chuẩn mực hiện hành và định rõ cách để kết hợp chúng vào trong thiết kế của bạn. Nhờ sự phát triển của công nghệ ngày nay, có rất nhiều công cụ miễn phí có sẵn có thể giúp bạn đẩy nhanh tốc độ nỗ lực của bản thân và làm việc 1 cách hiệu quả hơn. Dưới đây, Hybrid Technologies sẽ chỉ ra một số tool hữu ích cho các Front-end developer.

Font

Trong một layout website thường có những Icon giúp website đẹp và thân thiện hơn, ngoài ra còn có tác dụng điều hướng người dùng. Trước đây để tạo các Icon đó ta phải thực hiện cắt chúng ra từ file PSD và dùng CSS để gán background hoặc dùng thẻ img để đưa Icon đó vào. Tuy nhiên hiện nay chúng ta đã có giải pháp khác đó là sử dụng Symbol Font (font chữ kiểu ký hiệu). Hiện nay có nhiều thư viện Symbol Font nhưng mạnh nhất và hay sử dụng nhất là Font Awesome, Material icon… vì nó đơn giản và dễ sử dụng.

1. Awesome Font

Font Awesome là một trong những icon font phổ biến nhất hiện nay. Với phiên bản mới nhất hiện tại 5.5.0, Font Awesome hỗ trợ trên 1400 icon free.

2. IcoMoon Font

IcoMoon thực chất là một ứng dụng cho phép bạn tuỳ chỉnh icon font, import SVG để tạo ra font riêng, convert font sang SVG, PDF, XAML, CSH… Và IcoMoon cung cấp hơn 5000 icon free bằng cách tối ưu từ nhiều thư viện miễn phí khác nhau

CSS Generator

1. CSS tool

Đây là công cụ tổng hợp không thể thiếu của một CSS Developer. Có rất nhiều tool dùng để tạo box-shadow, background gradient, text efftect, transform…

2. Image Sprites

Với một Frontend developer chắc không xa lạ với kỹ thuật image sprites. Đây là phương pháp giúp tối ưu website, tuy nhiên để xác định tọa độ (background-position) thật là một điều khó khăn. 

Trên đây là một số công cụ cần thiết của một Web Developer. Hy vọng những công cụ này có thể hỗ trợ phần nào cho công việc lên ý tưởng, hoàn thiện thiết kế UI và phát triển phần code Frontend cho các dự án của các bạn. Cùng đón đọc phần 2 và khám phá thêm những tool hữu ích khác nữa nhé!

Facebook Comments
TOOL HỮU ÍCH CHO FRONT-END DEVELOPER BẠN ĐÃ BIẾT? (PHẦN 1)
4.5 (90%) 2 votes

Bạn thích bài viết này chứ? Đăng ký để nhận những bài viết thú vị như thế hàng tuần.

Đừng sợ thất bại, chỉ sợ việc dậm chân tại chỗ

TÌM VIỆC
Bình luận