๐Ÿš€ GitHub Copilot ์œ ์ € ํ•„๋…: Gemini Code Assist๋กœ ๋„˜์–ด์™€์•ผ ํ•˜๋Š” ์ด์œ  (์„ค์น˜๋ถ€ํ„ฐ ๋ฌด๋ฃŒ ์‚ฌ์šฉ๋Ÿ‰๊นŒ์ง€ ์™„๋ฒฝ ์ •๋ฆฌ)

๐Ÿ™‹โ€โ™€๏ธ ์™œ Gemini Code Assist์— ์ฃผ๋ชฉํ•ด์•ผ ํ• ๊นŒ์š”?

์ €๋Š” ๋งค๋‹ฌ 10๋‹ฌ๋Ÿฌ๋ฅผ ์ง€๋ถˆํ•˜๋ฉฐ GitHub Copilot์„ ์‚ฌ์šฉํ•ด ์˜ค๋˜ ๊ฐœ์ธ ๊ฐœ๋ฐœ์ž์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ์ฝ”๋”ฉ ์ž‘์—…๋Ÿ‰์ด ๋งŽ์€ ๋‹ฌ์—๋Š” ์ฃผ์–ด์ง„ ํ† ํฐ์„ ๋„ˆ๋ฌด ๋นจ๋ฆฌ ์†Œ์ง„ํ•˜์—ฌ, ์›”๋ง์—๋Š” ์ œ๋Œ€๋กœ ๋œ ์ฝ”๋“œ ์ถ”์ฒœ์„ ๋ฐ›์ง€ ๋ชปํ•˜๊ณ  ๋А๋ฆฐ ๋ชจ๋ธ์„ ์‚ฌ์šฉํ•˜๋Š” ๋ถˆํŽธํ•จ์„ ๊ฒช์–ด์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค.

๊ฒฐ๊ตญ, ๋น„์šฉ๊ณผ ์„ฑ๋Šฅ ๋ชจ๋‘์—์„œ ์ง€์† ๊ฐ€๋Šฅํ•œ ๋Œ€์•ˆ์„ ์ฐพ๋˜ ์ค‘ Google์˜ Gemini Code Assist๋ฅผ ๋ฐœ๊ฒฌํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๋†€๋ž๊ฒŒ๋„ Gemini๋Š” ๊ฐœ์ธ ๊ฐœ๋ฐœ์ž์—๊ฒŒ ์›” 180,000ํšŒ๋ผ๋Š” ํŒŒ๊ฒฉ์ ์ธ ์ฝ”๋“œ ์™„์„ฑ ํšŸ์ˆ˜๋ฅผ ๋ฌด๋ฃŒ๋กœ ์ œ๊ณตํ•˜๋ฉฐ, VS Code์™€ CLI ํ™˜๊ฒฝ์—์„œ ๋ชจ๋‘ ์ตœ์‹  AI ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ค๋‹ˆ๋‹ค.

GitHub Copilot์˜ ์ œํ•œ์— ์ง€์นœ ๋‹น์‹ ์„ ์œ„ํ•ด, Gemini Code Assist๋กœ ๊ฐˆ์•„ํƒ€์•ผ ํ•  ์ด์œ ์™€ ์„ค์น˜/์‚ฌ์šฉ๋ฒ•์„ ์™„๋ฒฝํ•˜๊ฒŒ ์ •๋ฆฌํ–ˆ์Šต๋‹ˆ๋‹ค.


๐Ÿ’ก Gemini Code Assist/CLI ํ•ต์‹ฌ ์š”์•ฝ

Gemini Code Assist๋Š” Google์˜ ๊ฐ•๋ ฅํ•œ Gemini Pro/Flash ๋ชจ๋ธ์„ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•˜๋ฉฐ, ๋‹ค์Œ๊ณผ ๊ฐ™์€ ํŒŒ๊ฒฉ์ ์ธ ๋ฌด๋ฃŒ ์‚ฌ์šฉ๋Ÿ‰์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

  • ๋ชจ๋ธ: Gemini Code Assist๋Š” Google์˜ ๊ฐ•๋ ฅํ•œ Gemini Pro/Flash ๋ชจ๋ธ์„ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•ฉ๋‹ˆ๋‹ค.
  • ์‚ฌ์šฉ๋Ÿ‰ (๊ฐœ์ธ ๋ฌด๋ฃŒ):
    • ์ฝ”๋“œ ์™„์„ฑ (Completion): ์›” ์ตœ๋Œ€ 180,000ํšŒ ์ œ๊ณต.
    • ์ฑ„ํŒ…/์—์ด์ „ํŠธ ์š”์ฒญ (Chat/Agent): Google ๊ณ„์ • ๋กœ๊ทธ์ธ ์‹œ ์ผ์ผ 1,000ํšŒ ์š”์ฒญ ํ•œ๋„. (API ํ‚ค๋ฅผ ์‚ฌ์šฉํ•˜์ง€ ์•Š๋Š” ๊ฒฝ์šฐ)

1. VS Code: Gemini Code Assist (Agent Mode) ์„ค์ •

VS Code์—์„œ ์ฝ”๋”ฉ ์ง€์› ๋ฐ Agent Mode (๋ณตํ•ฉ ์ž‘์—… ์ฒ˜๋ฆฌ)๋ฅผ ์‚ฌ์šฉํ•˜๊ธฐ ์œ„ํ•œ ์„ค์ • ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค.

1๋‹จ๊ณ„: ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ ์„ค์น˜

VS Code๋ฅผ ์—ด๊ณ  ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ ๋ทฐ (Ctrl+Shift+X)์—์„œ ๋‹ค์Œ์„ ์„ค์น˜ํ•ฉ๋‹ˆ๋‹ค.

  1. Gemini Code Assist ๋˜๋Š” Google Cloud Code ๊ฒ€์ƒ‰ ํ›„ ์„ค์น˜ (๋‘ ํ™•์žฅ ๊ธฐ๋Šฅ ๋ชจ๋‘ Gemini ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜์ง€๋งŒ, Gemini Code Assist๊ฐ€ ๋” ์ง๊ด€์ ์ž…๋‹ˆ๋‹ค.)
  2. ์„ค์น˜๊ฐ€ ์™„๋ฃŒ๋˜๋ฉด VS Code๋ฅผ ์žฌ์‹œ์ž‘ํ•ฉ๋‹ˆ๋‹ค.

2๋‹จ๊ณ„: Google ๊ณ„์ • ๋กœ๊ทธ์ธ

  1. VS Code ์™ผ์ชฝ ํ™œ๋™ ๋ง‰๋Œ€์—์„œ Gemini ์•„์ด์ฝ˜ ($\text{spark}$ ๋ชจ์–‘)์„ ํด๋ฆญํ•ฉ๋‹ˆ๋‹ค.
  2. ์•ˆ๋‚ด์— ๋”ฐ๋ผ Google ๊ณ„์ •์œผ๋กœ ๋กœ๊ทธ์ธ์„ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค.

3๋‹จ๊ณ„: Agent Mode ์ „ํ™˜ ๋ฐ ์‚ฌ์šฉ

  1. Gemini ์ฑ„ํŒ… ์ฐฝ์ด ์—ด๋ฆฌ๋ฉด, ์ž…๋ ฅ์ฐฝ ์ƒ๋‹จ ๋˜๋Š” ๋“œ๋กญ๋‹ค์šด์—์„œ ์ƒ๋‹ด์‚ฌ ์ „ํ™˜ ๋ฒ„ํŠผ์„ ํด๋ฆญํ•˜์—ฌ Agent Mode (Preview)๋กœ ์ „ํ™˜ํ•ฉ๋‹ˆ๋‹ค.
  2. Agent Mode์—์„œ๋Š” /goal ๋“ฑ์˜ ๋ช…๋ น๊ณผ ํ•จ๊ป˜ “์ด ํ”„๋กœ์ ํŠธ์— ์‚ฌ์šฉ์ž ๋กœ๊ทธ์ธ ๊ธฐ๋Šฅ ๊ตฌํ˜„ํ•ด ์ค˜”์™€ ๊ฐ™์€ ๋ณต์žกํ•œ ๋ชฉํ‘œ๋ฅผ ์ œ์‹œํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

2. ํ„ฐ๋ฏธ๋„: Gemini CLI ์„ค์ • ๋ฐ VS Code ํ†ตํ•ฉ

ํ„ฐ๋ฏธ๋„์—์„œ ์ฝ”๋”ฉ, ํŒŒ์ผ ์ˆ˜์ •, ๋ช…๋ น์–ด ์‹คํ–‰ ๋“ฑ์„ AI์™€ ํ•จ๊ป˜ ํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค.

1๋‹จ๊ณ„: Gemini CLI ์„ค์น˜ (Node.js ํ•„์š”)

Node.js v18 ์ด์ƒ์ด ์„ค์น˜๋˜์–ด ์žˆ๋Š”์ง€ ํ™•์ธ ํ›„, ํ„ฐ๋ฏธ๋„์—์„œ ๋‹ค์Œ ๋ช…๋ น์„ ์‹คํ–‰ํ•˜์—ฌ CLI๋ฅผ ์„ค์น˜ํ•ฉ๋‹ˆ๋‹ค.

# Node.js ๋ฒ„์ „ ํ™•์ธ (v18 ์ด์ƒ ๊ถŒ์žฅ)
node -v

# Gemini CLI ๊ธ€๋กœ๋ฒŒ ์„ค์น˜
npm install -g @google/gemini-cli

2๋‹จ๊ณ„: Google ๊ณ„์ • ์—ฐ๋™

ํ„ฐ๋ฏธ๋„์— gemini๋ฅผ ์ž…๋ ฅํ•˜๊ณ  ์—”ํ„ฐ๋ฅผ ๋ˆ„๋ฆ…๋‹ˆ๋‹ค. ์•ˆ๋‚ด์— ๋”ฐ๋ผ ๋ธŒ๋ผ์šฐ์ €์—์„œ Google ๊ณ„์ • ๋กœ๊ทธ์ธ์„ ์ง„ํ–‰ํ•˜์—ฌ ์—ฐ๋™์„ ์™„๋ฃŒํ•ฉ๋‹ˆ๋‹ค. (API ํ‚ค ์—†์ด ๋ฐ”๋กœ ์‚ฌ์šฉ ๊ฐ€๋Šฅ)

3๋‹จ๊ณ„: VS Code ํ†ตํ•ฉ (Context-Aware ๊ธฐ๋Šฅ ํ™œ์„ฑํ™”)

VS Code์˜ ํ†ตํ•ฉ ํ„ฐ๋ฏธ๋„์„ ์—ด๊ณ  ๋‹ค์Œ ๋ช…๋ น์„ ์ˆœ์„œ๋Œ€๋กœ ํ•œ ๋ฒˆ๋งŒ ์‹คํ–‰ํ•˜๋ฉด, CLI๊ฐ€ VS Code์˜ ์—ด๋ ค์žˆ๋Š” ํŒŒ์ผ ์ปจํ…์ŠคํŠธ๋ฅผ ์ธ์‹ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

# 1. IDE ์ปดํŒจ๋‹ˆ์–ธ ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ ์„ค์น˜
/ide install

# 2. VS Code ํ†ตํ•ฉ ๊ธฐ๋Šฅ ํ™œ์„ฑํ™”
/ide enable

3. ๐Ÿ“ Gemini Code Assist / CLI ์‚ฌ์šฉ ๋ฐฉ๋ฒ• ์ƒ์„ธ

Gemini Code Assist์˜ ๋‘ ๊ฐ€์ง€ ์ฃผ์š” ํ™˜๊ฒฝ(IDE Chat๊ณผ CLI)์—์„œ ์–ด๋–ป๊ฒŒ AI๋ฅผ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ๊ตฌ์ฒด์ ์ธ ์‚ฌ์šฉ๋ฒ•์„ ์ •๋ฆฌํ–ˆ์Šต๋‹ˆ๋‹ค.

3-1. VS Code: Gemini Code Assist Agent Mode ์‚ฌ์šฉ๋ฒ•

Agent Mode๋Š” ๋ณต์žกํ•œ ๋ชฉํ‘œ๋ฅผ ์ œ์‹œํ•˜๊ณ  AI์—๊ฒŒ ์‹คํ–‰์„ ์œ„์ž„ํ•  ๋•Œ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.

๋ชฉํ‘œVS Code ์ฑ„ํŒ…์ฐฝ ์ž…๋ ฅ ์˜ˆ์‹œ์„ค๋ช…
์ƒˆ ๊ธฐ๋Šฅ ์ถ”๊ฐ€/goal Add a dark mode feature to the application, using CSS variables and update all relevant components.์•ฑ ์ „์ฒด์— ๊ฑธ์ณ ์Šคํƒ€์ผ์‹œํŠธ ๋ฐ ์ปดํฌ๋„ŒํŠธ ํŒŒ์ผ์„ ์ˆ˜์ •ํ•ฉ๋‹ˆ๋‹ค.
๋ณต์žกํ•œ ๋ฆฌํŒฉํ† ๋ง/goal Refactor the data fetching logic in 'src/api/' to use React Query instead of local state management.๋‹ค์ˆ˜์˜ ํŒŒ์ผ์„ ๋ถ„์„ํ•˜์—ฌ ๋ฐ์ดํ„ฐ ๊ด€๋ฆฌ ๋ฐฉ์‹์„ ์ผ๊ด€๋˜๊ฒŒ ๋ณ€๊ฒฝํ•ฉ๋‹ˆ๋‹ค.
๋ฒ„๊ทธ ์ˆ˜์ •/fix Fix the memory leak identified in the 'UserList.js' component when the component unmounts.ํŠน์ • ํŒŒ์ผ์˜ ์ฝ”๋“œ๋ฅผ ๋ถ„์„ํ•˜๊ณ  ์ˆ˜์ •์„ ์ œ์•ˆํ•œ ํ›„, Diff ๋ทฐ๋ฅผ ํ†ตํ•ด ๋ณ€๊ฒฝ์„ ์Šน์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
ํ”„๋กœ์ ํŠธ ์š”์•ฝ/ask Explain the main architectural pattern used in the 'services' folder.์ „์ฒด ํด๋” ๊ตฌ์กฐ ๋ฐ ์ฝ”๋“œ๋ฅผ ๋ถ„์„ํ•˜์—ฌ ์•„ํ‚คํ…์ฒ˜๋ฅผ ์„ค๋ช…ํ•ด ์ค๋‹ˆ๋‹ค.
์ปจํ…์ŠคํŠธ ์ถ”๊ฐ€@(ํŒŒ์ผ์ด๋ฆ„) "์ด ํŒŒ์ผ์„ ์ฐธ๊ณ ํ•ด์„œ ์ด ํ•จ์ˆ˜์— ๋Œ€ํ•œ JSDoc ์ฃผ์„์„ ์ƒ์„ฑํ•ด ์ค˜"ํŠน์ • ํŒŒ์ผ์„ ๋ช…์‹œ์ ์œผ๋กœ ์ปจํ…์ŠคํŠธ์— ์ถ”๊ฐ€ํ•˜์—ฌ ์ •๊ตํ•œ ๋‹ต๋ณ€์„ ์œ ๋„ํ•ฉ๋‹ˆ๋‹ค.

ํ•ต์‹ฌ: Agent Mode๋Š” ๊ณ„ํš์„ ์ œ์‹œํ•˜๊ณ  ์‚ฌ์šฉ์ž๊ฐ€ ์Šน์ธํ•˜๋Š” ๊ณผ์ •์„ ๊ฑฐ์ณ ์•ˆ์ „ํ•˜๊ฒŒ ์ฝ”๋“œ๋ฒ ์ด์Šค๋ฅผ ์ˆ˜์ •ํ•ฉ๋‹ˆ๋‹ค.

3-2. ํ„ฐ๋ฏธ๋„: Gemini CLI ์‚ฌ์šฉ๋ฒ•

Gemini CLI๋Š” ์‰˜ ๋ช…๋ น์–ด์™€ AI ๊ธฐ๋Šฅ์„ ๊ฒฐํ•ฉํ•˜๊ฑฐ๋‚˜, ํ„ฐ๋ฏธ๋„์—์„œ ๋น ๋ฅด๊ณ  ๋ฐ˜๋ณต์ ์ธ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ๋•Œ ์œ ์šฉํ•ฉ๋‹ˆ๋‹ค.

๋ชฉํ‘œํ„ฐ๋ฏธ๋„ ๋ช…๋ น์–ด ์˜ˆ์‹œ์„ค๋ช…
๋น ๋ฅธ ์ฝ”๋“œ ์ƒ์„ฑgemini ask "Write a Python script to recursively find all image files and convert them to PNG format."์ฝ”๋“œ๋‚˜ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ฆ‰์‹œ ์ƒ์„ฑํ•˜๊ณ  ํ„ฐ๋ฏธ๋„์— ์ถœ๋ ฅํ•ฉ๋‹ˆ๋‹ค.
ํŒŒ์ผ ์ฐธ์กฐ ๋ฐ ์ˆ˜์ •gemini ask "Identify the bug in @index.js and propose a fix."@ ๊ธฐํ˜ธ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํŠน์ • ํŒŒ์ผ์„ ์ฐธ์กฐํ•˜๊ณ , ๋ถ„์„ ๋ฐ ์ˆ˜์ • ์ œ์•ˆ์„ ๋ฐ›์Šต๋‹ˆ๋‹ค.
์‹œ์Šคํ…œ ๋ช…๋ น์–ด ๊ฒฐํ•ฉgemini ask "Analyze the error logs from ! tail -n 50 server.log and suggest a solution."! ๊ธฐํ˜ธ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ„ฐ๋ฏธ๋„ ๋ช…๋ น์–ด๋ฅผ ์‹คํ–‰ํ•˜๊ณ , ๊ทธ ๊ฒฐ๊ณผ๋ฅผ AI์—๊ฒŒ ๋ฐ”๋กœ ์ž…๋ ฅ์œผ๋กœ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
๋Œ€ํ™”ํ˜• ์„ธ์…˜gemini๋Œ€ํ™”ํ˜• ์„ธ์…˜์„ ์‹œ์ž‘ํ•˜์—ฌ ํŒŒ์ผ ์ฒจ๋ถ€, ์ฝ”๋“œ ํŽธ์ง‘ ๋“ฑ์˜ ์ž‘์—…์„ ๋Œ€ํ™” ํ˜•์‹์œผ๋กœ ์ˆ˜ํ–‰ํ•ฉ๋‹ˆ๋‹ค.
๋‹จ์ผ ๋ช…๋ น ์‹คํ–‰gemini ask "Generate a Dockerfile for this Node.js project." > Dockerfile์ƒ์„ฑ๋œ ์ฝ”๋“œ๋ฅผ ํŒŒ์ผ๋กœ ๋ฐ”๋กœ ๋ฆฌ๋‹ค์ด๋ ‰์…˜(>)ํ•˜์—ฌ ์ €์žฅํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ•ต์‹ฌ: Gemini CLI๋Š” ํ„ฐ๋ฏธ๋„ ํ™˜๊ฒฝ์˜ ์œ ์—ฐ์„ฑ์„ AI ๊ธฐ๋Šฅ๊ณผ ๊ฒฐํ•ฉํ•˜์—ฌ ๊ฐœ๋ฐœ ์›Œํฌํ”Œ๋กœ์šฐ๋ฅผ ์ž๋™ํ™”ํ•˜๊ณ  ๊ฐ€์†ํ™”ํ•ฉ๋‹ˆ๋‹ค.

๋Œ“๊ธ€ ๋‹ฌ๊ธฐ

์ด๋ฉ”์ผ ์ฃผ์†Œ๋Š” ๊ณต๊ฐœ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ํ•„์ˆ˜ ํ•„๋“œ๋Š” *๋กœ ํ‘œ์‹œ๋ฉ๋‹ˆ๋‹ค

์œ„๋กœ ์Šคํฌ๋กค