Day 6
Front-End Development & API Integration with Codex AI
[Codex AI ์ฐ๊ณ] Figma ํ๋ฉด์ ์ค์ ๋์ํ๋ ์๋น์ค ํ๋ฉด์ผ๋ก ๊ตฌํํ๊ณ Codex AI์ ํจ๊ป ๋๋ฒ๊น
ํ๋ฉฐ API ๋ฐ์ดํฐ๋ฅผ ์ฐ๊ฒฐํ๋ ๊ฐ๋ฐ ์ค์ต
Figma UI๋ฅผ ์ค์ ์๋น์ค ํ๋ฉด์ผ๋ก ๊ตฌํํ๊ณ , fetch/AJAX ๊ธฐ๋ฐ API ์ฐ๋์ ํตํด ์๋ฒ ๋ฐ์ดํฐ๋ฅผ ํ๋ฉด์ ๋ฐ์ธ๋ฉํ๋ฉฐ ๋ก๋ฉยท์๋ฌยท๋น ์ํ๊น์ง ์ฒ๋ฆฌํ๋ ๊ฐ๋ฐ ์ ๊ณผ์ ์ Codex Client Workspace๋ฅผ ์ฐ๊ณํฉ๋๋ค. ํ๋ฉด ๋ช
์ธ๋ฅผ ๊ธฐ๋ฐ์ผ๋ก ๊ฐ๋ ๊ฐ๋ฅํ ํ๋ฉด ์ด์ ๋น๋(Task 01), ๋ฐํ์ TypeError ๋ฑ์ ์ฝ์ ์ค๋ฅ ์์ธ ํ๋
๋ฐ ๋ฐฉ์ด ์ฝ๋ ํจ์น(Task 02), ์ค๋ณต ์ ๊ฑฐ ๋ฐ ๊ฐ๋
์ฑ ๋ณ์๋ช
์ผ๋ก ์ ๋ํ๋ ๋ฆฌํฉํ ๋ง(Task 03)๊ณผ CORS ์ ์ฑ
๋ฐ JSON ํ์ฑ ์๋ฌ๋ฅผ ํธ๋ฌ๋ธ์ํ
ํ๋ ๋ณด๊ณ ์ ๋น๋(Mission 01), ์ ์ญ ์ค์ผ ์ฐจ๋จ ๋ฑ ์ฝ๋ ํ์ง ๊ฒํ ๋ฐ ์บก์ํ(Mission 02)๋ฅผ ์ํํฉ๋๋ค.
2์๊ฐ ํ๋ฉด ์ด์ ๋น ๋ฅด๊ฒ ๋ง๋ค๊ธฐ (Task 01)
3์๊ฐ ์ค๋ฅ ํด๊ฒฐ ๋์ฐ๋ฏธ (Task 02) ๋ฐ ์ฝ๋ ๊ฐ์ ํ๊ธฐ (Task 03)
1์๊ฐ AI์ ํจ๊ป ์ค๋ฅ ํด๊ฒฐ (Mission 01) ๋ฐ AI ์ฝ๋ ๋ฆฌ๋ทฐ ๋ฐ๊ธฐ (Mission 02)
Codex AI
Prototype
AI Debug
TypeError Guard
Refactoring
Troubleshooting
Code Review
IIFE Encapsulation
์์ ์ฐ์ถ๋ฌผ
๋ฐ์ํ ๋์๋ณด๋(index.html, layout.css), ๋๋ฒ๊น
์คํฌ๋ฆฝํธ(day6_debug_solution.js), ๋ฆฌํฉํ ๋ง ์์ค์ฝ๋(day6_clean_code.js), ๋๋ฒ๊น
๊ฒฐ๊ณผ ๋ณด๊ณ ์(day6_error_report.md), ์ต์ข
๊ฐ์ฌ ๊ฒฐ๊ณผ ๋ณด๊ณ ์(day6_code_review.md)