AI 와 대화하며 완성한 풀스택 한글 학습 게임
요약
AI 기반의 풀스택 앱 빌더인 MeDo를 사용하여 한글 학습 미니 게임 'Hangul Drop'을 개발한 과정을 소개합니다. 사용자는 복잡한 코딩 과정 없이 자연어 프롬프트만으로 프론트엔드 UI, 백엔드 API, 데이터베이스 통합, 인증 등 전체 애플리케이션 구조를 구축할 수 있습니다. 이 글은 MeDo의 기능과 함께, AI와의 대화형 개발 워크플로우가 전통적인 개발 방식과 어떻게 다른지 구체적으로 보여줍니다.
핵심 포인트
- MeDo는 자연어 설명만으로 풀스택 앱(프론트엔드, 백엔드, DB, 인증 등)을 생성하는 AI 기반 빌더이다.
- 복잡한 게임 로직(점수 계산, 하트 시스템, 리더보드 등)까지도 단일 프롬프트로 구현할 수 있었다.
- MeDo는 개발 과정 전반에 걸쳐 대화형 컨텍스트를 유지하며 앱을 자연스럽게 개선하고 통합한다.
- 이러한 AI 기반 워크플로우는 전통적인 개발 방식 대비 개발 속도와 효율성 면에서 혁신적이다.
몇日前,I decided to experiment with an AI-powered full-stack app builder called MeDo. Instead of manually wiring up frontend components, backend APIs, databases, authentication, and deployment, MeDo lets you build applications conversationally -- kinda like pair programming with an AI engineer that already understands your project context and readily updates said context as you progress your conversation with it.
To test how capable it really was, I built Hangul Drop, which is a mini-game for learning to read Korean Hangul. And surprisingly… most of the app came from natural language prompts.
In this post, I'll walk through:
- What MeDo actually is
- How I built the game
- How MeDo handled backend integration automatically
- Using plugins for AI-generated content
- What the workflow feels like compared to traditional development
What is MeDo?
MeDo is an AI-powered full-stack app builder. You describe what you want in plain English, and MeDo generates:
- Frontend UI
- Backend APIs
- Database integration
- Authentication
- Application logic
- Asset generation
- Deployment-ready structure
It also maintains conversational context throughout development, so you can continue refining your app naturally over time.
The official quick start docs are here: MeDo Documentation
The Goal: Build a Hangul Learning Game
The concept was simple: Hangul character cards fall from the top. The player types the romanized pronunciation. Correct answers destroy the cards. Missing cards costs hearts. Higher combos increase score. Global leaderboards track players.
I also wanted the entire game themed around traditional Korean Hwatu cards.
Normally, building this would involve:
- Setting up a game framework
- Creating backend APIs
- Managing score persistence
- Designing a database schema
- Wiring leaderboard queries
- Creating UI systems
- Handling deployment
Instead, I started with a single prompt.
Starting With One Prompt
This was my initial instruction to MeDo:
Create a mini game for learning to read Korean Hangul. During a game, blocks of Hangul characters will come from the top. Typing out the romanization of the characters will result in them being destroyed, increasing the player score. If a character makes it to the bottom it reduces the player's hearts, of which they have three. When the player loses all their hearts, the game is over. Then the player can choose to put their score in the leaderboard arcade style by typing out their name. Score is then recorded in the leaderboard. Where they can compare other players scores.
Visual notes: Style everything like the classic Korean game Hwatu
What surprised me most was not just that it generated a UI. It generated an actual working game. Including:
- Gameplay systems
- Input handling
- Score logic
- UI states
- Backend leaderboard support
- Database integration
Backend Integration Was Automatic
One of the most interesting parts of the experience was backend generation. MeDo automatically handled the backend stack setup using Supabase. That included:
- Database tables
- API integration
- Leaderboard persistence
- Score storage
- Queries
- Environment configuration
Normally this is the part that slows down hobby projects the most. Instead of manually creating schemas or wiring REST endpoints, MeDo simply generated and connected everything as part of the conversation.
I didn't even need to leave the chat interface.
Iterating Felt Like Talking to a Teammate
Once the first version existed, improving it bec
매우 빠릅니다. 예를 들어, 게임 플레이 테스트 후 패배했을 때 플레이어에게 회복 시간이 필요하다는 것을 깨달았습니다. 그래서 저는 단순히 이렇게 말했습니다: '플레이어가 회복할 기회를 주려면, 하트를 잃은 후 현재 캐릭터를 떨어뜨리는 것을 초기화해야 합니다. 플레이어가 다시 상황을 파악할 수 있도록.' 그 정도만으로도 충분했습니다. MeDo 는 이에 따라 게임 플레이 로직을 업데이트했습니다. 파일을 검색하거나 시스템을 수동으로 추적하거나 컨텍스트 전환을 하지 않았습니다. 대화형 반복 (conversational iteration) 만이었습니다.
MeDo 는 또한 컨텍츄얼하게 기능 제안을 합니다. 예상치 못했던 것은 프로젝트가 진화함에 따라 MeDo 가 얼마나 능동적으로 되는 것입니다. 게임이 성숙해짐에 따라, 현재 앱 상태에 기반하여 관련 개선 사항을 제안하기 시작했습니다. 예를 들어:
- 사운드 효과 추가
- 피드백 애니메이션 개선
- 콤보 효과 추가
- 전이 (transition) 향상
사운드 효과 제안을 받아들였을 때, MeDo 는 Phaser 를 사용하여 오디오를 통합하고 게임 플레이 전반에 걸쳐 컨텍츄얼하게 사운드를 연결했습니다. 잘못된 입력? 오류 사운드. 성공적인 파괴? 긍정적 피드백 사운드. 콤보 스트릭? 향상된 효과.
놀라운 점은 단순히 사운드를 추가하는 것이 아니라, 게임 루프에서 어디에 속해야 하는지 이해하는 것입니다.
플러그인을 사용하여 일일 콘텐츠 생성 (Daily Content Generation)
핵심 게임 플레이가 작동한 후, 게임을 신선하게 유지할 방법을 원했습니다. 이것이 MeDo 의 플러그인 시스템이 매우 유용해진 곳입니다. 내장된 LLM 플러그인 지원 kullanarak Daily Theme 시스템을 만들었습니다. 매일:
- 새로운 테마가 생성됨
- 테마별 어휘 세트가 생성됨
- 게임 내에서 테마별 사전이 나타남
- 해당 테마에 전용 리더보드 (leaderboard) 가 연결됨
예를 들어: 신체부위, 수송, 자연, 일상, 기술 등. 플레이어는 다음 테마가 교체되기 전에 해당 테마의 리더보드에서 1 일만 점수를 올릴 수 있습니다.
플러그인 통합은 놀랍게 간단했습니다. MeDo 워크플로우에서 가장 좋아한 것은 설정이 얼마나 적은지입니다. MeDo 내부에서 단순히:
- 플러그인 메뉴 열기
- LLM 플러그인 선택
- 기능을 자연스럽게 설명하기
MeDo 는 다음을 생성했습니다: - 플러그인 호출 프롬프트 구조
- 데이터 흐름
- 통합 로직
프롬프트 파이프라인을 수동으로 엔지니어링할 필요가 없었습니다. 이 추상화 레이어는 실험을 매우 빠르게 만들었습니다.
개발 워크플로는 다르게 느껴졌습니다. 이 프로젝트에서 가장 눈에 띄었던 것은 전통적인 개발과 비교하여 워크플로스가 어떻게 다른지입니다. 일반적으로 풀스택 앱을 구축하는 것은 다음을 조우해야 합니다:
- 프론트엔드 코드
- 백엔드 서비스
- 데이터베이스 마이그레이션
- API 계약
- 호스팅
- 상태 관리
- 인프라 설정
MeDo 와는 대조적으로, 대부분의 것이 대화형 (conversational) 이 되었습니다. 개발 과정은 다음에 더 가깝게 느껴졌습니다: - 의도 설명
- 행동 정제
- 디자인 방향 유도
매뉴얼로 모든 시스템을 구현하는 것이 아니라.
배운 점
이것은 AI 네이티브 풀스택 빌더를 본격적으로 사용한 첫 번째 경험이며, 프로토타이핑 방식에 대한 사고를 바꾸었습니다. 가장 큰 깨달음: AI 도구는 프로젝트에 지속적으로 이해할 때 상태lessly 응답할 때보다 훨씬 강력해집니다. MeDo 는 앱 전반에 걸쳐 컨텍스트를 유지하기 때문에:
- 기존 시스템 개선
- 의미 있는 추가 제안
- 디자인 일관성 보존
- 아키텍처 재설명 없이 기능 통합
이러한 지속적인 흐름은 경험을 AI 를 프롬프트하는 것보다 기술적 팀원 (teammate) 과 협력하는 것과 더 비슷하게 느끼게 합니다. 브리핑할 필요가 없는 팀원이며, 종종 당신보다 더 많이 알고 있습니다.
최종 생각
Hangul Drop 은 MeDo 를 테스트하기 위한 작은 실험으로 시작했습니다. 대신, 온라인 리더보드, 백엔드 지속성, 테마별 콘텐츠 생성을 갖춘 genuinely playable 풀스택 게임이 되었습니다.
대화형 오디오 시스템, 동적 게임플레이, 일일 AI 생성 과제 등 모든 것이 대화로 주축을 이루고 있습니다. 본인이 직접 AI 네이티브 애플리케이션 개발을 실험하고 싶다면: MeDo 를 여기에서 시도해 보세요: https://medo.dev/ 문서를 여기에서 읽으세요: https://intl.cloud.baidu.com/en/doc/MIAODA/s/quick-start-en 아이디어와, 특히 코딩 경험이 거의 없거나 없는 경우, 실제 작동하는 소프트웨어 사이의 간극은 매우 빠르게 줄어드는 추세입니다!
AI 자동 생성 콘텐츠
본 콘텐츠는 Dev.to AI tag의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기