Nhân bản Chat GPT với Cursor trong 1 giờ (lớp học một ngày)
dodocoding
Bạn có thể có khả năng triển khai một chương trình chat bằng Next.js + Cursor IDE chỉ trong một giờ.
Nhập môn
nextjs, ChatGPT, React
Sao chép trang web YoutubeMusic với React, Next.JS 14, TailwindCss, RadixUI, Shadcn, zustand. Bạn có thể nắm vững kiến thức cơ bản về mặt tiền web, bắt đầu với kiến thức cơ bản về NextJS và tập trung vào giao diện người dùng.!
456 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
김형진
Thực hành triển khai các component responsive bằng Next.js, TailwindCSS và Shadcn đã giúp ích rất nhiều cho tôi.
5.0
코틀린자바
Trong Next.js có rất nhiều nội dung liên quan đến hiệu năng như xử lý cache hay tối ưu hóa,... nên cá nhân tôi thấy cần học thêm về UI, nhưng lại không hứng thú với các bài giảng HTML, CSS. Đúng lúc có khóa học này nên tôi đã tham gia và thấy trình độ của giảng viên quá đỉnh...ㄷㄷ Nhưng không ngờ là trong lúc gõ theo, tôi cảm thấy kỹ năng của mình đã được cải thiện, có lẽ là do nó đã ngấm vào người. Rất tốt để học Shadcn Tailwind. Mong chờ phần 2 sớm ra mắt.
5.0
Moon
Tôi nghĩ đó là khóa học tiếp theo tốt nhất~ Tôi rất thích bài giảng hay ~
Bộ định tuyến ứng dụng Next.js
(Lý thuyết) Phản ứng hồi hộp (Truyền phát, Hydrat hóa dần dần)
(Lý thuyết) Phương thức kết xuất Next.js và CSR, SSR, Hydration
Next.js RSC, RCC, sử dụng ứng dụng khách
TailwindCSS, RadixUI, Shadcn
Mã hóa trình phát nhạc YT
Quản lý trạng thái Zustand
Khái niệm cơ bản về gõ Typescript
Cách phát triển giao diện người dùng đáp ứng
Công nghệ NextJS đang được các nhà phát triển FE săn đón hiện nay!
Chúng tôi chỉ bao gồm những phần bạn cần để thực hành NextJS 🍭
Sau khi học React, sẽ rất khó để tiếp tục một dự án sử dụng NextJS nếu chỉ xem tài liệu chính thức.
Vì vậy, thông qua mã hóa YoutubeMusic Clone, nó nhanh chóng và dễ dàng,
Chỉ trong một ngày! Chúng tôi đã tạo ra một khóa học giúp bạn thành thạo NextJS.
Khóa học này có thể đóng vai trò là nền tảng cho dự án NextJS của riêng bạn.
📌 Hướng dẫn ghi chú bài giảng : Mục tiêu từng chương, điểm ôn tập và nhiều thông tin khác (tài liệu chính thức, khái niệm, v.v.)
📌 Cung cấp các điểm kiểm tra bài giảng : Đừng lo lắng nếu bạn không tuân thủ quy tắc! Có các nhánh cụ thể theo từng chương.
📌 10% lý thuyết, 90% thực hành : Chúng tôi giải thích những khái niệm khó nhất về kết xuất, thành phần máy chủ và hydrat hóa.
📌 Danh mục đầu tư : Bạn có thể nhận được kết quả thông qua mã hóa bản sao.

Từ React đến Next
Tôi muốn mở rộng!
Tôi biết cách sử dụng React, nhưng
Nếu bạn bị kẹt ở Next,
Khóa học này thật hoàn hảo!

Dự án Next.js
Tôi muốn làm điều đó!
Dựa trên Next.js
Nếu bạn cần thực hiện một dự án ngay lập tức,
Đây sẽ là một hướng dẫn hữu ích.

Dễ dàng với mã hóa bản sao
Chúc bạn học vui vẻ!
Dựa trên cơ sở mã phù hợp
Mở rộng dự án của bạn theo cách của riêng bạn!
Bạn có thể sao chép bất kỳ trang web nào bạn thấy bằng Next.js. 😲
Bạn có thể tiếp tục dự án của mình thông qua Next.js AppRouter.
Bạn có thể quản lý trạng thái toàn cầu bằng Zustand.
Bạn sẽ tìm hiểu về nhiều phương pháp kết xuất khác nhau, bao gồm PageRouter, React CSR, SSR và Hydration.
Vercel cho phép tôi giới thiệu các dự án tôi đã tạo ra với người khác.
Sự kết hợp TailwindCSS + Radix UI + Shadcn cho phép bạn phát triển UI nhanh hơn bất kỳ ai khác.

Next.js 14 AppRouter & ServerComponent
Bạn sẽ học cách cấu trúc toàn bộ dự án của mình với AppRoute. Bạn cũng sẽ tìm hiểu lý thuyết về thời điểm và lý do nên sử dụng các thành phần máy chủ. Thông qua sự phát triển của FE rendering, bạn sẽ tìm hiểu về lịch sử của Vanilla JS > React > NextJS PageRouter > AppRoute.

Thiết kế đáp ứng + Web tương tác
Chúng tôi đang giới thiệu một chiến lược hỗ trợ màn hình di động và máy tính bảng. Chúng tôi đã tinh chỉnh giao diện người dùng với kiểu dáng và chi tiết, bao gồm các ngăn kéo chỉ hiển thị trên màn hình di động. Có lẽ bạn có thể gói nó trong một webview và xây dựng một ứng dụng từ đầu?

Trình phát nhạc với Zustand
Tìm hiểu Player bằng công cụ quản lý trạng thái toàn cục Zustand. Công cụ này bao gồm các kỹ năng UI chi tiết để nâng cao trải nghiệm người dùng. Bạn sẽ tích hợp các sự kiện với Zustand để phát nhạc trên bất kỳ trang nào.

Thành phần UI & Typescript
Sắp xếp các giao diện người dùng khác nhau thành các thành phần. Và, nếu cần, hãy học cách áp dụng TypeScript để ngăn ngừa lỗi trong dự án của bạn.
Tôi sử dụng Node.js, VS Code và Github.
Kiến thức cơ bản về HTML, CSS và React
Tạo kiểu với TailwindCSS (+ hướng dẫn tóm tắt 😀 )
(*Lúc đầu, tôi ghét TailwindCSS. Nhưng sau quá trình học ban đầu (khoảng một giờ), nó đã cải thiện đáng kể trải nghiệm phát triển của tôi và đẩy nhanh thời gian phát triển! Bạn sẽ không hối hận đâu.)
Khóa học này dành cho ai?
Bất cứ ai muốn bắt đầu một dự án với Next.js
Bất kỳ ai muốn thành thạo việc xuất bản dựa trên Next.js
Những người muốn phát triển nhanh chóng thông qua các thư viện thành phần
Nhà phát triển FE đang tìm cách tăng cường công nghệ Next.js
Cần biết trước khi bắt đầu?
HTML, CSS, React cấp độ cơ bản
4,309
Học viên
192
Đánh giá
94
Trả lời
4.8
Xếp hạng
5
Các khóa học
Tôi đang làm việc tại một trong những công ty dịch vụ IT hàng đầu (Naver, Kakao, Line, Coupang, Baemin) với tư cách là nhà phát triển Frontend. 😀
🚀 Cố vấn tuyển dụng chuyên gia SW Maestro
🚀 Kinh nghiệm làm Mentor mảng BE tại Naver Boostcamp
🚀 Sản xuất bài giảng lộ trình FE 7Code
Tất cả
80 bài giảng ∙ (7giờ 6phút)
Tất cả
39 đánh giá
4.5
39 đánh giá
Đánh giá 3
∙
Đánh giá trung bình 5.0
5
Tôi là một sinh viên đang đi làm đã đăng ký khóa học vì tôi cảm thấy mình cần tập trung vào front-end hoặc back-end và phát triển chuyên môn của mình. Khi làm dự án ở công ty, tôi không hề phải tiếp xúc với React nên thậm chí tôi còn không biết liệu mình có phù hợp với vị trí lễ tân hay không. Các bài giảng rất dễ hiểu và ngắn nên tôi đã dành thời gian và hoàn thành nó trong vòng một tháng! Tôi thực sự thích bài giảng và thật thú vị khi thay đổi những phần mà người hướng dẫn đã làm cho phù hợp với sở thích của tôi. Trong tương lai, dựa trên trang web nhân bản đã hoàn thành, tôi dự định sẽ bổ sung thêm nhiều nội dung cho nó và tạo một danh mục đầu tư để chuẩn bị từng bước chuyển đổi sang giao diện người dùng. Cảm ơn bạn ~~~
Cảm ơn bạn đã đánh giá khóa học 100%. ~ Bài giảng có thể hơi khó hiểu. Cảm ơn bạn rất nhiều vì đã lắng nghe đến cuối. Nếu bạn luyện tập đủ qua bài giảng này, tôi nghĩ bạn sẽ có thể tạo giao diện người dùng nhanh hơn bất kỳ ai khác trong tương lai.~
Đánh giá 23
∙
Đánh giá trung bình 5.0
5
Trong Next.js có rất nhiều nội dung liên quan đến hiệu năng như xử lý cache hay tối ưu hóa,... nên cá nhân tôi thấy cần học thêm về UI, nhưng lại không hứng thú với các bài giảng HTML, CSS. Đúng lúc có khóa học này nên tôi đã tham gia và thấy trình độ của giảng viên quá đỉnh...ㄷㄷ Nhưng không ngờ là trong lúc gõ theo, tôi cảm thấy kỹ năng của mình đã được cải thiện, có lẽ là do nó đã ngấm vào người. Rất tốt để học Shadcn Tailwind. Mong chờ phần 2 sớm ra mắt.
Đánh giá 5
∙
Đánh giá trung bình 5.0
5
Nội dung rất tốt. Tuy nhiên nhịp độ khá nhanh nên bạn cần có chút kiến thức về next để hiểu được.
Cảm ơn bạn đã đánh giá của bạn! Nếu bạn có thắc mắc hoặc câu hỏi nào liên quan đến next.js, hãy đặt thật nhiều câu hỏi nhé! Có thể có một số phần nội dung bài giảng còn thiếu nên mình sẽ chú ý trả lời.~
Đánh giá 13
∙
Đánh giá trung bình 5.0
5
Tôi nghĩ đó là khóa học tiếp theo tốt nhất~ Tôi rất thích bài giảng hay ~
100% cảm ơn bạn đã tham gia lớp học! Chúng ta sẽ gặp lại bạn sau với một bài giảng nâng cao hơn. ~~
Đánh giá 22
∙
Đánh giá trung bình 5.0
5
Thực hành triển khai các component responsive bằng Next.js, TailwindCSS và Shadcn đã giúp ích rất nhiều cho tôi.
Cảm ơn bạn đã theo dõi khóa học. Tôi sẽ quay lại với những bài giảng tốt hơn. !!
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!
Ưu đãi có thời hạn, kết thúc sau 1 ngày ngày
32.340 ₫
30%
983.181 ₫