1์‹œ๊ฐ„๋งŒ์— Chat GPT ํด๋ก  with Cursor (์›๋ฐ์ด ํด๋ž˜์Šค)

Next.js + Cursor IDE ๋กœ ์ฑ— ํ”„๋กœ๊ทธ๋žจ์„ ํ•œ์‹œ๊ฐ„๋งŒ์— ๊ตฌํ˜„ํ•˜๋Š” ๋Šฅ๋ ฅ์„ ๊ฐ€์งˆ ์ˆ˜ ์žˆ์–ด์š”.

(4.8) ์ˆ˜๊ฐ•ํ‰ 59๊ฐœ

์ˆ˜๊ฐ•์ƒ 1,119๋ช…

๋‚œ์ด๋„ ์ž…๋ฌธ

์ˆ˜๊ฐ•๊ธฐํ•œ ๋ฌด์ œํ•œ

์‹ค์Šต ์ค‘์‹ฌ
์‹ค์Šต ์ค‘์‹ฌ
ํด๋ก ์ฝ”๋”ฉ
ํด๋ก ์ฝ”๋”ฉ
์‹ค์Šต ์ค‘์‹ฌ
์‹ค์Šต ์ค‘์‹ฌ
ํด๋ก ์ฝ”๋”ฉ
ํด๋ก ์ฝ”๋”ฉ
Thumbnail
์•ˆ๋žฉ
LG์ „์ž
์•„๋ชจ๋ ˆํผ์‹œํ”ฝ
์‚ผ์„ฑ
NHN KCP

NHN KCP

์ž„์ง์›๋“ค๋„ ์ด ๊ฐ•์˜๋ฅผ ๋“ฃ๊ณ  ์žˆ์–ด์š”!

์•ˆ๋žฉ
LG์ „์ž
์•„๋ชจ๋ ˆํผ์‹œํ”ฝ
์‚ผ์„ฑ
NHN KCP

NHN KCP

์ž„์ง์›๋“ค๋„ ์ด ๊ฐ•์˜๋ฅผ ๋“ฃ๊ณ  ์žˆ์–ด์š”!

๋จผ์ € ๊ฒฝํ—˜ํ•œ ์ˆ˜๊ฐ•์ƒ๋“ค์˜ ํ›„๊ธฐ

4.8

5.0

Joseph

100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

Cursor AI ์‚ฌ์šฉํ•ด์„œ ๊ธฐํš๋ถ€ํ„ฐ ๋ฐฐํฌ๊นŒ์ง€ ์–ด๋–ป๊ฒŒ ์‹ค์ œ๋กœ ์‹คํ–‰ํ•˜๋Š”์ง€ ๋ณผ ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์–ด์š”.

5.0

๋Œ€์„ฑ

31% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

cursor ai ๋ฅผ ์‹œ์ž‘ํ•˜๊ธฐ ์ข‹์•„์š”

5.0

Jang Jaehoon

19% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

์ˆ˜๊ฐ• ํ›„ ์ด๋Ÿฐ๊ฑธ ์–ป์„ ์ˆ˜ ์žˆ์–ด์š”

  • 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

์•ˆ๋…•ํ•˜์„ธ์š”
๋„๋„(์ฝ”๋”ฉ๋ฃจํŒก)์ž…๋‹ˆ๋‹ค.

4,260

๋ช…

์ˆ˜๊ฐ•์ƒ

184

๊ฐœ

์ˆ˜๊ฐ•ํ‰

94

๊ฐœ

๋‹ต๋ณ€

4.8

์ 

๊ฐ•์˜ ํ‰์ 

5

๊ฐœ

๊ฐ•์˜

  • ํ”„๋ก ํŠธ ๊ฐœ๋ฐœ์ž๋กœ ๋„ค์นด๋ผ์ฟ ๋ฐฐ ์ค‘ ํ•˜๋‚˜์˜ IT์„œ๋น„์Šค ๊ธฐ์—…์— ์žฌ์งํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ๐Ÿ˜€

  • ๐Ÿš€ SW๋งˆ์—์ŠคํŠธ๋กœ Expert ์ทจ์—… ๋ฉ˜ํ† ๋ง

  • ๐Ÿš€ Naver Boostcamp BE ๋ฉ˜ํ†  ๊ฒฝํ—˜

  • ๐Ÿš€ FE 7Code ๋กœ๋“œ๋งต ๊ฐ•์˜ ์ œ์ž‘

๋”๋ณด๊ธฐ

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

16๊ฐœ โˆ™ (56๋ถ„)

๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์ „์ฒด

59๊ฐœ

4.8

59๊ฐœ์˜ ์ˆ˜๊ฐ•ํ‰

  • Joseph๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
    Joseph

    ์ˆ˜๊ฐ•ํ‰ 35

    โˆ™

    ํ‰๊ท  ํ‰์  5.0

    5

    100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

    Cursor AI ์‚ฌ์šฉํ•ด์„œ ๊ธฐํš๋ถ€ํ„ฐ ๋ฐฐํฌ๊นŒ์ง€ ์–ด๋–ป๊ฒŒ ์‹ค์ œ๋กœ ์‹คํ–‰ํ•˜๋Š”์ง€ ๋ณผ ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์–ด์š”.

    • hakjuknu๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
      hakjuknu

      ์ˆ˜๊ฐ•ํ‰ 155

      โˆ™

      ํ‰๊ท  ํ‰์  5.0

      5

      31% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

      good

      • ๋Œ€์„ฑ๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
        ๋Œ€์„ฑ

        ์ˆ˜๊ฐ•ํ‰ 3

        โˆ™

        ํ‰๊ท  ํ‰์  5.0

        5

        31% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

        cursor ai ๋ฅผ ์‹œ์ž‘ํ•˜๊ธฐ ์ข‹์•„์š”

        • wjdgksak๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
          wjdgksak

          ์ˆ˜๊ฐ•ํ‰ 14

          โˆ™

          ํ‰๊ท  ํ‰์  4.9

          5

          81% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

          ์ปค์„œ๋กœ ๊ฐœ๋ฐœํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ž˜ ์•Œ๊ฒŒ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

          • Jang Jaehoon๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
            Jang Jaehoon

            ์ˆ˜๊ฐ•ํ‰ 839

            โˆ™

            ํ‰๊ท  ํ‰์  4.9

            5

            19% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

            ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

            ๋„๋„(์ฝ”๋”ฉ๋ฃจํŒก)๋‹˜์˜ ๋‹ค๋ฅธ ๊ฐ•์˜

            ์ง€์‹๊ณต์œ ์ž๋‹˜์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

            ๋น„์Šทํ•œ ๊ฐ•์˜

            ๊ฐ™์€ ๋ถ„์•ผ์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

            ๋ฌด๋ฃŒ