โœ๏ธ DevLog/Devcourse

[DevCourse] ์ƒ์„ฑํ˜• AI ํ™œ์šฉ ๋ฐฑ์—”๋“œ ๋ฐ๋ธŒ์ฝ”์Šค 18์ผ์ฐจ

hyebin (Helia) 2025. 4. 28. 19:36
๋ฐ˜์‘ํ˜•

์˜ค๋Š˜๋„ ํŒ€ ํ”„๋กœ์ ํŠธ ์ž‘์—…์„ ์ด์–ด๊ฐ”๋‹ค.

์ง€๋‚œ์ฃผ์— ์ •ํ–ˆ๋˜ ์•„์ด๋””์–ด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ, ์ „์ฒด ํ๋ฆ„์„ ๋‹ค์‹œ ์ •๋ฆฌํ•˜๊ณ  ์„ธ๋ถ€ ์ž‘์—…์— ๋“ค์–ด๊ฐ€๋Š” ์ค€๋น„๋ฅผ ํ–ˆ๋‹ค.

์ด์ œ ์ •๋ง ๋ณธ๊ฒฉ์ ์ธ ๊ฐœ๋ฐœ์ด ์‹œ์ž‘๋œ๋‹ค.


๐Ÿ“Œ ์˜ค๋Š˜ ์ง„ํ–‰ํ•œ ๋‚ด์šฉ

  • ์•„์ด๋””์–ด ๊ตฌ์ฒดํ™” ๋ฐ ๋ฐฉํ–ฅ ์ •๋ฆฌ
    • ํŒ€์›๋“ค๊ณผ ํ•จ๊ป˜ ์ „์ฒด ํ๋ฆ„์„ ๋‹ค์‹œ ๋ณด๋ฉด์„œ
    • ์„ธ๋ถ€์ ์ธ ๊ธฐ๋Šฅ๊ณผ ํ™”๋ฉด ์ „ํ™˜ ํ๋ฆ„์— ๋Œ€ํ•ด align์„ ๋งž์ท„๋‹ค.
    • ์ฒ˜์Œ ์„ค์ •ํ–ˆ๋˜ ์•„์ด๋””์–ด๋ฅผ ํ˜„์‹ค์ ์œผ๋กœ ๊ตฌํ˜„ ๊ฐ€๋Šฅํ•œ ๋ฐฉํ–ฅ์œผ๋กœ ์กฐ๊ธˆ ๋” ๋‹ค๋“ฌ์—ˆ๋‹ค.
  • JSON ๋ฐ์ดํ„ฐ ๊ตฌ์กฐ ํ™•์ •
    • ์‹ค์ œ ๋ฐ์ดํ„ฐ๋ฅผ ์–ด๋–ป๊ฒŒ ๋‹ค๋ฃฐ์ง€ ๊ตฌ์กฐ๋ฅผ ์„ค๊ณ„ํ–ˆ๋‹ค.
  • ํ”ผ๊ทธ๋งˆ๋กœ ์™€์ด์–ดํ”„๋ ˆ์ž„ ์ œ์ž‘
    • ๊ฐ ํŽ˜์ด์ง€์™€ ํ™”๋ฉด ๊ตฌ์„ฑ์„ Figma๋กœ ๊ทธ๋ ค๋ณด๋ฉด์„œ
    • ๊ฐœ๋ฐœ์— ํ•„์š”ํ•œ ๊ธฐ๋ณธ ๋ผˆ๋Œ€๋ฅผ ์‹œ๊ฐ์ ์œผ๋กœ ํ™•์ธํ–ˆ๋‹ค.
  • ๋ณธ๊ฒฉ์ ์ธ ๊ฐœ๋ฐœ ์‹œ์ž‘
    • ์˜ค๋Š˜๋ถ€ํ„ฐ ์‹ค์ œ๋กœ React๋ฅผ ์ด์šฉํ•ด ํ”„๋กœ์ ํŠธ๋ฅผ ๊ตฌํ˜„ํ•˜๊ธฐ ์‹œ์ž‘ํ–ˆ๋‹ค.

๐Ÿงก ๋А๋‚€ ์ 

์˜ค๋Š˜์€ ๋“œ๋””์–ด React๋กœ ํ”„๋กœ์ ํŠธ ๊ฐœ๋ฐœ์„ ์‹œ์ž‘ํ•˜๋Š” ์ฒซ๋‚ ์ด์—ˆ๋‹ค.

๊ฐœ๋…์ ์œผ๋กœ๋Š” ๊ณต๋ถ€๋ฅผ ํ•ด์™”์ง€๋งŒ, ์ด๋ ‡๊ฒŒ ํŒ€ ํ”„๋กœ์ ํŠธ์— React๋ฅผ ์ง์ ‘ ์ ์šฉํ•ด ๋ณด๋Š” ๊ฑด ์ฒ˜์Œ์ด๋ผ ์†”์งํžˆ ์กฐ๊ธˆ ์–ด์ƒ‰ํ•˜๊ณ  ๊ธด์žฅ๋„ ๋๋‹ค.

 

์ฒ˜์Œ ์„ธํŒ…์„ ํ•˜๊ณ  ํŒŒ์ผ์„ ๋‚˜๋ˆ„๊ณ , ์ปดํฌ๋„ŒํŠธ๋ฅผ ๊ตฌ์„ฑํ•ด ๊ฐ€๋Š” ๊ณผ์ •์ด ๋จธ๋ฆฌ๋กœ ์ดํ•ดํ–ˆ๋˜ ๊ฒƒ๊ณผ ์‹ค์ œ๋กœ ์†์œผ๋กœ ํ•˜๋Š” ๊ฒƒ ์‚ฌ์ด์˜ ์ฐจ์ด๋ฅผ ํ™•์‹คํžˆ ๋А๋ผ๊ฒŒ ํ•ด ์คฌ๋‹ค.

 

๊ทธ๋ž˜๋„ ํŒ€์›๋“ค๊ณผ ํ๋ฆ„์„ ๋งž์ถฐ๊ฐ€๋ฉฐ ํ•˜๋‚˜์”ฉ ๊ตฌ์ฒดํ™”ํ•˜๊ณ , ๋ˆˆ์•ž์— ๊ฒฐ๊ณผ๋ฌผ์ด ์กฐ๊ธˆ์”ฉ ํ˜•ํƒœ๋ฅผ ๊ฐ–์ถฐ๊ฐ€๋Š” ๊ฑธ ๋ณด๋‹ˆ ๋” ์—ด์‹ฌํžˆ ํ•ด๋ณด๊ณ  ์‹ถ๋‹ค๋Š” ๋งˆ์Œ์ด ๋” ์ปค์กŒ๋‹ค.

 

์•„์ง์€ ๋ถ€์กฑํ•˜๊ณ  ์„œํˆด์ง€๋งŒ, ์ด๋ฒˆ ํ”„๋กœ์ ํŠธ๋ฅผ ํ†ตํ•ด React๋ฅผ ์ง„์งœ ‘๋‚ด ๊ฒƒ์œผ๋กœ’ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋„๋ก ์ตœ์„ ์„ ๋‹คํ•ด๋ณด์ž.

๋‚ด์ผ๋ถ€ํ„ฐ๋Š” ๋ณธ๊ฒฉ์ ์œผ๋กœ ๊ฐ ์ปดํฌ๋„ŒํŠธ ์ž‘์—…๊ณผ ๊ธฐ๋Šฅ ๊ตฌํ˜„์ด ์‹œ์ž‘๋  ์˜ˆ์ •์ด๋‹ค.

์กฐ๊ธˆ์”ฉ ์Œ“์•„๊ฐ€๋ฉด์„œ ์™„์„ฑ๋„๋ฅผ ๋†’์ผ ์ˆ˜ ์žˆ๋„๋ก ๋…ธ๋ ฅํ•ด์•ผ์ง€!!

๋ฐ˜์‘ํ˜•