인프런 영문 브랜드 로고
인프런 영문 브랜드 로고
NEW

1시간만에 Chat GPT 클론 with Cursor (원데이 클래스)

Next.js + Cursor IDE 로 챗 프로그램을 한시간만에 구현하는 능력을 가질 수 있어요.

Thumbnail

입문자를 위해 준비한
[웹 개발, 프론트엔드] 강의입니다.

이런 걸 배울 수 있어요

  • Chat Application MVP 제작 with Cursor IDE

  • UI 프로토 타이핑 with Cursor IDE

  • 코드리뷰 with Cursor IDE

1시간만에 Chat GPT 클론 with Cursor (원데이 클래스)


🎯 이 강의에서 배울 것

ChatGPT 클론 개발 – OpenAI API를 활용해 실제로 동작하는 AI 챗봇을 만듭니다.

Cursor 활용법 – AI 기반의 코드 에디터 Cursor를 사용해 빠르고 효율적으로 개발하는 법을 배웁니다.

React + Next.js 기본 구조 – Chatbot UI를 구축하며 프론트엔드 기술까지 익힙니다.

서버와 API 연동 – OpenAI API를 불러와 사용자 입력을 처리하는 핵심 로직을 구현합니다.

배포까지 완성 – 만든 챗봇을 Vercel에 배포해 실제 서비스처럼 동작하게 만듭니다.


💡 이 강의가 필요한 분들

AI 챗봇을 직접 만들어 보고 싶은 개발자 및 기획자

OpenAI API 활용법을 배우고 싶은 사람

프론트엔드/백엔드 기본 개념을 익히고 싶은 초보 개발자

실전 프로젝트 경험이 필요한 부트캠프 수강생 & 취업 준비생

빠르게 MVP(최소 기능 제품)를 개발해 보고 싶은 스타트업 창업자

  • Cursor IDE를 활용해서 빠르게 Web Application 제작 (1시간만에 1프로젝트)

    • AI Agent 기능을 이용한 빠른 프로토타이핑 with cursor IDE


💡 결과 미리 보기

Live Demo : https://clone-chat-gpt-cursor.vercel.app

강의 수업 자료 : https://dodokyo.github.io/docs/free-lectures/chat-gpt-cursor/chat-gpt-cursor-1​

사용하는 기술 스택, 선행지식

  • React, Typescript

  • Next.js AppRouter

  • TailwindCss

  • RadixUI

  • Shadcn

  1. Next.js AppRouter : https://nextjs.org/

  2. TailwindCSS : https://tailwindcss.com/

  3. Radix UI : https://www.radix-ui.com/

  4. Shadcn : https://ui.shadcn.com/docs/dark-mode/next

이런 내용을 배워요

수강 전 참고 사항

주의 사항

  • 이 강의는 AI Agent와 함께하는 강의 입니다. 강의를 따라 하더라도 결과물이 다를 수 있습니다.

  • 이 강의를 수강하시는데 Cursor IDE는 무료 버전 -> 유료 버전이 필요할 수 있습니다.

  • GPT API에 비용 발생 가능합니다.

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • AI로 1일 1프로젝트 하고싶은 사람!

  • Next.js + AI Application 만들고 싶은 사람

선수 지식,
필요할까요?

  • React

  • Next

  • Typescript

안녕하세요
도도(코딩루팡)입니다.

2,913

수강생

101

수강평

72

답변

4.8

강의 평점

5

강의

  • 프론트 개발자로 네카라쿠배 중 하나의 IT서비스 기업에 재직하고 있습니다. 😀

  • 🚀 SW마에스트로 Expert 취업 멘토링

  • 🚀 Naver Boostcamp BE 멘토 경험

  • 🚀 FE 7Code 로드맵 강의 제작

커리큘럼

전체

16개 ∙ (56분)

강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!

무료