강의

멘토링

로드맵

BEST
Programming

/

AI Coding

[VOD] Hoàn thành trong 6 tuần! Lập trình Vibe cô đặc cho thực tế phát triển (Cursor AI, Figma)

Hãy bỏ qua những dịch vụ đơn giản có thể tạo ra bằng vibe coding trong 10 phút! Bạn có thể học vibe coding ứng dụng thực tế 'thật sự'. Hãy tạo ra dịch vụ tinh vi ở mức độ dịch vụ thực tế theo đúng kế hoạch và thiết kế bằng Cursor AI NCOP. No Code, Only Prompt

(5.0) 12 đánh giá

262 học viên

AI 활용법
실습 중심
바이브코딩
커서
AI 코딩
React
Next.js
cursor
prompt engineering
Vibe Coding

Đánh giá từ những học viên đầu tiên

Dịch cái này sang tiếng Việt

  • Cách tạo UI giống hệt 100% thiết kế Figma bằng Vibe Coding

  • Cung cấp prompt có thể áp dụng thực tế

  • Hoàn thành toàn bộ dự án tập trung vào chức năng với 바이브코딩

  • Danh mục đầu tư Vibe Coding

  • Lập trình thực tế tập trung vào thực hành có thể sử dụng trong công ty

banner


Các nhà phát triển!

AI로 코딩하다가
có trải nghiệm lãng phí thời gian vì mày mò không hiệu quả không?


Thực tế: Không diễn ra theo ý muốn của tôi 😭😭


Nhiều lập trình viên thường kể về trải nghiệm lãng phí cả thời gian và tài nguyên
khi sử dụng AI để viết code.


Vì vậy, Code Camp đã chuẩn bị
'Vibe Coding' dành cho các developer để giúp giải quyết nỗi lo này.

.

.

.

[ Lập trình viên thực thụ
Vibe Coding phiên bản thực tế ]


Chúng tôi sẽ hướng dẫn bạn cách thức
sử dụng prompt một cách có hệ thống trong công việc thực tế
mà ngay cả YouTube cũng không tiết lộ.



Độc quyền Inflearn
[ L Ầ N Đ Ầ U T I Ê N C Ô N G K H A I ]


Với AI, giờ đây có thể
triển khai ngay lập tức theo đúng cấu trúc mà nhà phát triển đã thiết kế.


Tôi sau khi nghe bài giảng Code Camp = Trang web có hình dạng như mong muốn xuất hiện!



Cùng với Code Camp, bạn có thể thực hiện chỉ bằng prompt để
tạo ra UI hoặc tính năng mong muốn.


Bạn có tò mò về bí quyết
Vibe Coding dành cho các developer độc quyền của Code Camp không?


Khóa học này là
Vibe Coding dành cho các nhà phát triển.

Tại sao chuối lại là hình ảnh đại diện? Nhắc đến chuối là nghĩ đến vibe coding theo dòng suy nghĩ đó nên đã chọn theo phong cách vibe coding. Tuy nhiên, vibe coding dành cho developer thì không thể làm theo cảm tính được. Phải tiến hành một cách có hệ thống và dựa trên thiết kế.

Khóa học này là vibe coding nghiêm túc dành cho developer. Đây là vibe coding ở mức độ có thể áp dụng vào thực tế công việc.
Đặc biệt, nếu bạn là junior developer thì đây là năng lực thiết yếu nhất định phải biết trong thời đại AI.

Khóa học được tiến hành với độ khó vừa phải, phù hợp cho Project Manager, UIUX designer, người hoạch định dịch vụ có thể sử dụng Figma để học tập. Nếu bạn muốn khởi nghiệp một mình và làm nhiều công việc thì hãy thử thách bản thân nhé!

Sau khóa học, các bạn sẽ...

1. Triển khai 100% bất kỳ thiết kế Figma nào

Bạn có cảm thấy bực bội vì không thể triển khai 100% thiết kế Figma bằng vibe coding không?

Chúng tôi sẽ tiết lộ bí quyết để tạo ra
thiết kế Figma chính xác mà đội của chúng ta hoặc bản thân tôi muốn làm
bằng vibe coding một cách 100% chính xác và nhanh chóng.

Từ kết quả MCP Figma sơ khai chưa hoàn thiện → Tạo ra chính xác (ví dụ trang chủ Yanolja)

2. Triển khai 100% tính năng theo ý định thiết kế của tôi

Không phải là dịch vụ vibecoding đơn giản được tạo ra trong 5 phút,
mà bạn muốn tạo ra một dịch vụ thực sự đúng nghĩa?

Sau khóa học này, bạn có thể áp dụng vibe coding tự động hóa hoàn toàn vào công việc thực tế!

Chúng tôi tạo ra những tính năng thực sự cần thiết trong công việc thực tế, không phải những tính năng nghe có vẻ hay ho!

Lập trình Vibe cho thực tế
phải khác biệt.

Không cần một dòng code nào,
xây dựng dịch vụ thực tế bằng prompt


Với dự án 'Nhật ký cảm xúc', bạn sẽ học hầu hết tất cả các phương pháp của Vibe Coding!

  • Tạo UI giống hệt thiết kế Figma

  • Tạo component chung như trong phát triển thực tế

  • Xác định thứ tự phát triển cho Vibe Coding

  • Triển khai các tính năng đa dạng và kết nối API

  • Xử lý đăng nhập và phân quyền

  • Phương pháp xử lý song song theo phong cách lập trình viên

  • Khôi phục an toàn khi AI mắc lỗi



AI quý như vàng,
Cung cấp prompt giúp AI nghe lời


Tôi sẽ học cách cung cấp và viết prompt để đạt được kết quả 120% theo ý định của mình!

  • Cách thiết lập quy tắc con trỏ

  • Cung cấp prompt có thể tái sử dụng

  • Quy tắc để có được kết quả 100% ổn định

  • Cấu trúc thư mục cho Vibe Coding




Quy trình phát triển để đạt được
kết quả 120% theo ý định của tôi


Phương pháp Vibe Coding do AI tạo ra, thứ tự phát triển để tránh xung đột code là rất quan trọng!

Prompt đều giống nhau
Xử lý song song là ưu điểm của Cursor AI


Phương pháp Vibe Coding do AI tạo ra cần phải biết phạm vi có thể song song để tránh xung đột code!

Cả nhà phát triển và người không phải nhà phát triển đều có thể
học vibe coding có thể áp dụng trong thực tế tùy theo tình huống.

  • Bao gồm các nguyên lý và khái niệm phát triển chuyên biệt cho Vibe Coding, ngay cả những người không phải là lập trình viên cũng có thể học tập đầy đủ.

  • Chúng tôi đề xuất lộ trình để các lập trình viên có thể phát triển tự chủ thông qua Vibe Coding.

Khó sản xuất hơn bất kỳ khóa học nào khác,
nhưng cuối cùng đã hoàn thành chương trình giảng dạy tự tin

Do đặc thù của Vibe Coding, mỗi lần có thể ra kết quả khác nhau nên việc hoàn thiện curriculum rất khó khăn.
Tôi đã tìm ra cách sửa đổi và tái kiểm tra kết quả để mọi người đều có thể có cùng một kết quả!

  • Hãy xem chương trình học rõ ràng theo kịp thực tế công việc.


Chờ một chút, vui lòng tham khảo!

Hiện tại bạn đang xemGiá khóa học rẻ nhất

Khóa học sẽ được cập nhật thường xuyên,
và giá có thể tăng theo đó!

Tất cả các dự án đều có thể
được tạo bằng Vibe Coding!

1. Hãy thử tạo bằng cách chỉ sửa đổi prompt!

  • Nguyên lý của dự án khóa học nhật ký cảm xúc và dịch vụ blog nổi tiếng 'Velog' là giống nhau!

  • Nền tảng du lịch phức tạp hơn 'MyRealTrip' cũng hoạt động theo nguyên lý tương tự!


2. Giao diện người dùng gần như hoàn toàn giống với dịch vụ blog nổi tiếng 'Velog'.

Nhật ký cảm xúc (Dự án thực hành khóa học)

  • Chuyển từ hộp lưu trữ nhật ký → hộp lưu trữ ảnh

  • Thẻ nhật ký

  • Bộ lọc toàn bộ

  • Logic tìm kiếm

  • Logic chuyển trang cho tất cả các trang

  • Logic Modal và Provider kép

Velog (dịch vụ blog nổi tiếng)

  • Trending → Chuyển đến Mới nhất·Feed

  • Thẻ blog

  • Bộ lọc tuần này

  • Logic tìm kiếm

  • Logic chuyển trang cho tất cả các trang

  • Logic modal kép và provider

  • Di chuyển từ Hộp lưu trữ nhật ký → Hộp lưu trữ ảnh : Giống như di chuyển từ Trending → Mới nhất·Feed

  • Thẻ nhật ký : Thẻ blog giống nhau

  • Bộ lọc tổng thể : Chức năng bộ lọc tuần này giống nhau

  • Logic tìm kiếm giống nhau

  • Tất cả logic chuyển trang đều giống nhau

  • Logic modal kép và provider giống nhau

3. Nguyên lý frontend gần như giống hệt với nền tảng du lịch 'MyRealTrip'.



Giờ đây với bất kỳ dịch vụ nào, bạn đều có thể nhanh chóng và dễ dàng triển khai
frontend từ A đến Z với Vibe Coding ứng dụng thực tế.

Có thể luyện tập với
nhiều thiết kế Figma đa dạng được cung cấp.

Chúng tôi cũng đề cập đến cách sử dụng plugin HTML to Design để có được trực tiếp nguồn thiết kế mong muốn!

  • Hãy sửa đổi prompt để thực hành vibe coding với nhiều thiết kế khác nhau.

  • Hãy triển khai một dự án cho khởi nghiệp cá nhân hoặc dịch vụ kiếm tiền.

Velog Figma

MyRealTrip Figma

29cm Figma

Lưu ý trước khi học

Cursor AI cần gói trả phí.

Để đạt được kết quả tốt nhất, tôi đang sử dụng gói trả phí của Cursor AI. Vui lòng lưu ý rằng việc tạo AI dựa trên Claude 4.0 sẽ tiêu tốn token.

Figma có thể sử dụng miễn phí với gói miễn phí.

Khi tạo dự án với Vibe Coding, bạn có thể thực hiện mà không cần Dev Mode - dịch vụ trả phí của Figma! Hãy copy-paste thiết kế được cung cấp vào trang của bạn để sử dụng.

Kiến thức tiên quyết và lưu ý

  • Tốt nhất là bạn nên có kiến thức cơ bản về HTML, CSS, Javascript.

  • Nếu bạn có kiến thức cơ bản về React, việc học Vibe Coding sẽ trở nên dễ dàng hơn!

  • Bạn có thể học cách viết prompt và các khái niệm phát triển cùng lúc.

Khuyến nghị cho những người như thế này

  • Nếu bạn là nhà phát triển muốn tạo frontend nhanh chóng với Vibe Coding

  • Người có thể lập kế hoạch và thiết kế bằng Figma, đặc biệt nếu là UIUX designer & PM

  • Nếu bạn muốn dễ dàng tạo ra 'mức lương thứ hai' hàng tháng sau giờ làm việc

  • Nếu bạn mơ ước về một startup cần kết quả nhanh chóng

Khóa học này sẽ rất phù hợp với bạn.

Có phải bạn là lần đầu tiên đến
Nowon-duga không?

Chúng tôi đã tổng hợp các từ khóa và đánh giá khóa học mà bạn 노원두 đã nhận được trong thời gian qua.
Hãy cùng 노원두 phát triển thành một nhà phát triển ứng dụng thông qua khóa học này🚀

#Kind bài giảng
#Tỉ mỉ
#Đầy năng lượng
#Dễ hiểu
#Lập trình viên thực thụ
#Người thầy của các người thầy


#Hạt cà phê
#Thích thích

Bạn có điều gì
thắc mắc không?

Q. Kiến thức cơ bản cần thiết ở mức độ nào?

Khóa học này được tối ưu hóa cho những người đã có kiến thức cơ bản về React.js hoặc Next.js.
Đây là khóa học cốt lõi giúp bạn học toàn bộ chu trình phát triển thông qua vibe coding dựa trên prompt.
Vì chúng tôi cung cấp working prompt, bạn có thể ứng dụng các prompt này vào dự án cá nhân của mình.
Chúng tôi đã cố gắng đưa vào càng nhiều nội dung càng tốt để các bạn không phải trải qua những thử nghiệm và sai lầm mà chúng tôi đã từng gặp phải.

Q. Cursor nên sử dụng gói nào?

Để có được kết quả chắc chắn hơn, tôi đang đánh giá rằng việc lựa chọn AI thông minh hơn là điều nên làm. Khóa học đang sử dụng gói trả phí và đang phát triển với Claude 4.0 và o3. Do đó, xin hãy nhất định xác nhận rằng token đang bị tiêu hao khá nhiều.

Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Bất kỳ ai muốn xây dựng dịch vụ thực tế với Vibe Coding

  • Bất kỳ ai muốn sử dụng Vibe Coding tại công ty

  • Bất kỳ ai cần portfolio VibeCode

  • Bất kỳ ai muốn tạo ra dịch vụ khởi nghiệp cá nhân tinh vi bằng Vibe Coding

  • Nhà thiết kế UIUX muốn tạo ra dịch vụ của riêng mình

  • Người lập kế hoạch hoặc PM muốn tạo ra dịch vụ của riêng mình

Cần biết trước khi bắt đầu?

  • React cơ bản

  • HTML, CSS cơ bản

Xin chào
Đây là

15,203

Học viên

417

Đánh giá

216

Trả lời

4.8

Xếp hạng

14

Các khóa học

"Try anything, Try everything!"

코드캠프는 유능한 개발자를 양성하며 개발의 미래를 바꾸고자 하는 목표를 가지고 있습니다. 사회적, 경제적, 교육적 배경에 상관없이 누구에게나 커리어 전환의 기회를 제공하기 위해 인프런에 나타났답니다. 코캠과 함께 커리어 점프에 도전하세요!

Chương trình giảng dạy

Tất cả

57 bài giảng ∙ (23giờ 1phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

12 đánh giá

5.0

12 đánh giá

  • heetask님의 프로필 이미지
    heetask

    Đánh giá 5

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    20% đã tham gia

    I have completed up to Section 2, and the course is so good that I'm leaving a review in the middle of it. Even though I've only watched up to Section 2, I could already tell how much effort you put into preparing this course. I was able to learn how to use prompts more efficiently, and the prompts you teach seem extremely useful. This is the most satisfying course among all the VibeCoding courses I've taken so far. When I post questions, you respond quickly, so even when problems arise during the course, I can continue without any issues. I was making good progress, but I had to stop due to cursor usage limits, so I'll continue and enjoy the rest of the course later. Thank you for the great course.

    • ppos786679님의 프로필 이미지
      ppos786679

      Đánh giá 3

      Đánh giá trung bình 5.0

      5

      18% đã tham gia

      This actually helps with real development. It's a bit challenging, but it's much better than mediocre vibe coding lectures.

      • adgjl11259350님의 프로필 이미지
        adgjl11259350

        Đánh giá 4

        Đánh giá trung bình 5.0

        5

        100% đã tham gia

        It was the best. But maybe because Next.js was the main focus, more than half of the class content was about Next.js, which I think was a bit disappointing.

        • mytalk4813072님의 프로필 이미지
          mytalk4813072

          Đánh giá 1

          Đánh giá trung bình 5.0

          5

          61% đã tham gia

          • devwon1004님의 프로필 이미지
            devwon1004

            Đánh giá 8

            Đánh giá trung bình 5.0

            5

            32% đã tham gia

            3.462.076 ₫

            Khóa học khác của codecamp

            Hãy khám phá các khóa học khác của giảng viên!

            Khóa học tương tự

            Khám phá các khóa học khác trong cùng lĩnh vực!