๐ŸŽฎ ๋ ˆํŠธ๋กœ ํ–‰๋งจ '95 KIRO ์‚ฌ์šฉ

๋ฐœํ–‰: (2025๋…„ 12์›” 27์ผ ์˜คํ›„ 08:23 GMT+9)
4 ๋ถ„ ์†Œ์š”
์›๋ฌธ: Dev.to

Source: Dev.to

Cover image for ๐ŸŽฎ Retro Hangman '95 Using KIRO

ํ”„๋กœ์ ํŠธ ๊ฐœ์š”

  • ๊ฒŒ์ž„: ์ง€๋Šฅํ˜• ์ ์‘ ๊ธฐ๋Šฅ์ด ํฌํ•จ๋œ ํด๋ž˜์‹ ํ–‰๋งจ
  • ๊ธฐ์ˆ  ์Šคํƒ: HTML5, CSS3, JavaScript
  • ์‹ค์ œ ๋ฐ๋ชจ:

๋ ˆํŠธ๋กœ ๋ถ€ํ™œ ๊ตฌํ˜„

ํด๋ž˜์‹ ๊ฒŒ์ž„ ์žฌํ˜„ โœ…

  • ๊ธฐ๋ณธ ๊ฒŒ์ž„: ์ „ํ†ต์ ์ธ ํ–‰๋งจ ๋‹จ์–ด ์ถ”์ธก ๋ฉ”์ปค๋‹ˆ์ฆ˜
  • ๋ ˆํŠธ๋กœ UI: CRT ํšจ๊ณผ๊ฐ€ ์ ์šฉ๋œ ์ •ํ†ต Windowsโ€ฏ95 ์Šคํƒ€์ผ ์ธํ„ฐํŽ˜์ด์Šค
  • ํ–ฅ์ˆ˜ ์š”์†Œ: ๋„ค์˜จ ์ƒ‰์ƒ, ํ”ฝ์…€ ํฐํŠธ, 90๋…„๋Œ€ ๋ฏธํ•™

ํ˜„๋Œ€ AI ํŠธ์œ„์ŠคํŠธ ๐Ÿค–

  • ์ง€๋Šฅํ˜• ๋‹จ์–ด ์„ ํƒ: ํ”Œ๋ ˆ์ด์–ด ์„ฑ๊ณผ์— ๊ธฐ๋ฐ˜ํ•œ AI ๊ตฌ๋™ ๋‚œ์ด๋„ ์ง„ํ–‰
  • ์Šค๋งˆํŠธ ํžŒํŠธ ์‹œ์Šคํ…œ: ํ”Œ๋ ˆ์ด์–ด ์‹ค๋ ฅ ์ˆ˜์ค€์— ๋งž์ถฐ ์ ์‘ํ•˜๋Š” ์ปจํ…์ŠคํŠธ ์ธ์‹ ํžŒํŠธ
  • ๋™์  ์นดํ…Œ๊ณ ๋ฆฌ ๋งค์นญ: ์„ฑ๊ณต ํŒจํ„ด์— ๋”ฐ๋ผ ์ตœ์ ์˜ ๋‹จ์–ด ์นดํ…Œ๊ณ ๋ฆฌ๋ฅผ AI๊ฐ€ ์„ ํƒ
  • ์ ์‘ํ˜• ์ ์ˆ˜ ์ฒด๊ณ„: ํ”Œ๋ ˆ์ด์–ด ํ–‰๋™์— ๋งž์ถฐ ์กฐ์ •๋˜๋Š” ๋จธ์‹ ๋Ÿฌ๋‹ ์˜๊ฐ ์ ์ˆ˜ ์‹œ์Šคํ…œ

๊ธฐ์ˆ  ํ•˜์ด๋ผ์ดํŠธ

  • ์ƒํƒœ ๊ด€๋ฆฌ: ์ง€์† ๊ฐ€๋Šฅํ•œ ํ”Œ๋ ˆ์ด์–ด ํ”„๋กœํ•„์„ ๊ฐ–์ถ˜ ๋‹ค์ค‘ ๋ ˆ์ด์–ด ๊ฒŒ์ž„ ์ƒํƒœ
  • ์•Œ๊ณ ๋ฆฌ์ฆ˜ ์„ค๊ณ„: ์„ฑ๊ณผ ๋ถ„์„์„ ํฌํ•จํ•œ ์ ์ง„์  ๋‚œ์ด๋„ ์—”์ง„
  • ํŒจํ„ด ์ธ์‹: ๊ฐœ์ธํ™”๋œ ๊ฒฝํ—˜์„ ์œ„ํ•œ ํ”Œ๋ ˆ์ด์–ด ํ–‰๋™ ๋ถ„์„
  • ๋ฐ์ดํ„ฐ ๊ตฌ์กฐ: ์นดํ…Œ๊ณ ๋ฆฌ๋ณ„ ๋‚œ์ด๋„ ๊ณ„์ธต์„ ๊ฐ–์ถ˜ ํšจ์œจ์ ์ธ ๋‹จ์–ด ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค

์ฃผ์š” ๊ธฐ๋Šฅ

  • ์ •ํ†ต ๋ ˆํŠธ๋กœ ์Šคํƒ€์ผ์„ ๊ฐ–์ถ˜ 6๊ฐ€์ง€ ์‹œ๊ฐ ํ…Œ๋งˆ
  • ์Šค๋งˆํŠธ ์นดํ…Œ๊ณ ๋ฆฌ ์‹œ์Šคํ…œ (๋™๋ฌผ, ์ž์—ฐ, ๊ธฐ์ˆ , ํŒํƒ€์ง€)
  • ์ ์‘ํ˜• ๋‚œ์ด๋„๋ฅผ ํฌํ•จํ•œ ์„ฑ๊ณผ ์ถ”์ 
  • ์˜์กด์„ฑ ์ œ๋กœ โ€“ ์ˆœ์ˆ˜ ๋ฐ”๋‹๋ผ JavaScript

ํ•™์Šต ํฌ์ปค์Šค: ๋ณตํ•ฉ ๋กœ์ง

์ด ํ”„๋กœ์ ํŠธ๋Š” ๋‹ค์Œ์„ ํ†ตํ•ด ๋ณตํ•ฉ ๋กœ์ง ์—ญ๋Ÿ‰์„ ๋ณด์—ฌ์ค๋‹ˆ๋‹ค:

  • ์ ์‘ํ˜• AI ์‹œ์Šคํ…œ: ํ”Œ๋ ˆ์ด์–ด ์„ฑ๊ณผ์— ๊ธฐ๋ฐ˜ํ•œ ๋™์  ๋‚œ์ด๋„ ์กฐ์ •
  • ์ƒํƒœ ๊ด€๋ฆฌ: ์ง€์†์„ฑ์„ ๊ฐ–์ถ˜ ๋ณต์žกํ•œ ๊ฒŒ์ž„ ์ƒํƒœ ์ฒ˜๋ฆฌ
  • ์•Œ๊ณ ๋ฆฌ์ฆ˜ ๊ตฌํ˜„: ์Šค๋งˆํŠธ ๋‹จ์–ด ์„ ํƒ ๋ฐ ํžŒํŠธ ์ƒ์„ฑ
  • ๋ฐ์ดํ„ฐ ๋ถ„์„: ํ”Œ๋ ˆ์ด์–ด ํŒจํ„ด ์ธ์‹ ๋ฐ ํ–‰๋™ ์ ์‘

๊ฒฐ๊ณผ

  • ์„ฑ๋Šฅ: <100โ€ฏKB, ์ฆ‰์‹œ ๋กœ๋”ฉ
  • ํ˜ธํ™˜์„ฑ: ๋ชจ๋“  ์ตœ์‹  ๋ธŒ๋ผ์šฐ์ € ์ง€์›
  • ์‚ฌ์šฉ์ž ๊ฒฝํ—˜: ์ง€๋Šฅํ˜• ๊ธฐ๋Šฅ์ด ๊ฒฐํ•ฉ๋œ ๋งค๋„๋Ÿฌ์šด ๋ ˆํŠธ๋กœ ๊ฒŒ์ž„ ํ”Œ๋ ˆ์ด
  • ์ฝ”๋“œ ํ’ˆ์งˆ: ๊น”๋”ํ•˜๊ณ  ์œ ์ง€ ๋ณด์ˆ˜๊ฐ€ ์‰ฌ์šด ์•„ํ‚คํ…์ฒ˜

๐Ÿš€ PLAY LIVE DEMO

ํ˜„๋Œ€ AI ์ธํ…”๋ฆฌ์ „์Šค๋ฅผ ์ ‘๋ชฉํ•˜๋ฉด์„œ๋„ 90๋…„๋Œ€ ๋ ˆํŠธ๋กœ ๋ฏธํ•™์„ ์ถฉ์‹คํžˆ ์žฌํ˜„ํ•œ ํด๋ž˜์‹ ํ–‰๋งจ์„ ์„ฑ๊ณต์ ์œผ๋กœ ๊ตฌํ˜„ํ–ˆ์Šต๋‹ˆ๋‹ค.

Back to Blog

๊ด€๋ จ ๊ธ€

๋” ๋ณด๊ธฐ ยป

React, GSAP ๋ฐ Tailwind v4๋กœ ํ”„๋ฆฌ๋ฏธ์—„ ๋ฒค๋˜ ์Šคํƒ€์ผ ํฌํŠธํด๋ฆฌ์˜ค ๋งŒ๋“ค๊ธฐ

React, GSAP ๋ฐ Tailwind v4๋ฅผ ์‚ฌ์šฉํ•œ ํ”„๋ฆฌ๋ฏธ์—„ ๋ฒคํ†  ์Šคํƒ€์ผ ํฌํŠธํด๋ฆฌ์˜ค ๊ตฌ์ถ•์„ ์œ„ํ•œ ์ปค๋ฒ„ ์ด๋ฏธ์ง€ https://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover,grav...

2์ฃผ ๋งŒ์— ํ”„๋ผ์ด๋ฒ„์‹œ ์šฐ์„  ํ†ตํ™” ๋ณ€ํ™˜๊ธฐ๋ฅผ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค

The Problem ๐Ÿคฆโ€โ™€๏ธ ๋‚ด๊ฐ€ ์‹œ๋„ํ•œ ๋ชจ๋“  currency converter๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ฌธ์ œ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ์—ˆ๋‹ค: - โŒ ๊ฐ•์ œ signโ€‘ups์™€ email ์ˆ˜์ง‘ - โŒ ์ฟ ํ‚ค๋กœ user behavior ์ถ”์  - โŒ ๋А๋ฆฌ๊ฒŒ ๋กœ๋“œ๋จ ...

์œ„๋Œ€ํ•œ ํ”„๋ก ํŠธ์—”๋“œ ์ „ํ™˜: 2026๋…„๊นŒ์ง€ React์—์„œ Angular๋กœ

์œ„๋Œ€ํ•œ ํ”„๋ก ํŠธ์—”๋“œ ์ „ํ™˜: React โ†’ Angular 2026 ํ”„๋ก ํŠธ์—”๋“œ ํ™˜๊ฒฝ์ด ๊ธ‰๊ฒฉํ•œ ๋ณ€ํ™”๋ฅผ ๊ฒช๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฑฐ์˜ 10๋…„๊ฐ„ React๊ฐ€ ์ง€๋ฐฐํ•œ ๋’ค, Angular๊ฐ€ โ€ฆ