Bài giảng này là một video bài giảng về cách tạo dự án SLOG trong nửa sau của cuốn sách tôi viết có tên ‘Web Frontend Bắt đầu với Svelt’. Tôi chuẩn bị bài giảng này để bù đắp cho một số thiếu sót trong cuốn sách và mong rằng sẽ có nhiều người quan tâm đến front-end framework mang tên Svelte.
Triển khai phân trang bằng cách sử dụng cuộn vô hạn
Phương thức xác thực bằng mã thông báo JWT
Xác thực mẫu
Svelte, xu hướng FE đang lên Nhanh chóng có được những kiến thức cần thiết cho các nhà phát triển trung cấp!
Những điều cần thiết để xây dựng với Svelte
Giờ đây, khi bạn đã nắm vững những kiến thức cơ bản về Svelte, bước tiếp theo là thực hiện một dự án thực tế. Hãy tích lũy kinh nghiệm cơ bản khi làm việc trên một dự án thực tế với khóa học dự án REST-API Svelte này!
Khóa học này sẽ hướng dẫn bạn cách tạo, đọc, cập nhật và xóa dữ liệu trên máy chủ bằng Svelte. Bạn cũng sẽ được học các yếu tố thiết yếu để phát triển các dự án front-end, chẳng hạn như xác thực bằng mã thông báo JWT và phân trang bằng cuộn vô hạn.
Trang tạo bài đăng
Trang bình luận
Trang đăng nhập
Học những điều này ✒️
Bài giảng trực tiếp từ tác giả cuốn sách Svelte!
Bài giảng này là phiên bản video của chương cuối cùng trong cuốn sách 'Web Frontend Starting with Svelte'. (Điều kiện tiên quyết: Kiến thức cơ bản về HTML/CSS và JavaScript, kiến thức cơ bản về Svelte)
Có lẽ nhiệm vụ phổ biến nhất trong phát triển front-end là tạo ra một dịch vụ giao tiếp với REST API. Việc yêu cầu dữ liệu từ máy chủ, hiển thị dữ liệu trên màn hình và yêu cầu thêm, sửa đổi và xóa dữ liệu (CRUD) là những yếu tố thiết yếu đối với bất kỳ lập trình viên front-end nào .
Bài giảng này trình bày cách sử dụng thiết yếu của các API REST này từ góc nhìn giao diện người dùng.
✅ Hướng dẫn sử dụng Svelte trung cấp
✅ Giao tiếp bằng Rest API
✅ Giao tiếp máy chủ hiệu quả bằng Axios
✅ Triển khai phân trang bằng Infinite Scroll
✅ Xác thực bằng mã thông báo JWT
✅ Xác thực biểu mẫu, Sử dụng bộ định tuyến
Giao tiếp dữ liệu REST API, nhiều giải pháp khác nhau... Những điều cần biết đối với các nhà phát triển FE trung cấp!
Ngoài việc sử dụng REST API một cách thiết yếu, chúng tôi còn đề cập đến cách cải thiện hiệu quả giao tiếp bằng cách thực hiện các sửa đổi một phần thay vì tải lại toàn bộ dữ liệu khi có thay đổi trong danh sách bằng cách sử dụng Store của Svelte, cũng như các vấn đề có thể phát sinh khi triển khai giao diện người dùng cuộn vô hạn được sử dụng rộng rãi và cách giải quyết chúng.
Ngoài ra, chúng tôi đã chuẩn bị một khóa học được thiết kế để giúp bạn nắm vững những kiến thức cơ bản về phát triển front-end, một điều bạn sẽ cần cân nhắc khi chuyển từ trình độ sơ cấp sang trung cấp, thông qua các phương pháp xác thực sử dụng JWT, xác thực biểu mẫu để nâng cao tính hoàn thiện của ứng dụng, chế độ xem ngày tháng trực quan hơn và tạo các thành phần có thể tái sử dụng độc lập. Hãy cùng nhau giải quyết vấn đề này! (Svelte, Axios, Yup, Datejs)
Tôi giới thiệu điều này cho những người này 🙆♀️
Bất kỳ ai quan tâm đến phát triển front-end
Bất kỳ ai muốn tạo ra thứ gì đó nhanh hơn trên web
Bất kỳ ai muốn triển khai điều gì đó bằng cách sử dụng kiến thức cơ bản về HTML và JavaScript
Nhà phát triển front-end mới bắt đầu muốn trở thành nhà phát triển FE trung cấp
Nếu bạn đã hoàn thành khóa học front-end, tôi khuyên bạn nên tham gia khóa học xây dựng máy chủ API cho dịch vụ đó. Chúng tôi đã chuẩn bị một khóa học back-end sử dụng các công nghệ Node.js mới nhất, bao gồm Fastify, Prisma và TypeScript.
H. Tôi có cần biết những kiến thức cơ bản về Svelte không?
Bạn có thể học những kiến thức cơ bản về Svelte trong 1-2 giờ thông qua khóa học miễn phí khác của tôi. Tôi khuyên bạn nên học khóa đó trước, sau đó mới đến khóa này.
H. Môi trường phát triển như thế nào?
Bạn có thể cài đặt và tiếp tục sử dụng các chương trình cần thiết cho môi trường phát triển trên bất kỳ PC nào có thể cài đặt Node.js, bao gồm macOS, Windows và Linux.
H. Dự án này có giống hệt với dự án trong cuốn sách "Web Front: Bắt đầu với Svelte" không?
Mặc dù bản thân dự án vẫn như vậy, tôi đã tạo một video bổ sung cho phần lớn nội dung của cuốn sách. Video bao gồm các chi tiết bổ sung, chẳng hạn như xác thực bằng mã thông báo JWT và tách các phần liên quan đến thao tác cuộn thành một thành phần độc lập duy nhất. Tôi khuyên bạn nên xem video này ngay cả khi bạn đã học sách rồi.
💾 Tài liệu tham khảo lớp học
Danh sách các gói được sử dụng trong bài giảng và địa chỉ git của các trang web tham khảo và mã dự án được cung cấp.