강의

멘토링

로드맵

Programming

/

AI Coding

バイブコーディングで作ってみる自分だけのランディングページ(with Cursor)

開発はよく分からないけれどVIBE CODING(vibe coding)を始めてみたい方々、自分のお店(飲食店、カフェなど)や自分のサービス(弁護士・税理士・病院など)を宣伝できるランディングページを自分で直接作ってみたい方々のための講座です。VIBE CODINGのスタート地点をきちんとご案内いたします。

  • dongkid111
바이브코딩
vibecoding
커서
cursor
git
Git
vercel
Cursor AI
Vibe Coding

こんなことが学べます

  • Cursorでバイブコーディングする方法

  • バイブコーディングを上達させるコツ

  • バイブコーディングに必須のGit&GitHub基礎

  • ランディングページ公開のために知っておくべき最低限の知識

  • Vercel, Supabaseの基本的な使い方

  • 簡単なMCP経験

バイブコーディングの時代、遅くなる前に参加してみてください! 🔥

深い開発知識がなくても、ご希望のサービスを作れる時代になりました。

バイブコーディングで独自のランディングページを作成しながら

  • Cursorの使い方

  • Git&GitHubの基本

  • Vercel/Supabaseの使用

  • MCP(Model Context Protocol)の使用

を自然に身につけてみてください。

あなたが必ず知っておくべき事実は3つあります🔍

💡バイブコーディングは魔法の棒ではありません。
バイブコーディングをしてみると、エラーなどにより詰まる場合が必ず生じます。

これをAIと対話しながら解決することはできますが、開発を全く知らないと問題解決の速度が非常に遅くなります。

そして開発が全く分からないと、バイブコーディングをしても一定レベル以上のサービスを実装するのは現実的に難しい。

だから開発勉強をある程度やったり、エラーや問題状況を自分で解決できる程度の最小限の開発知識だけは着実に学習していくことをお勧めします。

一応この講義とともにバイブコーディングを上手くするための必要最小限の開発知識が何なのか感を持って、今後の勉強計画を立ててみてください!

バイブコーディング学習前に覚えておくべきこと

💡Gitはバイブコーディングの基本です。
バイブコーディングをうまく行うには、Git(ソフトウェアのバージョン管理のためのツール)の基本的な使い方は知っておく必要があります。

バイブコーディングをしてみると

「あ、以前のデザインがもっと綺麗だったのに😢」、

「もともとうまく動作していて今回の作業をAIがしてからむしろ動作しないんだ、戻りたい」

と思うようになることが多いのですが。

Gitを学ばなければ、私の仕事の履歴から好きな場所にいつでも戻ることができます。

Gitは開発者の方も最初に少し難しい内容でもあり、きちんと学ぶには学ばなければならない内容が膨大ですが、この講義で学ぶGit基礎知識だけでもバイブコーディングを十分にやっていくことができます。

Gitの主な命令の説明

💡 AIをうまくリードすることは、バイブコーディングの鍵です。
バイブコーディングの鍵は、AIをうまくリードすることです。

AIが私が望む方向で、正確で満足度の高い結果を生み出すことができるようにすることが重要です。

  • PRD (Product Requirements Document), TRD (Technical Requirements Document)

  • カーソルルール

  • コンテキスト

  • LLM選択など


AIをうまくリードするのに役立つことが知られているいくつかの方法があります。この講義でみんなを見てみましょう。

もちろん、開発知識が多いほど、より明確で具体的な指示をAIに出すことができ、それが一番良いのですが、まだ開発初心者でも最小限のバイブコーディング品質を維持するための方法を一緒に見てみましょう!

PRD(Product Requirements Document)とは?

バイブコーディングの出発点をしっかりつかみましょう🏃🏻

バイブコーディングは一見簡単に見えますが、事実上開発のすべての知識が総集合される領域でもあります。

だから最初は道を失わないために最小限の開発関連の知識、AIを上手く扱うコツなど、その出発点をよく握らなければならず、今すぐ簡単な結果を作ってみたという驚きと喜びをエネルギーにして、次の段階にさらに進むことができなければなりません。

次のステップだとしたら

  • CursorなどのAIコーディングツールが言うことをよりよく理解し、よりよく指示できるように開発勉強をしてみる

  • サービスを展開するためのさまざまな方法(Vercelなど)を学ぶ

  • Supabaseなどの外部サービスの使い方を学ぶ

  • MCPを活用してCursorとする開発作業の効率性を最大化するなど

があるでしょう。このレッスンをバイブコーディングのタイトな出発点とし、

私が未来に本当に作りたいサービスのために、どの部分を今後さらに勉強していくべきか悩んでみてほしいです。

必要な部分は私も今後ずっと講義で作っていけるようにします。 🙂

講義に関するQnAは、Inflearnの質問でいただくか、下記のオープンチャットルームやディスコにお寄せいただきありがとうございます。
みんな一緒に幸せなバイブコーディングを続けてください〜🎵


オープンチャットルームリンク) https://open.kakao.com/o/gmcDaOIh

ディスコードリンク) https://discord.gg/4dRXMGzk

こんな方に
おすすめです

学習対象は
誰でしょう?

  • バイブコーディングをぜひ経験してみたい方

  • VIBEコーディングをすでにしているが、もっと上達するためのコツを知りたい方

  • ランディングページの開発を外注せずに、ご自身で制作してみたい方

  • Lovable, ReplitなどウェブベースのVibeコーディングはしてみたけれど、直接自分のPCでVibeコーディングをしてみたい方

前提知識、
必要でしょうか?

  • 開発のごく基礎概念(クライアント、サーバーが何かなど)は知っておくと良いでしょう。

こんにちは
です。

안녕하세요, 개발자 및 창업가 김현승입니다.

현재 저는

"PM을 위한 서비스 용어/기능/정책 관리 툴, SpecLive"

"가치관 기반 소개팅앱, 폴잇"

"매력적인 신규 서비스와 초기 유저들이 만나는 곳, Service101"

이라는 서비스들을 운영 중이고,

1인개발자 커뮤니티도 운영하고 있습니다.

AI를 활용해서 개발 효율성을 향상시키는 것에 진심입니다 :) 

경력

  • 공동창업(독서기록 및 독서모임 앱-에필, SeedTIPS)

  • Knowre 백엔드 개발자

  • 코드잇 테크니컬 라이터

  • SNOW 안드로이드 앱 개발자

학력

  • 고려대학교 정보보호대학원 석사 졸업

  • 경찰대학 법학과 학사 졸업

강의

  • 스코클 AITC 데이터 분석 교육 과정 제작

  • 미래산업과학고 미래유망교육 프로그램 진행

カリキュラム

全体

47件 ∙ (4時間 6分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

2件

5.0

2件の受講レビュー

  • withemars1947님의 프로필 이미지
    withemars1947

    受講レビュー 2

    平均評価 5.0

    5

    53% 受講後に作成

    Wow. Việc anh/chị giải thích một cách tử tế đến từng chi tiết nhỏ thật tuyệt vời. Trước đây tôi đã từng tham gia một khóa đào tạo cursor offline, những thứ đã mờ nhạt giờ lại được nhắc nhở và thấm vào đầu một cách dễ dàng. Chúc thầy phát đạt!!!

    • dongkid111
      知識共有者

      Cảm ơn bạn with.emars, hy vọng bạn sẽ nắm vững điểm khởi đầu của vibe coding thông qua khóa học này và có thể tự do tạo ra những trang web mà mình mong muốn trong tương lai. Từ giờ tôi đang có kế hoạch tăng dần độ khó và thậm chí cả các khóa học về việc tạo ra dịch vụ thực sự hoạt động và kiếm tiền, mong bạn quan tâm nhé :)

  • melody8537582님의 프로필 이미지
    melody8537582

    受講レビュー 1

    平均評価 5.0

    5

    90% 受講後に作成

    Gần đây tôi nghe nói rằng với Vibe Coding thì ngay cả những người không phải là lập trình viên cũng có thể tạo ra những chương trình đơn giản, nên tôi đã thử học và thấy rất có ích. Tôi cảm thấy mình đã hiểu rõ Vibe Coding là gì và làm thế nào để học tốt. Bây giờ điều còn lại chắc là sự nỗ lực của bản thân tôi😊😊 Tôi sẽ tiếp tục chăm chỉ học những bài giảng còn lại. Cảm ơn vì khóa học tuyệt vời~~

    • dongkid111
      知識共有者

      Cảm ơn bạn đã nghe giảng một cách chăm chú. Tôi khuyên bạn nên hoàn thành toàn bộ khóa học này và thử tự tay tạo ra những thứ như trang hồ sơ cá nhân của mình. Thực hành nhiều sẽ giúp kỹ năng của bạn tiến bộ nhanh hơn. Tôi dự định sẽ tạo ra nhiều khóa học đa dạng về lập trình vibe trong tương lai, nên rất mong bạn tiếp tục quan tâm :)

¥6,655

似ている講座

同じ分野の他の講座を見てみましょう!