18 nguồn tài liệu học tập cho các nhà phát triển front-end

18 nguồn tài liệu học tập cho các nhà phát triển front-end

Như bạn đã biết, thật khó để theo kịp với những gì mới trong phát triển web. Ngay cả từ cách nhìn nhận về front-end, bạn có thể dễ dàng bị tụt lại phía sau và khiến kỹ năng trở nên lạc hậu.

Vì vậy, có thể sẽ mất vài phút hoặc thậm chí vài giờ để cải thiện kỹ năng viết code bằng cách học một công nghệ mới, API hoặc library.

Để giúp bạn cải thiện kỹ năng, bài viết này đã tổng hợp gần 20 nguồn tài liệu giúp bạn nghiên cứu về phát triển front-end bao gồm các trang tương tác, hướng dẫn, cheat sheet và nhiều thứ khác.

1. CSS Grid Playground

Một hướng dẫn trực quan do nhóm Mozilla tạo ra để giúp bạn tìm hiểu các tính năng Grid Layout mới của CSS với nhiều ví dụ và demo. Hướng dẫn hoạt động như một phần của quảng cáo cho trình duyệt Firefox Developer Edition, nhưng đây vẫn là một hướng dẫn tuyệt vời sẽ hữu ích cho bất cứ ai mới bắt đầu với CSS Grid.

001-1.jpg
2. Modern Javascript Cheatsheet

Bộ sưu tập các mẹo và khái niệm JavaScript của Manuel Beaudru hoạt động như một cái nhìn tổng quan về nhiều điều bạn cần làm quen nếu bạn chỉ mới bắt đầu với một khuôn khổ hiện đại như React hay bất kỳ codebase lớn nào sử dụng tính năng ES6 mới. Tuy nhiên, đây không phải là nơi khởi đầu tốt cho người mới sử dụng JavaScript, nhưng lại hữu ích cho bất kỳ ai đã quen với JavaScript mà không quen với các công cụ và tính năng hiện đại.

002-1.jpg
3. CSS Support Guide For Email Clients

Campaign Monitor là nhà cung cấp dịch vụ marketing và cung cấp dịch vụ email phổ biến đã có một hướng dẫn email CSS trong nhiều năm. Mục đích của hướng dẫn là cho phép tìm kiếm một tính năng CSS và nó sẽ cho biết những gì email client và tính năng mà nền tảng có sẵn. Hướng dẫn đã được cập nhật gần đây để bao gồm các tính năng CSS mới và các mail client mới.

003-1.jpg
4. Learn Git

Git là một lựa chọn tiêu chuẩn trong hầu hết các môi trường nhóm, vì vậy nếu chưa hiểu rõ cách sử dụng, đây có thể là điểm khởi đầu tốt cho bạn. Nó được sản xuất bởi nhóm Microsoft Visual Studio. Hướng dẫ Git bao gồm phiên bản điều khiển cơ bản, cài đặt, thiết lập và nhiều hơn nữa.

004-1.jpg
5. Learn Regex The Easy Way

Hướng dẫn dựa trên GitHub toàn diện được dịch ra 8 loại ngôn ngữ để giúp bạn bắt đầu với Regular Expressions, một kỹ năng hữu ích trong mọi ngôn ngữ lập trình. Mỗi phần thảo luận về một tính năng cụ thể của cú pháp Regular Expression đi kèm với các ví dụ và demo trực tiếp thông qua sân chơi RegExp phổ biến.

005-1.jpg
6. Es2015+ Cheatsheet

Nếu bạn có kinh nghiệm với JavaScript, nhưng vẫn chưa bắt kịp với nhiều tính năng mới được giới thiệu sau phiên bản ECMAScript 5, bản tóm tắt này có thể là chính xác những gì bạn đang tìm kiếm.

006-1.jpg
7. Essential Image Optimization

Addy Osmani (chuyên gia hiệu suất, kỹ sư của Google) đã viết bài hướng dẫn chi tiết để tối ưu hoá hình ảnh. Ông đề cập đến hình ảnh một cách chính xác như là "nguyên nhân số một gây ra bloat trên web" và nói về các loại hình ảnh khác nhau, các kỹ thuật tối ưu hoá, các công cụ tự động hóa, các mạng phân phối nội dung và nhiều hơn nữa.

007.jpg
8. Grid By Example

Grid Layout Module đã cùng với chuyên gia Rachel Andrew đưa ra trang này để cung cấp "mọi thứ bạn cần để học về CSS Layout Grid". Bao gồm các code ví dụ, mẫu bố trí được xây dựng trước, một loạt hướng dẫn bằng video và nhiều liên kết để đọc thêm.

008.jpg
9. React Cheat Sheet

Cập nhật gần đây cho phiên bản mới nhất của React (phiên bản 16) và chính trang web này bây giờ là một ứng dụng web tiến bộ với đầy đủ chức năng (PWA) hoạt động ngay cả khi ngoại tuyến. Bạn có thể tìm kiếm theo từ khóa hoặc chọn một trong các bộ lọc được xác định trước.

009.jpg
10. React Accessibility

Nếu bạn đang sử dụng thư viện như React, có thể bạn nên quan tâm đến các vấn đề về khả năng tiếp cận do bản chất của thư viện. Hướng dẫn này trong tài liệu React chính thức bao gồm một số mẹo về tính khả dụng cho các dự án phản hồi và bao gồm các đề xuất liên quan đến WAI-ARIA, ngữ nghĩa HTML, các biểu mẫu, quản lý các công cụ tập trung và khả năng truy cập.

010.jpg
11. Polymer 2.X Cheat Sheet

Bài viết trên blog của Monica Dinculescu, một kỹ sư của Google làm việc cho dự án Polymer, đóng vai trò là tài nguyên tham khảo nhanh và chuyên sâu về phiên bản mới nhất của thư viện Web Components phổ biến.

011.jpg
12. Bootstrap 4 Cheatsheet

Một vận dụng được phân loại cheat sheet cho Bootstrap, framework web front-end phổ biến, với lựa chọn nhấp chuột để làm nổi bật những thứ mới trong Bootstrap 4. Nhấp vào một category, sau đó nhấp vào bất kỳ item để xem code và xem trước trực tiếp các thành phần được lựa chọn.

012.jpg
13. Learn CSS Grid

Một hướng dẫn mở rộng khác về Grid với cách bố trí đẹp, sạch sẽ và đơn giản.

013.jpg
14. React Express

6 chương về thủ thuật và hướng dẫn để học tập xây dựng các ứng dụng web với React. Thảo luận về thiết lập môi trường, xây dựng các công cụ, JSX, cùng với tất cả các nguyên tắc cơ bản để bắt đầu viết các ứng dụng trong React.

014.jpg
15. CSS Cheat Sheet

Một thiết kế rất độc đáo và đơn giản sử dụng tài liệu tham khảo one-page cho các CSS selector và properties. Đây là một trong những phân loại có thể làm việc tốt như là một hướng dẫn cho người mới bắt đầu. Nó cũng bao gồm các loại cho Flexbox và CSS Grid.

015.jpg
16. The Modern Javascript Tutorial

Một tài nguyên toàn diện cho việc học JavaScript, hữu ích đối với tất cả các trình độ của các nhà phát triển JavaScript. Trang web được chia thành ba phần: Ngôn ngữ JavaScript, DOM, và các bài viết linh tinh khác.

016.jpg
17. React Faq

Đây là một bộ sưu tập thú vị của React concepts trong định dạng Q&A bao gồm nhiều chủ đề khác nhau. Có thể làm việc tốt như hướng dẫn đối với người mới bắt đầu hoặc thậm chí là một tài liệu tham khảo nhanh cho các nhà phát triển có kinh nghiệm.

017.jpg
18. HTML5 Mobile Feature Checker

Đây là trang web tham khảo để nhận được tổng quan về hỗ trợ cho các API Web khác nhau trên điện thoại di động. Nó liệt kê danh sách "an toàn" so với những trang không an toàn (được gọi là "không được hỗ trợ"). Bạn có thể nhấp vào từng tính năng riêng lẻ để biết thông tin chi tiết về những thiết bị và nền tảng hỗ trợ nó.

018.jpg

PVS - Theo Developerdrive
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Hosting Giá rẻ

hosting free
hosting free
Top Bottom