Sử dụng Create React App v2 và TypeScript
Create React App v2 đã giới thiệu hỗ trợ TypeScript chính thức, cho phép user JavaScript sử dụng TypeScript với React front-end framework. TypeScript là một công cụ mạnh mẽ giúp viết mã an toàn hơn, tự tài liệu hóa, cho phép các nhà phát triển bắt lỗi nhanh hơn.
2019-12-12
Create React App v2 đã giới thiệu hỗ trợ TypeScript chính thức, cho phép user JavaScript sử dụng TypeScript với React front-end framework. TypeScript là một công cụ mạnh mẽ giúp viết mã an toàn hơn, tự tài liệu hóa, cho phép các nhà phát triển bắt lỗi nhanh hơn.
2019-12-12
Cách xây dựng hệ thống tài liệu với Vue và VuePress
Tài liệu tốt là một phần quan trọng của một dự án thành công, nhưng một hệ thống tài liệu đầy đủ có thể liên quan nhiều hơn dự án mà bạn yêu cầu. Trong trường hợp này, các trang tĩnh thường hoạt động tốt. Trong bài đăng này, ta sẽ xây dựng một trang web tài liệu tĩnh, đây cũng là một ứng dụng trang đơn bằng cách sử dụng trình tạo trang web tĩnh được cấp nguồn Vue , VuePress .
2019-12-12
Tài liệu tốt là một phần quan trọng của một dự án thành công, nhưng một hệ thống tài liệu đầy đủ có thể liên quan nhiều hơn dự án mà bạn yêu cầu. Trong trường hợp này, các trang tĩnh thường hoạt động tốt. Trong bài đăng này, ta sẽ xây dựng một trang web tài liệu tĩnh, đây cũng là một ứng dụng trang đơn bằng cách sử dụng trình tạo trang web tĩnh được cấp nguồn Vue , VuePress .
2019-12-12
Cách nâng cấp bộ lọc phân loại góc
AngularJS, Một trong những tính năng hữu ích nhất mà AngularJS cung cấp ban đầu là khả năng lọc và sắp xếp dữ liệu trên trang chỉ sử dụng các biến mẫu và bộ lọc. Liên kết dữ liệu hai chiều đã chiến thắng nhiều lần chuyển đổi sang AngularJS.
2019-12-12
AngularJS, Một trong những tính năng hữu ích nhất mà AngularJS cung cấp ban đầu là khả năng lọc và sắp xếp dữ liệu trên trang chỉ sử dụng các biến mẫu và bộ lọc. Liên kết dữ liệu hai chiều đã chiến thắng nhiều lần chuyển đổi sang AngularJS.
2019-12-12
Tạo một sử dụng tùy chỉnhFetch () React Hook
Một móc tùy chỉnh là một hàm JavaScript có quy ước đặt tên duy nhất yêu cầu tên hàm bắt đầu
2019-12-12
Một móc tùy chỉnh là một hàm JavaScript có quy ước đặt tên duy nhất yêu cầu tên hàm bắt đầu
use
và có khả năng gọi các móc khác.2019-12-12
Cách tạo thành phần giao diện người dùng với React và Storybook
Trong bài viết trước, tôi đã giới thiệu về Storybook và cách sử dụng nó để tổ chức và xây dựng các thành phần JavaScript. Storybook là một thư viện giao diện user được dùng để ghi lại các thành phần. Trong bài viết này, tôi sẽ giải thích cách xây dựng một thành phần giao diện user tương tác bằng cách sử dụng React và Storybook. Ta sẽ tạo thành phần giao diện user bằng Storybook và React và ở phần cuối của hướng dẫn, ta sẽ triển khai storybook dưới dạng một ứng dụng độc lập để phục vụ như một hướng dẫn phong cách.
2019-12-12
Trong bài viết trước, tôi đã giới thiệu về Storybook và cách sử dụng nó để tổ chức và xây dựng các thành phần JavaScript. Storybook là một thư viện giao diện user được dùng để ghi lại các thành phần. Trong bài viết này, tôi sẽ giải thích cách xây dựng một thành phần giao diện user tương tác bằng cách sử dụng React và Storybook. Ta sẽ tạo thành phần giao diện user bằng Storybook và React và ở phần cuối của hướng dẫn, ta sẽ triển khai storybook dưới dạng một ứng dụng độc lập để phục vụ như một hướng dẫn phong cách.
2019-12-12
Quản lý trạng thái biểu mẫu trong phản ứng với biểu mẫu Redux
redux-form là một cách tốt để quản lý các biểu mẫu được cung cấp bởi Redux . Nó là một thành phần có thứ tự cao hơn (HOC) sử dụng react-redux đảm bảo các biểu mẫu HTML trong React sử dụng Redux để lưu trữ tất cả trạng thái của nó.
2019-12-12
redux-form là một cách tốt để quản lý các biểu mẫu được cung cấp bởi Redux . Nó là một thành phần có thứ tự cao hơn (HOC) sử dụng react-redux đảm bảo các biểu mẫu HTML trong React sử dụng Redux để lưu trữ tất cả trạng thái của nó.
2019-12-12
Cách tạo biểu mẫu nhiều bước với giao diện người dùng React và ngữ nghĩa
Biểu mẫu là phương pháp tiêu chuẩn được sử dụng để thu thập thông tin đầu vào của user trên các ứng dụng web. Tuy nhiên, đôi khi ta có thể thu thập số lượng lớn có thể dẫn đến một biểu mẫu lớn với một số trường. Đây có thể là một khó khăn không chỉ cho user mà còn cho cả nhà phát triển vì họ sẽ phải điều chỉnh các trường này vào biểu mẫu theo cách trông vẫn hấp dẫn đối với user .
2019-12-12
Biểu mẫu là phương pháp tiêu chuẩn được sử dụng để thu thập thông tin đầu vào của user trên các ứng dụng web. Tuy nhiên, đôi khi ta có thể thu thập số lượng lớn có thể dẫn đến một biểu mẫu lớn với một số trường. Đây có thể là một khó khăn không chỉ cho user mà còn cho cả nhà phát triển vì họ sẽ phải điều chỉnh các trường này vào biểu mẫu theo cách trông vẫn hấp dẫn đối với user .
2019-12-12
Bắt đầu với NestJS
Nếu bạn đã làm việc trên ứng dụng Node.js, bạn có thể nhận thấy rằng nó trở nên khó bảo trì hơn theo thời gian. Bạn càng thêm nhiều tính năng mới vào ứng dụng, thì cơ sở mã càng lớn.
2019-12-12
Nếu bạn đã làm việc trên ứng dụng Node.js, bạn có thể nhận thấy rằng nó trở nên khó bảo trì hơn theo thời gian. Bạn càng thêm nhiều tính năng mới vào ứng dụng, thì cơ sở mã càng lớn.
2019-12-12
Cách thiết lập xác thực Vue.js và xử lý tuyến đường bằng vue-router
Vue.js là một khung JavaScript tiến bộ để xây dựng các ứng dụng front-end. Cùng với vue-router , ta có thể xây dựng các ứng dụng hiệu suất cao với các tuyến động hoàn chỉnh. Vue-router là một công cụ hiệu quả và có thể xử lý hiệu quả xác thực trong ứng dụng Vue của ta .
2019-12-12
Vue.js là một khung JavaScript tiến bộ để xây dựng các ứng dụng front-end. Cùng với vue-router , ta có thể xây dựng các ứng dụng hiệu suất cao với các tuyến động hoàn chỉnh. Vue-router là một công cụ hiệu quả và có thể xử lý hiệu quả xác thực trong ứng dụng Vue của ta .
2019-12-12
Cách sử dụng .every () và .some () để điều khiển mảng JavaScript
ES5 và ES6 đã mang lại nhiều thay đổi cho JavaScript, bao gồm các cách làm việc tốt hơn với tập hợp dữ liệu được biểu thị dưới dạng mảng. Trong khi ngôn ngữ này đã cải thiện đáng kể khả năng hỗ trợ thao tác dữ liệu khai báo trên mảng và nhiều trình duyệt hiện đại hỗ trợ chúng, chỉ một tập hợp con giới hạn các khả năng của mảng thường được sử dụng. Đặc biệt, các hàm
2019-12-12
ES5 và ES6 đã mang lại nhiều thay đổi cho JavaScript, bao gồm các cách làm việc tốt hơn với tập hợp dữ liệu được biểu thị dưới dạng mảng. Trong khi ngôn ngữ này đã cải thiện đáng kể khả năng hỗ trợ thao tác dữ liệu khai báo trên mảng và nhiều trình duyệt hiện đại hỗ trợ chúng, chỉ một tập hợp con giới hạn các khả năng của mảng thường được sử dụng. Đặc biệt, các hàm
.every()
và .some()
có thể cải thiện cách các nhà phát triển thao tác với các mảng và có khả năng mang lại cho họ hiệu suất tăng.2019-12-12
Giải thích về lập trình chức năng JavaScript: Kết hợp & truyền tải
Kết hợp và chuyển đổi có thể là những công cụ thiết thực nhất mà tôi đã chọn được trong thời gian học Lập trình chức năng. Chúng không phải là công cụ tôi sử dụng hàng ngày, cũng không phải là công cụ thực sự cần thiết, nhưng chúng đã thay đổi hoàn toàn cách tôi nghĩ về lập trình, tính module và tính trừu tượng trong kỹ thuật phần mềm, vĩnh viễn và tốt hơn.
2019-12-12
Kết hợp và chuyển đổi có thể là những công cụ thiết thực nhất mà tôi đã chọn được trong thời gian học Lập trình chức năng. Chúng không phải là công cụ tôi sử dụng hàng ngày, cũng không phải là công cụ thực sự cần thiết, nhưng chúng đã thay đổi hoàn toàn cách tôi nghĩ về lập trình, tính module và tính trừu tượng trong kỹ thuật phần mềm, vĩnh viễn và tốt hơn.
2019-12-12
Bắt đầu với các hàm mũi tên ES6 trong JavaScript
Với ES6, đã có nhiều bản cập nhật cho JavaScript, bao gồm toán tử spread, cấu trúc đối tượng, loại biến mới và hơn thế nữa. Một trong những thay đổi đáng chú ý nhất là các hàm mũi tên , một cách mới và ngắn gọn để viết các hàm. Với các hàm mũi tên, bạn có thể xác định một hàm dễ đọc và ngắn gọn trong một dòng. Trong bài viết này, ta sẽ giới thiệu cho các bạn những điều cơ bản về các hàm mũi tên và thảo luận về lợi ích của chúng.
2019-12-12
Với ES6, đã có nhiều bản cập nhật cho JavaScript, bao gồm toán tử spread, cấu trúc đối tượng, loại biến mới và hơn thế nữa. Một trong những thay đổi đáng chú ý nhất là các hàm mũi tên , một cách mới và ngắn gọn để viết các hàm. Với các hàm mũi tên, bạn có thể xác định một hàm dễ đọc và ngắn gọn trong một dòng. Trong bài viết này, ta sẽ giới thiệu cho các bạn những điều cơ bản về các hàm mũi tên và thảo luận về lợi ích của chúng.
2019-12-12
Giới thiệu về Closures và Currying trong JavaScript
Nếu bạn viết mã bằng JavaScript, rất có thể bạn đã gặp phải thuật ngữ
2019-12-12
Nếu bạn viết mã bằng JavaScript, rất có thể bạn đã gặp phải thuật ngữ
closure
, đây là một khái niệm hữu ích nhưng thường gây nhầm lẫn. Nhưng đóng cửa là gì?2019-12-12
Giải thích về lập trình chức năng JavaScript: Ứng dụng một phần và làm xoăn
Với việc áp dụng thư viện Redux JavaScript, chuỗi công cụ và tiện ích mở rộng cú pháp Lý do , và khung JavaScript chu kỳ , lập trình chức năng với JavaScript ngày càng trở nên phù hợp. Hai ý tưởng quan trọng có nguồn root từ suy nghĩ hàm là currying , biến một hàm của nhiều đối số thành một chuỗi các lệnh gọi hàm và ứng dụng từng phần , cố định giá trị của một số đối số của hàm mà không đánh giá đầy đủ hàm. Trong bài viết này, ta sẽ khám phá một số ví dụ về những ý tưởng này đang hoạt động, cũng như xác định một vài địa điểm mà chúng hiển thị có thể khiến bạn ngạc nhiên.
2019-12-12
Với việc áp dụng thư viện Redux JavaScript, chuỗi công cụ và tiện ích mở rộng cú pháp Lý do , và khung JavaScript chu kỳ , lập trình chức năng với JavaScript ngày càng trở nên phù hợp. Hai ý tưởng quan trọng có nguồn root từ suy nghĩ hàm là currying , biến một hàm của nhiều đối số thành một chuỗi các lệnh gọi hàm và ứng dụng từng phần , cố định giá trị của một số đối số của hàm mà không đánh giá đầy đủ hàm. Trong bài viết này, ta sẽ khám phá một số ví dụ về những ý tưởng này đang hoạt động, cũng như xác định một vài địa điểm mà chúng hiển thị có thể khiến bạn ngạc nhiên.
2019-12-12
Cách sử dụng map (), filter () và Reduce () trong JavaScript
Lập trình chức năng trong JavaScript mang lại lợi ích cho khả năng đọc mã, khả năng bảo trì và khả năng kiểm tra.
2019-12-12
Lập trình chức năng trong JavaScript mang lại lợi ích cho khả năng đọc mã, khả năng bảo trì và khả năng kiểm tra.
2019-12-12
Đặt, giãn cách và mật độ trong CSS Grid
Điều phổ biến nhất bạn học được trong CSS Grid thường liên quan đến containers lưới và hơn là các mục lưới. Định nghĩa lưới chung được áp dụng cho containers lưới là đủ cho cấu trúc bố cục cơ bản. Tuy nhiên, khi bạn cần kiểm soát nhiều hơn nội dung của lưới, containers lưới sẽ bị hạn chế sử dụng.
2019-12-12
Điều phổ biến nhất bạn học được trong CSS Grid thường liên quan đến containers lưới và hơn là các mục lưới. Định nghĩa lưới chung được áp dụng cho containers lưới là đủ cho cấu trúc bố cục cơ bản. Tuy nhiên, khi bạn cần kiểm soát nhiều hơn nội dung của lưới, containers lưới sẽ bị hạn chế sử dụng.
2019-12-12
Cách giải quyết tắc nghẽn CSS quy mô lớn với ITCSS và BEM
Trên các dự án cơ sở mã giao diện user , các yêu cầu và đôi khi phạm vi có thể thay đổi thường xuyên. Khi các yêu cầu thay đổi và bạn điều chỉnh biểu định kiểu hoặc mở rộng kiểu của bộ chọn trong một trang cụ thể, những thay đổi đó thường ảnh hưởng đến các dạng xem khác có chung kiểu tương tự.
2019-12-12
Trên các dự án cơ sở mã giao diện user , các yêu cầu và đôi khi phạm vi có thể thay đổi thường xuyên. Khi các yêu cầu thay đổi và bạn điều chỉnh biểu định kiểu hoặc mở rộng kiểu của bộ chọn trong một trang cụ thể, những thay đổi đó thường ảnh hưởng đến các dạng xem khác có chung kiểu tương tự.
2019-12-12
Cách tạo Thư viện ảnh cuộn vô hạn với React và CSS Grid
Trong hướng dẫn này, ta sẽ sử dụng khung công tác React frontend Javascript và CSS Grid để xây dựng một thư viện ảnh cuộn vô hạn, sử dụng API Unsplash để nhúng các hình ảnh chụp. Sử dụng thử thách viết mã codepen từ Scotch.io làm cơ sở cho mã của ta , ta sẽ sử dụng React.js để xây dựng giao diện, Axios để thực hiện các yêu cầu HTTP và thư viện
2019-12-12
Trong hướng dẫn này, ta sẽ sử dụng khung công tác React frontend Javascript và CSS Grid để xây dựng một thư viện ảnh cuộn vô hạn, sử dụng API Unsplash để nhúng các hình ảnh chụp. Sử dụng thử thách viết mã codepen từ Scotch.io làm cơ sở cho mã của ta , ta sẽ sử dụng React.js để xây dựng giao diện, Axios để thực hiện các yêu cầu HTTP và thư viện
react-infinite-scroll
để triển khai tính năng cuộn vô hạn.2019-12-12
Cách tạo hiệu ứng chuyển trang trên trang web GatsbyJS tĩnh
GatsbyJS là một trình tạo trang web tĩnh dựa trên React được hỗ trợ bởi GraphQL. Nó giúp bạn có thể viết mã và phát triển trang web của bạn trong khi Gatsby biến nó thành một folder với một file HTML duy nhất với tất cả các nội dung tĩnh của bạn. Về bản chất, Gatsby nhanh và được cấu hình sẵn với các nhân viên dịch vụ, tách mã, kết xuất phía server , tải hình ảnh thông minh, tối ưu hóa nội dung và tìm nạp trước dữ liệu.
2019-12-12
GatsbyJS là một trình tạo trang web tĩnh dựa trên React được hỗ trợ bởi GraphQL. Nó giúp bạn có thể viết mã và phát triển trang web của bạn trong khi Gatsby biến nó thành một folder với một file HTML duy nhất với tất cả các nội dung tĩnh của bạn. Về bản chất, Gatsby nhanh và được cấu hình sẵn với các nhân viên dịch vụ, tách mã, kết xuất phía server , tải hình ảnh thông minh, tối ưu hóa nội dung và tìm nạp trước dữ liệu.
2019-12-12
Cách sử dụng Plugin Docker cho Visual Studio Code
Trong bài viết này, ta sẽ sử dụng Docker Plugin cho Visual Studio Code. Docker cho phép ta đóng gói các ứng dụng của bạn thành hình ảnh và chạy chúng dưới dạng containers trên bất kỳ nền tảng nào đã cài đặt Docker. Ta sẽ sử dụng plugin này với hai ngăn xếp nhà phát triển: Node.js và Go.
2019-12-12
Trong bài viết này, ta sẽ sử dụng Docker Plugin cho Visual Studio Code. Docker cho phép ta đóng gói các ứng dụng của bạn thành hình ảnh và chạy chúng dưới dạng containers trên bất kỳ nền tảng nào đã cài đặt Docker. Ta sẽ sử dụng plugin này với hai ngăn xếp nhà phát triển: Node.js và Go.
2019-12-12
Cách xây dựng một ứng dụng toàn cầu với Nuxt.js và Django
Sự ra đời của các thư viện JavaScript hiện đại như React.js và Vue.js đã thay đổi việc phát triển web front-end trở nên tốt hơn. Các thư viện này đi kèm với các tính năng bao gồm SPA (Ứng dụng trang đơn), là tính năng tải động nội dung trong các trang web mà không cần reload đầy đủ vào trình duyệt.
2019-12-12
Sự ra đời của các thư viện JavaScript hiện đại như React.js và Vue.js đã thay đổi việc phát triển web front-end trở nên tốt hơn. Các thư viện này đi kèm với các tính năng bao gồm SPA (Ứng dụng trang đơn), là tính năng tải động nội dung trong các trang web mà không cần reload đầy đủ vào trình duyệt.
2019-12-12