PROJECT PRESENTATION

My
Vocab

비전공자가 아이디어 하나로
앱을 만들어 구글 플레이까지 배포한 이야기

OPIc · 면접 영어 단어장 앱 · 2026
로그인 화면
1 / 11
Project Overview

한 줄 요약

"OPIc 영어 단어를 AI가 자동으로 만들어주고,
퀴즈로 복습하는 모바일 앱"
5
핵심 탭
6+
외부 기술 연동
5+
해결한 버그
1
개발자 (혼자)
➕

단어 추가

AI가 발음·뜻·예문 자동 생성

📖

단어장

저장·검색·외운 단어 체크

🎯

퀴즈

랜덤 문제로 복습

🥑

아보카도

학습 동기부여 캐릭터

2 / 11
Why

왜 만들었나요?

불편함 발견

OPIc 시험을 준비하면서 단어를 정리하는데 시중 앱들이 불편했다.
원하는 단어를 직접 추가하고, 발음·뜻·예문을 한 번에 보고 싶었다.

아이디어 구체화

"AI가 단어 정보를 자동으로 만들어주면?" →
ChatGPT 같은 AI API를 앱에 연결하면 가능하다는 것을 알게 됐다.

직접 만들기로 결심

비전공자지만 "없으면 내가 만들면 되지 않을까?"라는 생각으로 시작.
앱 개발 도구를 찾아보다가 React Native + Expo를 선택.

목표 설정

단순히 내가 쓸 앱이 아닌, 구글 플레이 스토어에 실제로 배포하는 것을 목표로.

3 / 11
How · 비전공자 설명

어떤 도구를 어떻게 썼나요?

도구실제 역할비유로 설명하면
React Native앱을 만드는 핵심 언어Android·iOS 두 플랫폼을 설계도 하나로 동시에 제작하는 도구
Supabase회원가입·로그인·서버계정 관리를 맡아주는 외주 직원 — 서버를 직접 운영하지 않아도 됨
Google Gemini AI단어 정보 자동 생성ChatGPT처럼 단어의 발음·뜻·예문을 AI가 대신 써줌
EAS Build앱 파일(AAB) 만들기복잡한 공장 설비 없이 클라우드 공장에 맡겨 완성품 받기
Cloudflare Pages웹 버전 배포앱을 웹사이트로도 접속할 수 있게 인터넷에 올려두는 창고
4 / 11
Live Screenshots

실제 앱 화면

로그인
로그인
단어 추가
AI 단어 추가
단어장
단어장
퀴즈
퀴즈
아보카도
아보카도 룸
리더보드
리더보드
5 / 11
Features

주요 기능 소개

🤖 AI 단어 생성

단어 하나만 입력하면 AI가 발음기호 · 품사 · 한국어 뜻 · 영어 뜻 · 예문을 자동으로 만들어줍니다.

📚 나만의 단어장

저장한 단어들을 알파벳 순 정렬·카테고리 필터·검색으로 관리합니다. 인터넷 없이도 사용 가능합니다.

✏️ 퀴즈 모드

저장한 단어 중 랜덤 출제, 카테고리 선택, 학습 진행률을 확인하며 실전처럼 복습합니다.

🥑 아보카도 캐릭터

단어 추가·퀴즈를 풀면 코인을 지급합니다. 방 꾸미기·가구 배치로 게임처럼 동기부여합니다.

웹에서 직접 체험: https://myvocab.pages.dev

6 / 11
Challenges

어려웠던 점들

처음 해보는 앱 개발이라 예상치 못한 문제들이 연달아 터졌습니다.

💥

빌드 자체가 안 된다

코드는 맞는데 "빌드 오류"로 앱 파일이 만들어지지 않았습니다. 영어 오류 메시지를 해석하는 것부터가 도전이었습니다.

🔥

앱이 켜지자마자 꺼진다

빌드는 성공했는데 폰에 설치하면 실행 즉시 종료. 원인조차 알 수 없어 가장 막막했던 순간이었습니다.

🔐

보안 설정의 함정

API 키를 외부에 노출되지 않게 숨겼더니, 반대로 앱도 그 키를 못 읽어서 크래시가 발생했습니다.

"오류 메시지는 영어로, 원인은 숨어있고, 해결책은 찾아야 하는 상황이 반복됐습니다."
7 / 11
Problem Solving

어떻게 이겨냈나요?

🔴 문제

14개 라이브러리가 서로 충돌해 빌드 불가 — 오류 메시지만 50줄

→

🟢 해결

오류 내용을 분해해 "현재 앱에서 쓰지 않는 라이브러리"를 파악 후 14개 일괄 삭제

🔴 문제

앱 설치 직후 즉시 종료 — 화면조차 뜨지 않음

→

🟢 해결

로그를 분석해 "서버 주소가 undefined" 파악 → 환경변수를 빌드 설정 파일에 직접 주입

🔴 문제

보안을 위해 API 키를 숨겼더니 빌드 서버도 읽지 못해 앱 크래시

→

🟢 해결

"숨기되, 빌드 서버에만 전달"하는 구조로 분리 — 보안과 동작 모두 충족

"해결책을 몰라도 문제를 정확히 정의하면 답을 찾을 수 있었습니다."
8 / 11
Learnings

이 프로젝트에서 배운 것

기술적으로 배운 것

하나의 코드, 세 개의 플랫폼
React Native 한 벌로 Android · iOS · 웹을 동시에 배포할 수 있다는 것

AI API 연동
복잡해 보이는 AI 기능도 API 호출 몇 줄로 앱에 붙일 수 있다는 것

보안과 배포
키를 숨기는 방법, 서명 인증서, 스토어 심사 과정 — 배포의 현실

더 중요하게 배운 것

"완성"이 "완벽"보다 중요하다
처음부터 완벽하려다 멈추는 것보다, 일단 돌아가는 것을 만들고 개선하는 것이 낫다

문제를 작게 쪼개기
거대한 오류도 "어디서 무슨 이유로"를 분해하면 해결 가능해진다

사용자 = 나 자신
직접 OPIc을 공부하는 사람으로서 "진짜 필요한 기능"이 무엇인지 알고 있었다

9 / 11
Job Relevance

이 경험이 직무에서 어떤 의미인가요?

개발 직무가 아니더라도, 이 프로젝트는 아래 역량을 증명합니다.

🔍

문제 정의 능력

막연한 불편함을 구체적인 기능 요구사항으로 정리하고, 해결 방향을 설계했습니다.
→ 기획·분석·컨설팅 직무에 직결

🚀

아이디어 → 실물 실행력

생각에서 멈추지 않고, 실제로 배포되는 서비스를 완성했습니다.
→ "해보는 사람"의 증명

📖

빠른 학습 능력

비전공자로서 처음 접하는 기술 6종을 독학으로 익혀 실제 서비스에 적용했습니다.
→ 새로운 환경·도구에 빠르게 적응

💡

끈기와 문제해결

수십 개의 오류와 맞닥뜨렸지만 포기하지 않고 원인을 분석해 모두 해결했습니다.
→ 어떤 직무든 필요한 기본기

문제 정의 실행력 자기주도 학습 끈기 사용자 관점 기술 수용 능력 데이터 구조 이해 보안 감각
10 / 11
🥑

"없으면
직접 만들었습니다"

비전공자로서 불편함을 발견하고, 아이디어를 구체화하고, 수많은 오류를 넘어 실제 서비스로 배포하는 과정 전체가 저의 문제해결 방식입니다.

WEB
https://myvocab.pages.dev
STORE
Google Play 심사 중
감사합니다
11 / 11