Inflearn brand logo image
Inflearn brand logo image
Inflearn brand logo image
Programming

/

AI Coding

Creating My Own Landing Page with Vibe Coding (with Cursor)

This lecture is for those unfamiliar with development but wanting to start vibe coding, and for those wanting to directly create a landing page to promote their own store (restaurant, cafe, etc.) or service (lawyer/tax accountant/hospital, etc.). We will properly establish the starting point for vibe coding.

(5.0) 2 reviews

40 learners

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

What you will learn!

  • How to vibe code with Cursor

  • VIBE Coding Pro Tips

  • Essential Git&GitHub Basics for Vibe Coding

  • Minimal knowledge for landing page deployment

  • Basic usage of Vercel, Supabase

  • Simple MCP experience

The era of Vibe Coding, join us before it's too late! 🔥

We have entered an era where we can create the services we want without having to have in-depth development knowledge.

Create your own landing page with Vibe Coding

  • How to use Cursor

  • Git&GitHub Basics

  • Using Vercel/Supabase

  • Using MCP (Model Context Protocol)

Try to learn it naturally.

3 Facts You Need to Know 🔍

💡 Vibe Coding is not a magic wand.
When doing Vibe coding, there are bound to be times when you get stuck due to errors.

This can be solved by talking to AI, but if you don't know anything about development, the problem-solving speed will be very slow.

And if you don't know anything about development, it is realistically difficult to implement a service above a certain level even with Vibe coding.

So, I recommend that you study development to some extent or steadily learn the minimum development knowledge to be able to solve errors or problems on your own.

First, with this lecture, get a feel for the minimum development knowledge required to be good at Vibe coding, and then make a plan for your future studies!

Things to remember before learning Vibe Coding

💡 Git is the foundation of Vibe Coding.
To be good at Vibe coding, you need to know the basics of using Git (a tool for version control of software).

When you do vibe coding

"Ah, the previous design was prettier 😢",

"It was working fine, but now that AI has done this work, it's not working anymore. I want to go back."

There are many cases where I end up thinking like that.

I need to learn Git so I can go back to any point in my working history at any time.

Git is something that developers find a bit difficult at first, and there is a lot to learn if you want to learn it properly, but you can do Vibe coding well with just the basic knowledge of Git that you learn in this lecture.

Description of Git's main commands

💡 Leading AI well is the core of Vibe Coding.
The key to Vibe Coding is to lead AI well.

It is important to enable AI to produce accurate and satisfactory results in the direction I want.

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

  • Cursor rule

  • Context

  • LLM selection etc.


There are several methods known to help lead AI well. Let's look at them all in this lecture.

Of course, the more development knowledge you have, the more specific and clear instructions you can give to the AI, which is best, but let's take a look at how to maintain a minimum level of Vibe coding quality even if you're still a beginner in development!

What is a Product Requirements Document (PRD)?

Get the right starting point for Vibe Coding 🏃🏻

Vibe coding may seem easy at first glance, but it is actually an area where all development knowledge is gathered.

So, in order to not get lost at first, you need to get a good starting point, such as minimal development-related knowledge and AI handling skills, and you need to use the surprise and joy of creating a simple result right now as energy to move on to the next step.

If that's the next step

  • Study development so that you can better understand what AI coding tools such as Cursor say and better direct them.

  • Learn about different methods for deploying services (Vercel, etc.)

  • Learn how to use external services such as Supabase

  • Maximizing the efficiency of development work using Cursor by utilizing MCP, etc.

This will be there. Use this lecture as a solid starting point for Vibe coding,

I would like you to think about what areas you need to study further in order to create the service you really want to create in the future.

I will continue to make lectures on the parts you need in the future. 🙂

If you have any QnA related to the lecture, please post it as an Inflearn question or in the open chat room below or on Discord. Thank you.
Let's all continue to code happily together~ 🎵


Open chat room link) https://open.kakao.com/o/gmcDaOIh

Discord link) https://discord.gg/4dRXMGzk

Recommended for
these people

Who is this course right for?

  • Person who wants to experience VIBE Coding

  • Already Vibe Coding, seeking tips to excel.

  • People who want to try building their own landing page, instead of outsourcing.

  • Those who have tried web-based VIBE coding (Lovable, Replit, etc.) but want to do VIBE coding directly on their PC.

Need to know before starting?

  • It's good to know very basic development concepts (e.g., client/server).

Hello
This is

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

현재 저는

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

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

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

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

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

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

경력

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

  • Knowre 백엔드 개발자

  • 코드잇 테크니컬 라이터

  • SNOW 안드로이드 앱 개발자

학력

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

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

강의

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

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

Curriculum

All

47 lectures ∙ (4hr 6min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

2 reviews

5.0

2 reviews

  • with.emars님의 프로필 이미지
    with.emars

    Reviews 2

    Average Rating 5.0

    5

    53% enrolled

    와. 친절하게 세세한 부분까지 알려주시니 너무 좋네요. 전에 오프라인 커서교육을 한번 들었었는데, 가물가물 했던 것들이 다시 상기되면서 머리에 쏙쏙 들어옵니다. 강사님 번창하세요!!!

    • 바이브부스터
      Instructor

      감사합니다 with.emars님, 이 강의로 바이브 코딩의 시작점을 잘 잡아보시고 앞으로 원하는 웹페이지 자유롭게 만들수 있게 되시길 기원합니다. 앞으로는 점점 더 난이도를 높여서 실제로 무언가 돌아가는 서비스 제작 및 수익화 강의까지도 계획 중에 있으니 관심 부탁드려요 :)

  • 김정인님의 프로필 이미지
    김정인

    Reviews 1

    Average Rating 5.0

    5

    90% enrolled

    요즘 바이브코딩으로 꼭 개발자가 아니더라도 간단한 프로그램정도는 만들 수 있다고 해서 수강해봤는데 많은 도움이 되었습니다. 바이브코딩이 뭔지, 어떻게 하면 잘 할 수 있는지 자세하게 알게 된 것 같아요. 이제 남은 건 저의 노력일 것 같네요ㅎㅎ 남은 강의도 열심히 들을게요 좋은 강의 감사합니다~~

    • 강의를 잘 들어주셨다니 감사합니다. 이번 강의를 다 들으시고 직접 자신의 프로필 페이지 같은 것도 따라서 만들어보시기를 추천드립니다. 실습을 많이 하다보면 실력이 더 빠르게 느실 거예요. 앞으로도 바이브 코딩에 관한 다양한 강의를 만들 예정이니 계속 관심 가져주시면 감사하겠습니다 :)

$42.90

Similar courses

Explore other courses in the same field!