The world of JS libraries
Có hàng ngàn thư viện JavaScript mà bạn có thể đưa vào trang web của mình và nhiều khía cạnh của trang web mà họ có thể giúp bạn:
- Thao tác DOM
- Sự kiện DOM
- AJAX / Truy xuất dữ liệu
- Hiệu ứng & hoạt hình
- Tạo khuôn mẫu HTML
- Bố trí trang
- Các widget UI
- Đồ họa và biểu đồ
- Mô hình hóa dữ liệu
- Định tuyến & điều hướng
- Khả năng tiếp cận
- Hỗ trợ nhiều trình duyệt
- Hỗ trợ di động
Đây là một cách khác mà tôi muốn nghĩ về nó - một trang web được tạo thành từ Giao diện người dùng (HTML & CSS), Tương tác (JS + DOM) và Dữ liệu (mà chúng tôi thường đưa vào thông qua JS). Bạn có thể tạo giao diện người dùng tương tác dựa trên dữ liệu của mình mà không cần thư viện hoặc bạn có thể mang các thư viện khác nhau để trợ giúp với các phần khác nhau. Một số thư viện sẽ làm rất nhiều, một số sẽ chỉ làm một phần:
Một trong những phần khó nhất của phát triển web là quyết định sử dụng thư viện nào, bởi vì bạn sẽ thường xuyên viết mã được xây dựng trên đầu các thư viện và thật khó để thay đổi quyết định của bạn sau này. Không có câu trả lời đúng - biết lựa chọn của bạn, sau đó đưa ra phỏng đoán có giáo dục.
Khung web
Có một số thư viện "làm tất cả" - mọi thứ từ truy xuất dữ liệu đến thao tác DOM đến các widget UI ưa thích. Nếu bạn sử dụng một trong các khung này, thông thường bạn sẽ mang rất nhiều JavaScript vào trang của mình, vì vậy bạn sẽ muốn đảm bảo rằng bạn thực sự cần hầu hết những gì khung cung cấp cho bạn. Đối với một số nhà phát triển, các khung công tác này làm quá nhiều và họ thấy tốt hơn khi sử dụng các thư viện nhỏ hơn với các nhiệm vụ tập trung hơn.
Khung CSS
Thư viện CSS là một tập hợp các quy tắc kiểu CSS và tài liệu cho bạn biết các thẻ và lớp HTML nào sẽ sử dụng. Có nhiều thư viện CSS phổ biến sẽ giúp bạn dễ dàng tạo một trang web có kiểu dáng đẹp. Chúng đôi khi bao gồm các tiện ích JavaScript tùy chọn, nhưng các nhà phát triển thường chọn sử dụng các thư viện JS khác với thư viện CSS.
- Twitter Bootstrap (Xem ví dụ về KA )
- Quỹ ZURB (Xem ví dụ về KA )
- CSS thuần
- Áo khoác
- Bộ xương
Thư viện trình duyệt JS
Đây là những thư viện sẽ giúp bạn dễ dàng sử dụng chức năng trình duyệt hơn - như API DOM, các phương thức cửa sổ - các chủ đề chúng ta đã thảo luận trong khóa học này. Họ thường làm cho nó có thể thực hiện điều tương tự với ít mã hơn và họ sẽ xử lý các lỗi trình duyệt chéo.
Thư viện kiến trúc ứng dụng JS
Các thư viện này giúp bạn với các ứng dụng web của bạn khi chúng phát triển lớn hơn. Mã của bạn bây giờ có thể quản lý được, với vài trăm dòng mã, nhưng một khi bạn nhận được hàng ngàn dòng mã, mã của bạn có thể trở thành "mã spaghetti" - một mớ hỗn độn không thể quản lý được. Các thư viện này giúp bạn tách "mô hình" (dữ liệu) của bạn khỏi "chế độ xem" (bản trình bày) và thường sử dụng các nguyên tắc lập trình hướng đối tượng để tổ chức mã của bạn.
- Phản ứng Facebook + Thông lượng Facebook
- Xương sống
- AngularJS
- EmberJS
Thư viện nhỏ & thư viện vi mô
Bạn cũng có thể sử dụng các thư viện nhỏ mà các nhà phát triển đã viết cho một nhiệm vụ cụ thể - khi chúng thực sự nhỏ, đôi khi chúng được gọi là "thư viện vi mô". Đây là một smattering:
- JUDGMENT : tinyDOM
- Sự kiện: Events.js
- AJAX: MicroAjax
- Hoạt hình: Morpheus , Viper
- Mô hình hóa dữ liệu: Cột sống , Knockout
- Mẫu: Tay lái , Râu
- Định tuyến: PathJS
- Định hướng đối tượng: Đẳng cấp , Klass
- Đồ họa: Processing.js (Xem ví dụ về KA ), RaphaelJS (Xem ví dụ về KA ), D3 , Three.js (Xem ví dụ về KA ), Paper.js
- Biểu đồ: gRaphael , Biểu đồ cao
- Ngày / giờ: khoảnh khắc
Bạn có thể tìm thấy nhiều hơn tại microjs.com hoặc chỉ bằng cách tìm kiếm trên internet cho "thư viện javascript [chức năng]" cho bất kỳ chức năng nào bạn đang tìm kiếm.
Bạn đã thử thư viện JS trong các trang web của mình ở đây trên Khan Academy chưa? Chia sẻ nó trong các ý kiến dưới đây.
Nhận xét
Đăng nhận xét