๐Ÿค– 29. Cursor AI โ€” ์ง„์งœ ๊ฐœ๋ฐœ์— ๋„์›€์ด ๋˜๋Š” AI ์ฝ”๋“œ ํŽธ์ง‘๊ธฐ์ธ๊ฐ€?

JM_Devยท2025๋…„ 5์›” 7์ผ
0
post-thumbnail
  • Cursor
  • AI์ฝ”๋”ฉ๋„๊ตฌ
  • ์ฝ”๋“œํŽธ์ง‘๊ธฐ
  • GPT4
  • ํ”„๋ก ํŠธ์—”๋“œ
  • ๊ฐœ๋ฐœํˆด
  • AI์™€๊ฐœ๋ฐœ
  • ๊ฐœ๋ฐœ์ž๊ธฐ๋ก

์ฝ”๋”ฉ ์ค‘ โ€œ์ด๊ฑฐ ์–ด๋–ป๊ฒŒ ์งœ์ง€?โ€ ์‹ถ์€ ์ˆœ๊ฐ„,
Tab ํ‚ค๋กœ Copilot์—๊ฒŒ ๋„์›€๋ฐ›๊ฑฐ๋‚˜,
๋ธŒ๋ผ์šฐ์ €๋ฅผ ์—ด๊ณ  ChatGPT์—๊ฒŒ ๋ฌผ์–ด๋ณธ ์ , ๋‹ค๋“ค ์žˆ์„ ๊ฑฐ๋‹ค.

๊ทธ๋Ÿฐ๋ฐ ์ด์ œ๋Š” ์•„์˜ˆ VSCode ๊ธฐ๋ฐ˜์˜ AI ์ฝ”๋“œ ํŽธ์ง‘๊ธฐ ์ž์ฒด๊ฐ€ ๋‚˜์™”๋‹ค.
๋ฐ”๋กœ Cursor๋ผ๋Š” ์ด๋ฆ„์˜ ๋„๊ตฌ๋‹ค.
์ด๋ฒˆ ๊ธ€์€ Cursor๊ฐ€ ๋ญ๊ณ , ์–ด๋–ป๊ฒŒ ์ž‘๋™ํ•˜๋ฉฐ,
ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž ์ž…์žฅ์—์„œ ์–ด๋–ป๊ฒŒ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ์„์ง€ ์ •๋ฆฌํ•œ ๊ธ€์ด๋‹ค.


โœ… Cursor๋ž€ ๋ฌด์—‡์ธ๊ฐ€?

GPT-4 Turbo ๊ธฐ๋ฐ˜์˜ AI ์ฝ”๋”ฉ IDE
VSCode๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ๋งŒ๋“ค์–ด์กŒ๊ณ , GPT๋ฅผ ํŒŒ์ผ ์‹œ์Šคํ…œ, ์ฝ”๋“œ context-aware๋กœ ์—ฐ๊ฒฐ์‹œํ‚จ ๋„๊ตฌ๋‹ค.

๊ฐ„๋‹จํžˆ ๋งํ•˜๋ฉดโ€ฆ

  • VSCode์—์„œ ์ง์ ‘ GPT์™€ ๋Œ€ํ™”ํ•  ์ˆ˜ ์žˆ๊ณ 
  • Ask Cursor, Edit with AI, Explain Code, Generate Test ๋“ฑ์˜ ๋ช…๋ น์–ด๋กœ
  • ์ง„์งœ๋กœ ์ฝ”๋“œ์— โ€œ๋ถ™์–ด์„œโ€ ๋˜‘๋˜‘ํ•˜๊ฒŒ ๋„์™€์ฃผ๋Š” AI ์ฝ”ํŒŒ์ผ๋Ÿฟ

๐Ÿ› ๏ธ ์„ค์น˜ ๋ฐฉ๋ฒ•

  1. ๊ณต์‹ ์‚ฌ์ดํŠธ: https://www.cursor.sh
  2. macOS / Windows ์„ค์น˜ ํŒŒ์ผ ์ œ๊ณต
  3. GitHub ๊ณ„์ •์œผ๋กœ ๋กœ๊ทธ์ธ
  4. GPT-4 ์‚ฌ์šฉ ๊ฐ€๋Šฅ (๋ฌด๋ฃŒ ๊ณ„์ •์€ ์ œํ•œ ์žˆ์Œ)

๐Ÿ’ก Cursor์˜ ์ฃผ์š” ๊ธฐ๋Šฅ๋“ค

๊ธฐ๋Šฅ์„ค๋ช…
Ask์„ ํƒํ•œ ์ฝ”๋“œ ๋˜๋Š” ์ „์ฒด ํ”„๋กœ์ ํŠธ ๋งฅ๋ฝ์„ ๋ฐ”ํƒ•์œผ๋กœ GPT์—๊ฒŒ ์งˆ๋ฌธ
Editํ•จ์ˆ˜๋‚˜ ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋“œ๋ž˜๊ทธํ•œ ํ›„ ์ž์—ฐ์–ด๋กœ ์ˆ˜์ • ์ง€์‹œ
Explain์ดํ•ด ์•ˆ ๋˜๋Š” ์ฝ”๋“œ ๋ธ”๋Ÿญ์„ ์„ ํƒ โ†’ GPT๊ฐ€ ๋ถ„์„ ์„ค๋ช…
Autocomplete์ผ๋ฐ˜์ ์ธ Copilot์ฒ˜๋Ÿผ Tab ์ž๋™์™„์„ฑ ๊ฐ€๋Šฅ
Generate Testํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ž๋™ ์ƒ์„ฑ (Jest, Vitest ๋“ฑ)
Refactor์ž์—ฐ์–ด๋กœ โ€œ์ด๊ฑฐ ๋ฆฌํŒฉํ„ฐ๋ง ํ•ด์ค˜โ€ ์š”์ฒญ ๊ฐ€๋Šฅ
Commit Message์ปค๋ฐ‹ ๋ฉ”์‹œ์ง€๋„ ์ž๋™ ์ƒ์„ฑํ•ด์คŒ (๐Ÿ”ฅ ์ง„์งœ ์‹ค์šฉ์ ์ž„)

๐Ÿ‘€ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž์—๊ฒŒ ์ข‹์€ ํ™œ์šฉ ์˜ˆ์‹œ

1๏ธโƒฃ ๋ณต์žกํ•œ useEffect ์ดํ•ด ์•ˆ ๋  ๋•Œ โ†’ Explain

useEffect(() => {
  const id = setInterval(() => {
    console.log('polling...');
  }, 5000);

  return () => clearInterval(id);
}, []);

โ€œ์ด ์ฝ”๋“œ๊ฐ€ ์–ด๋–ค ๊ตฌ์กฐ๋กœ ๋™์ž‘ํ•˜๋Š”์ง€ ์„ค๋ช…ํ•ด์ค˜โ€
โ†’ Cursor๊ฐ€ ํƒ€์ด๋ฐ, ์˜๋„, ํด๋ฆฐ์—… ์ฒ˜๋ฆฌ๊นŒ์ง€ ๊ตฌ์ฒด์ ์œผ๋กœ ์„ค๋ช…ํ•ด์คŒ


2๏ธโƒฃ ์กฐ๊ฑด๋ณ„ ๋ฒ„ํŠผ ์Šคํƒ€์ผ๋ง ๋ฆฌํŒฉํ„ฐ๋ง

<Button disabled={isLoading || isError} />

โ€œ์ด ๋ฒ„ํŠผ ์ปดํฌ๋„ŒํŠธ์—์„œ ๋กœ๋”ฉ ์ƒํƒœ์™€ ์˜ค๋ฅ˜ ์ƒํƒœ๋ฅผ ๋ถ„๋ฆฌํ•ด์„œ ๊ด€๋ฆฌํ•˜๊ฒŒ ๋ฆฌํŒฉํ„ฐ๋งํ•ด์ค˜โ€
โ†’ ๋ฒ„ํŠผ ๋ถ„๋ฆฌํ•˜๊ฑฐ๋‚˜, ์ƒํƒœ ํ—ฌํผ ํ•จ์ˆ˜๋กœ ๋ถ„ํ•ดํ•˜๋Š” ์ฝ”๋“œ ์ œ์•ˆ


3๏ธโƒฃ ์ƒํƒœ๊ด€๋ฆฌ ๋น„๊ตํ•ด๋ณด๊ธฐ

โ€œZustand๋กœ ์ž‘์„ฑ๋œ ์ด store๋ฅผ Redux Toolkit์œผ๋กœ ๋ฐ”๊ฟ”์ค˜โ€
โ†’ ์ง„์งœ ์ƒํƒœ ์ €์žฅ ๊ตฌ์กฐ, ์•ก์…˜ ๊ตฌ์กฐ๊นŒ์ง€ ๋ฐ”๊ฟ”์คŒ


4๏ธโƒฃ ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ƒ์„ฑ

โ€œ์ด ํ•จ์ˆ˜์— ๋Œ€ํ•œ ํ…Œ์ŠคํŠธ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•ด์ค˜ (Vitest ๊ธฐ๋ฐ˜์œผ๋กœ)โ€
โ†’ ํ…Œ์ŠคํŠธ ์ฝ”๋“œ + describe / it ๊ตฌ๋ฌธ ํฌํ•จ์œผ๋กœ ์ƒ์„ฑ๋จ


๐Ÿ” ๊ฐœ์ธ์ •๋ณด / ๋ณด์•ˆ ๊ฑฑ์ •์€?

  • GPT API ํ˜ธ์ถœ ๊ธฐ๋ฐ˜ (GPT-4 Turbo ์‚ฌ์šฉ)
  • Cursor๋Š” GPT์—๊ฒŒ ํŒŒ์ผ ์ •๋ณด๋ฅผ ๋ณด๋‚ด์„œ ์ž‘์—…ํ•จ
  • ๋ฏผ๊ฐํ•œ ํ”„๋กœ์ ํŠธ๋Š” ์‚ฌ์šฉ ์ „์— ์„ค์ • or ๋กœ์ปฌ ํŒŒ์ผ ์ œํ•œ ๊ณ ๋ ค ํ•„์š”

๐Ÿ“ ๋‚ด๊ฐ€ ๋А๋‚€ ์ 

์ฒ˜์Œ์—” ๊ทธ๋ƒฅ โ€œGPT ๋ถ™์€ VSCode๊ฒ ์ง€โ€ ์ƒ๊ฐํ–ˆ๋Š”๋ฐ
์‹ค์ œ๋กœ ์จ๋ณด๋ฉด ์ฝ”๋“œ์™€ ์—ฐ๊ฒฐ๋œ ๋งฅ๋ฝ ๊ธฐ๋ฐ˜ ์งˆ๋ฌธ/์ˆ˜์ •์ด ๊ฐ€๋Šฅํ•œ ์ ์ด ์ง„์งœ ๊ฐ•๋ ฅํ•˜๋‹ค.

ํŠนํžˆ Context-Aware Prompting ๋•๋ถ„์—,
ํŒŒ์ผ ์ „์ฒด๋ฅผ ์ดํ•ดํ•˜๊ณ  ๋ฆฌํŒฉํ„ฐ๋ง ํ•ด์ฃผ๋Š” ๋Šฅ๋ ฅ์€ ChatGPT ๋‹จ๋…๋ณด๋‹ค ํ›จ์”ฌ ์ž์—ฐ์Šค๋Ÿฝ๋‹ค.

์ด์ œ๋Š” ์ฝ”๋”ฉ ๋„์ค‘, ๊ณ ๋ฏผ๋˜๋ฉด Ctrl+K๋ฅผ ๋ˆŒ๋Ÿฌ ๋ฐ”๋กœ Cursor๋กœ ๋ฌผ์–ด๋ณด๋Š” ์Šต๊ด€์ด ์ƒ๊ฒผ๋‹ค.
์ฝ”๋”ฉ์˜ ํ๋ฆ„์ด ๋Š๊ธฐ์ง€ ์•Š์•„์„œ ์ •๋ง ์œ ์šฉํ•จ.


๐Ÿค– "Cursor๋Š” ๋‹จ์ˆœํ•œ ์ฝ”ํŒŒ์ผ๋Ÿฟ์ด ์•„๋‹ˆ๋ผ, ์ฝ”๋“œ์™€ ํ•จ๊ป˜ ๊ณ ๋ฏผํ•˜๋Š” AI ๋™๋ฃŒ๋‹ค."


profile
๊ฐœ๋ฐœ์ž๋กœ ์ทจ์—…์„ ์ค€๋น„ ์ค‘ ์ด๋ฉฐ, ์—ด์‹ฌํžˆ ๊ณต๋ถ€ ์ค‘ ์ž…๋‹ˆ๋‹ค!

0๊ฐœ์˜ ๋Œ“๊ธ€