Đây là khóa học bao gồm các kiến thức cơ bản về Next.js. Chúng ta sẽ phát triển một dịch vụ bản đồ từ đầu đến cuối bằng Next.js.
906 học viên
Độ khó Cơ bản
Thời gian Không giới hạn
Đánh giá từ những học viên đầu tiên
5.0
김효신
Mặc dù thời gian giảng có vẻ ngắn khoảng 4 giờ nhưng thực tế lại mất nhiều thời gian hơn để học vì không bao gồm thời gian gõ mã (được hiển thị tua nhanh hoặc giải thích trong khi hiển thị mã đã được tạo). Nhưng tôi thực sự thích nó theo cách đó! Haha, bài này học một mình thì tốt vì nó tiết kiệm thời gian cho những phần không cần thiết và chỉ dạy những điểm mấu chốt. Cảm ơn bạn đã tạo ra một khóa học tuyệt vời.
5.0
박제영
Ấn tượng chỉ một dòng: Tôi đã thanh toán mà không kỳ vọng nhiều và cảm thấy khóa học này rất tốt. Dịp thanh toán: Tôi đã trả tiền cho một khóa học khác nhưng do bận công việc nên tôi không có thời gian. Khóa học mới này được dạy trên môi trường trình duyệt hiện đại nên đến lúc tôi cần nên tôi tìm một khóa học ngắn hạn để theo dõi. khóa học trả phí hiện có nhưng nó quá dài và nhàm chán nên tôi xem mục lục và trả phí. Điều gì là tốt 1. Tôi có thể nghiên cứu chuyên sâu bằng cách mở trình duyệt và gỡ lỗi, vì nó dạy tôi các nguyên tắc (tôi có thể nghiên cứu chuyên sâu chứ không chỉ thực hiện nó) 2. Tập trung vào next.js mà không cần giải thích không cần thiết (scss, css.module, React, nền bộ đệm, v.v.) 3. Phương pháp giảng dạy tốt. Trong khi kiểm tra một nhánh, chỉ các nhận xét bị xóa và các so sánh khác nhau được hiển thị, trực tiếp chỉ ra sự khác biệt và cách sử dụng chúng một cách hiệu quả (sự khác biệt và cách sử dụng chúng đã được giải thích mà không có chi tiết không cần thiết). 4. Giá là một điểm cộng Tôi nghĩ mức giá này là rất tốt cho chất lượng này. 5. Câu trả lời cho các câu hỏi rất chi tiết. Bạn mất nhiều thời gian để trả lời? Nó có cảm giác như 6. Sử dụng gió đuôi Rất bất tiện khi ghi nhớ các kiểu để tạo kiểu và tạo kiểu cho thẻ html, vì vậy đó là một điều tốt. 7. Chi phí phải xem trực tiếp các tài liệu chính thức sẽ giảm đi khi xem chúng cùng một lúc. 8. Mình bực mình vì chưa biết nhiều về nội dung liên quan đến seo nhưng lại học được dễ hơn mình tưởng và tóm tắt rất hay. 9. Tôi đã học được lý do tại sao tôi cần viết mã HTML khi xét đến khả năng truy cập web. Những gì cá nhân tôi muốn thấy được thêm vào 1. Không dễ để thiết lập gỡ lỗi khi sử dụng next.js làm monorepo trong vscode, vì vậy sẽ thật tuyệt nếu bạn cũng có thể cho tôi biết về điều này. (Cài đặt gỡ lỗi đề cập đến các điểm dừng. Cài đặt gỡ lỗi Monorepo không được liệt kê trong tài liệu chính thức của next.js.)
5.0
JC
Giải thích về phương pháp kết xuất khi xem xét các tệp thực tế do Next.js tạo ra rất hữu ích trong việc hiểu hoạt động của Next.js. Ngoài ra, quá trình tạo trang bản đồ cũng được hiển thị chi tiết nên tôi có thể nhận được nhiều thông tin về các thư viện khác nhau được sử dụng trong quá trình này và các mẹo phát triển nhỏ. Nếu bạn biết những điều cơ bản về React ở một mức độ nào đó, tôi nghĩ việc tham gia khóa học này sẽ giúp ích rất nhiều để bạn có thể tự mình tạo một trang web thực tế!
Next.js cấu trúc cơ bản và API đa dạng
Tạo web bản đồ với Next.js
Triển khai dự án Next.js, Đăng ký công cụ tìm kiếm, Các loại tối ưu hóa
Next.js dành cho các nhà phát triển FE hàng đầu!
Tạo dịch vụ bản đồ cửa hàng dễ dàng và thú vị.
✅
Nếu bạn muốn xem mã của một dịch vụ web được tạo bằng Next.js,
✅
Nếu bạn muốn biết quy trình hoàn thiện một dịch vụ web từ đầu đến cuối bằng công nghệ front-end mà không cần mã back-end,
✅
Nếu bạn tò mò về các phương pháp tối ưu hóa khác nhau như SSR/SSG/CSR,
Khóa học này dành cho các nhà phát triển front-end ở cấp độ mới bắt đầu/mới tìm hiểu về Next.js.
Bạn có thể tìm hiểu tất cả các hàm và API cần thiết của Next.js bằng cách dễ dàng phát triển dịch vụ bản đồ sử dụng nhiều API khác nhau được Next.js hỗ trợ mà không cần bất kỳ mã phụ trợ nào.
Next.js là một framework React mang đến trải nghiệm lập trình viên vượt trội, API đơn giản và trực quan, cùng nhiều tính năng tối ưu hóa. Nó hỗ trợ các phương thức SSR/SSG/CSR, đồng thời hỗ trợ các tính năng tối ưu hóa được thiết kế để thuận tiện cho nhà phát triển.
Sau khi làm việc với Next.js trong nhiều dự án, tôi nhận thấy những điểm mạnh của nó. Tôi muốn giới thiệu Next.js, dự kiến sẽ có tốc độ tăng trưởng nhanh hơn nữa trên thị trường front-end.
Từ A đến Z với dịch vụ bản đồ
Bằng cách xây dựng một dịch vụ bản đồ, bạn sẽ học được tất cả các chức năng và API thiết yếu của Next.js cần thiết cho việc phát triển. Bằng cách tìm hiểu các API như next/link và next/image, có trong cả Next.js 12 và Next.js 13, bạn sẽ hiểu được những ưu điểm của v13.
Cải thiện kỹ năng phát triển front-end của bạn
Khi theo dõi các bài giảng, bạn sẽ học được những khái niệm cơ bản mà một nhà phát triển front-end cần biết, chẳng hạn như phát triển UI (HTML/CSS), hiệu suất và khả năng truy cập web, triển khai và đăng ký công cụ tìm kiếm.
Bài giảng hướng đến người học
Chúng tôi cung cấp mã nguồn cho mỗi lớp học, được sắp xếp thành các nhánh riêng biệt, để hỗ trợ quá trình học. Chúng tôi cũng cung cấp phụ đề cho tất cả các video bài giảng để đảm bảo bạn có thể theo dõi nội dung.
Bài giảng sẽ được cập nhật
Chúng tôi sẽ bổ sung thêm thông tin khi cần thiết. Chúng tôi cũng sẽ cập nhật khóa học với các tin tức liên quan đến Next.js 13.
👉 Xem trước dự án bản đồ được tạo trong bài giảng (liên kết)
Phần 0: Thiết lập môi trường phát triển
Phần 1: Hiểu về việc lấy dữ liệu
Phần 2: Tạo giao diện người dùng tiêu đề
Phần 3: Tạo giao diện người dùng bản đồ
Phần 4: Tạo trang chi tiết cửa hàng
Phần 5: Kiểm tra hiệu suất web với Lighthouse
Phần 6: Triển khai với Vercel
Phần 7: Tổng kết dự án
Phần 8~: Câu hỏi và câu trả lời và củng cố
Chúng tôi sẽ chia sẻ những mẹo chúng tôi đã học được khi phát triển dịch vụ và sản phẩm với Next.js.
Với tư cách là trưởng nhóm front-end tại một công ty khởi nghiệp trong bốn năm, tôi đã phát triển sản phẩm chính và website bằng Next.js. Tôi cũng đã phát triển một dịch vụ trò chơi web bằng Next.js, giành giải ba tại cuộc thi JUNCTION ASIA 2022, và một dịch vụ web sử dụng Next.js T3 Stack đã giành giải nhì tại cuộc thi HACKATHON KAIST SPARCS. Tôi muốn chia sẻ những lợi ích và bí quyết mà tôi đã tích lũy được khi làm việc với Next.js với nhiều người hơn nữa. 🙂
H. Tại sao tôi nên học Next.js?
Trong số các framework phát triển front-end hiện có, tôi tin rằng Next.js mang đến trải nghiệm phát triển vượt trội, API trực quan và hỗ trợ nhiều tối ưu hóa. Trong khi các framework trước đây đòi hỏi phải cân nhắc ưu và nhược điểm của nhiều công nghệ, Next.js theo đuổi con đường chỉ tập trung khai thác điểm mạnh của từng công nghệ và trình bày chúng thông qua API. Hơn nữa, các bản cập nhật liên tục sẽ đảm bảo Next.js được ứng dụng rộng rãi trong các ứng dụng ngày càng phát triển.
H. Khóa học này khó như thế nào?
Khóa học này được thiết kế để giới thiệu cho bạn về Next.js, và bạn sẽ theo dõi mã nguồn, video và phụ đề để hoàn thành dự án một cách tự nhiên. Mỗi khóa học đều có các nhánh riêng biệt, cho phép bạn bỏ qua hoặc quay lại các phần dựa trên trình độ của mình. Bạn cần có kiến thức cơ bản về React (cú pháp JSX, useState/useEffect hook, v.v.).
Nếu bạn mới làm quen với Next.js, chúng tôi khuyên bạn nên bắt đầu bằng các bước sau:
H. Ngoài Next.js, bạn còn sử dụng những thư viện nào khác trong lớp học?
Chúng tôi sử dụng TypeScript, ESlint/Prettier, SWR, next-seo, next-sitemap, Sass (scss), react-icons, copy-to-clipboard, @types/navermaps và firebase (Cloud Firestore). Ngoại trừ các thư viện cốt lõi (TypeScript và scss), chúng tôi chỉ sử dụng những thư viện tối thiểu cần thiết để triển khai dịch vụ. Chúng tôi không sử dụng bất kỳ thư viện UI hoặc CSS-in-JS bổ sung nào.
💾 Những điều cần lưu ý trước khi tham gia lớp học
Khóa học này dành cho ai?
Next.js를 học thử muốn những bạn
Người muốn xem tổng thể quá trình phát triển web service.
Những người muốn thử làm dịch vụ bản đồ
Cần biết trước khi bắt đầu?
React(cú pháp jsx, cách sử dụng useState/useEffect)
cách dùng git
Cách sử dụng yarn (hoặc npm)
Cú pháp TypeScript
1,042
Học viên
50
Đánh giá
87
Trả lời
4.5
Xếp hạng
2
Các khóa học
Xin chào.
Tôi đã làm việc với tư cách là nhà phát triển Front-end trong 4 năm tại một startup.
Tôi sử dụng React, Next.js, bản đồ, biểu đồ, thư viện UI, v.v.
Tất cả
45 bài giảng ∙ (4giờ 7phút)
Tài liệu khóa học:
Tất cả
46 đánh giá
4.5
46 đánh giá
Đánh giá 24
∙
Đánh giá trung bình 4.8
5
Ấn tượng chỉ một dòng: Tôi đã thanh toán mà không kỳ vọng nhiều và cảm thấy khóa học này rất tốt. Dịp thanh toán: Tôi đã trả tiền cho một khóa học khác nhưng do bận công việc nên tôi không có thời gian. Khóa học mới này được dạy trên môi trường trình duyệt hiện đại nên đến lúc tôi cần nên tôi tìm một khóa học ngắn hạn để theo dõi. khóa học trả phí hiện có nhưng nó quá dài và nhàm chán nên tôi xem mục lục và trả phí. Điều gì là tốt 1. Tôi có thể nghiên cứu chuyên sâu bằng cách mở trình duyệt và gỡ lỗi, vì nó dạy tôi các nguyên tắc (tôi có thể nghiên cứu chuyên sâu chứ không chỉ thực hiện nó) 2. Tập trung vào next.js mà không cần giải thích không cần thiết (scss, css.module, React, nền bộ đệm, v.v.) 3. Phương pháp giảng dạy tốt. Trong khi kiểm tra một nhánh, chỉ các nhận xét bị xóa và các so sánh khác nhau được hiển thị, trực tiếp chỉ ra sự khác biệt và cách sử dụng chúng một cách hiệu quả (sự khác biệt và cách sử dụng chúng đã được giải thích mà không có chi tiết không cần thiết). 4. Giá là một điểm cộng Tôi nghĩ mức giá này là rất tốt cho chất lượng này. 5. Câu trả lời cho các câu hỏi rất chi tiết. Bạn mất nhiều thời gian để trả lời? Nó có cảm giác như 6. Sử dụng gió đuôi Rất bất tiện khi ghi nhớ các kiểu để tạo kiểu và tạo kiểu cho thẻ html, vì vậy đó là một điều tốt. 7. Chi phí phải xem trực tiếp các tài liệu chính thức sẽ giảm đi khi xem chúng cùng một lúc. 8. Mình bực mình vì chưa biết nhiều về nội dung liên quan đến seo nhưng lại học được dễ hơn mình tưởng và tóm tắt rất hay. 9. Tôi đã học được lý do tại sao tôi cần viết mã HTML khi xét đến khả năng truy cập web. Những gì cá nhân tôi muốn thấy được thêm vào 1. Không dễ để thiết lập gỡ lỗi khi sử dụng next.js làm monorepo trong vscode, vì vậy sẽ thật tuyệt nếu bạn cũng có thể cho tôi biết về điều này. (Cài đặt gỡ lỗi đề cập đến các điểm dừng. Cài đặt gỡ lỗi Monorepo không được liệt kê trong tài liệu chính thức của next.js.)
Đánh giá 1
∙
Đánh giá trung bình 5.0
5
Đây thực sự là một bài giảng tuyệt vời. Dựa trên tài liệu, các tính năng của Next được giải thích chi tiết từ dưới lên. Nhờ đó, tôi có thể hiểu rõ ràng những khái niệm mơ hồ chỉ sau khi đọc lướt qua tài liệu tiếng Anh. Trong tương lai, tôi nghĩ chúng ta sẽ có thể phát triển SSR bằng cách tận dụng các tính năng và lợi thế của nó. Còn tốt hơn nữa vì Hankyu đã dạy tôi mọi thứ từ phát triển đến phân phối, cách đăng ký trên công cụ tìm kiếm, SEO và tối ưu hóa. Tôi mong chờ khái niệm bố cục của Next@13 như một bài giảng bổ sung!!
Đánh giá 1
∙
Đánh giá trung bình 5.0
Đánh giá 1
∙
Đánh giá trung bình 5.0
Đánh giá 6
∙
Đánh giá trung bình 5.0
911.091 ₫
Hãy khám phá các khóa học khác của giảng viên!
Khám phá các khóa học khác trong cùng lĩnh vực!
![[Hoàn thành Full-stack] nhân bản 3 website với Supabase (Next.js 14)Course Thumbnail](https://cdn.inflearn.com/public/courses/332907/cover/2975d3d7-5dcc-4e2a-977c-98b11134cfb6/332907.jpg?f=avif&w=420)
