๐Ÿ“ฐ ํ”„๋ฆฌ๋ฏธ์—„ AI ํ•ด์™ธ ๋‰ด์Šค ๋ฒˆ์—ญ & ์š”์•ฝ๊ธฐ

OpenAI, Gemini, Llama ๋‹ค์ค‘ ํด๋ฐฑ ์‹œ์Šคํ…œ๊ณผ 5๊ฐ€์ง€ ํŽธ์˜ ๊ธฐ๋Šฅ์„ ํƒ‘์žฌํ•œ ๊ณ ๊ฐ€์šฉ์„ฑ ์›น ์„œ๋น„์Šค

AI ๋‰ด์Šค ๋ฒˆ์—ญ๊ธฐ ์ปค๋ฒ„ ์ด๋ฏธ์ง€

๐Ÿ›  Tech Stack

๐Ÿง  ์–ด๋–ป๊ฒŒ ๋งŒ๋“ค์—ˆ๋‚˜

๋‹จ์ˆœํ•œ ๋ฒˆ์—ญ๊ธฐ๋ฅผ ๋„˜์–ด, ์‹ค์ œ ์„œ๋น„์Šค ํ™˜๊ฒฝ์—์„œ๋„ ์•ˆ์ •์ ์œผ๋กœ ๋™์ž‘ํ•˜๋Š” ๊ณ ๊ฐ€์šฉ์„ฑ(High Availability) ์•„ํ‚คํ…์ฒ˜์™€ ์‚ฌ์šฉ์ž ์นœํ™”์ ์ธ UI๋ฅผ ๊ฒฐํ•ฉํ•œ ํ”„๋ฆฌ๋ฏธ์—„ ๋‰ด์Šค ์š”์•ฝ ์„œ๋น„์Šค์ž…๋‹ˆ๋‹ค.

1. 3์ค‘ AI ํญํฌ์ˆ˜(Waterfall) ํด๋ฐฑ ์‹œ์Šคํ…œ

์„œ๋ฒ„ ๊ณผ๋ถ€ํ•˜๋กœ ์ธํ•ด ๋‹จ์ผ AI ๋ชจ๋ธ์ด ์‘๋‹ตํ•˜์ง€ ๋ชปํ•  ๊ฒฝ์šฐ๋ฅผ ๋Œ€๋น„ํ•ด ๋ฐฑ์—”๋“œ์— ๋‹ค์ค‘ ์šฐํšŒ ๋กœ์ง์„ ๊ตฌํ˜„ํ–ˆ์Šต๋‹ˆ๋‹ค. OpenAI (GPT-4o-mini)๊ฐ€ ์‹คํŒจํ•˜๋ฉด ์ฆ‰์‹œ Google Gemini (2.5-Flash)๋กœ, ๊ทธ๊ฒƒ๋งˆ์ € ์‹คํŒจํ•˜๋ฉด Hugging Face (Llama-3.1-8B)๋กœ ์š”์ฒญ์„ ๋„˜๊ฒจ ์‚ฌ์šฉ์ž๋Š” ์—๋Ÿฌ๋ฅผ ๋ˆˆ์น˜์ฑ„์ง€ ๋ชปํ•˜๊ณ  ๋ฌด์กฐ๊ฑด ๊ฒฐ๊ณผ๋ฌผ์„ ๋ฐ›์„ ์ˆ˜ ์žˆ๋„๋ก ์„ค๊ณ„ํ–ˆ์Šต๋‹ˆ๋‹ค.

2. ํ”„๋กฌํ”„ํŠธ ์—”์ง€๋‹ˆ์–ด๋ง์„ ํ†ตํ•œ ํ•ต์‹ฌ ํ‚ค์›Œ๋“œ ์ถ”์ถœ

๋‹จ์ˆœ ์ •๊ทœ์‹์„ ํ†ตํ•œ ๋ฌด์˜๋ฏธํ•œ ๋‹จ์–ด ๋นˆ๋„์ˆ˜ ์ถ”์ถœ ๋ฐฉ์‹์„ ๋ฒ„๋ฆฌ๊ณ , AI ํ”„๋กฌํ”„ํŠธ์— 'ํ•ด์‹œํƒœ๊ทธ ์ƒ์„ฑ ์ง€์นจ'์„ ์ฃผ์ž…ํ–ˆ์Šต๋‹ˆ๋‹ค. ๊ธฐ์‚ฌ์˜ ๋ฌธ๋งฅ๊ณผ ๊ณ ์œ ๋ช…์‚ฌ๋ฅผ ์™„๋ฒฝํžˆ ์ดํ•ดํ•œ AI๊ฐ€ ๋ฝ‘์•„๋‚ธ ํƒœ๊ทธ๋ฅผ ์„œ๋ฒ„๊ฐ€ ๋ถ„๋ฆฌํ•˜์—ฌ ํ”„๋ก ํŠธ์—”๋“œ์— ๊น”๋”ํ•œ ๋ฑƒ์ง€ ํ˜•ํƒœ๋กœ ์ „๋‹ฌํ•ฉ๋‹ˆ๋‹ค.

3. 5๊ฐ€์ง€ ํ”„๋ก ํŠธ์—”๋“œ ํ”„๋ฆฌ๋ฏธ์—„ ๊ธฐ๋Šฅ

์ˆœ์ˆ˜ HTML/JS๋ฅผ ํ™œ์šฉํ•ด ๋ถ€๊ฐ€์ ์ธ ์„œ๋ฒ„ ๋ถ€ํ•˜ ์—†์ด ํด๋ผ์ด์–ธํŠธ ๋‹จ์—์„œ โ‘  ๋‹คํฌ๋ชจ๋“œ ํ† ๊ธ€, โ‘ก Web Speech API๋ฅผ ํ™œ์šฉํ•œ ๋‰ด์Šค ์Œ์„ฑ ์ฝ๊ธฐ(TTS), โ‘ข html2canvas๋ฅผ ํ™œ์šฉํ•œ ์š”์•ฝ๋ณธ ์ด๋ฏธ์ง€ ์ €์žฅ, โ‘ฃ LocalStorage๋ฅผ ์ด์šฉํ•œ ๋‚˜๋งŒ์˜ ์Šคํฌ๋žฉ๋ถ ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•˜์—ฌ ์‹ค์ œ ์ƒ์šฉ ์„œ๋น„์Šค ์ˆ˜์ค€์˜ ์‚ฌ์šฉ์„ฑ์„ ํ™•๋ณดํ–ˆ์Šต๋‹ˆ๋‹ค.

๐Ÿ’ฌ ์ด ํ”„๋กœ์ ํŠธ ์–ด๋– ์„ธ์š”?

GitHub ๊ณ„์ •์œผ๋กœ ๋กœ๊ทธ์ธํ•˜๋ฉด ๋Œ“๊ธ€์ด ๋ณธ์ธ ๋ฆฌํฌ์˜ GitHub Discussions์— ์ž๋™ ์ €์žฅ๋ฉ๋‹ˆ๋‹ค.