프롤로그 — "저 코딩 1도 모릅니다"
먼저 솔직하게 고백한다.
저는 코딩을 못합니다. JavaScript가 뭔지, React가 뭔지, ffmpeg가 뭔지 지금도 정확히는 모릅니다. 학원도 안 다녀봤고, 책 한 권 끝까지 읽어본 적 없습니다.
근데 이 도구방(https://tools.warun23.com) 사이트에 있는 도구들 — 이미지 압축, 리사이즈, 변환, GIF 만들기, 유튜브 썸네일 분석, 사주 분석까지 — 전부 제가 만들었습니다.
단 한 줄도 직접 코드를 안 짰는데 말이죠.
"사기꾼 아니냐?" 하실 수 있다. 근데 끝까지 읽어보시면 이해되실 겁니다. 그리고 어쩌면 "어, 나도 할 수 있겠는데?" 하는 생각이 드실지도 모릅니다.
이 글이 도움 안 되는 분들
- 코딩 고수, 개발자분들 — 시시한 자랑처럼 보일 수 있습니다. 죄송합니다.
- 디테일한 기술 스택 알고 싶은 분들 — 저도 모릅니다. 못 알려드립니다.
이 글이 도움 될 분들
- 코딩 배우고 싶은데 어디서 시작해야 할지 모르는 분
- "AI로 뭔가 만들 수 있다는데…" 하고 마음만 있는 40~60대 아재·아주머니
- 학원비 부담돼서 못 다니는 분
- 자녀들이 만든 거 보면서 "나도 해보고 싶다" 생각만 하셨던 분
저는 그저 저처럼 시작이 어려웠던 분들께 "이렇게 해보세요" 라고 경험을 나누고 싶을 뿐입니다. 용기 한 스푼이라도 드릴 수 있다면 그걸로 충분합니다.
자, 그럼 본격적으로 시작해봅시다.
1부. 비싼 수업료를 내고 깨달은 진리
처음엔 욕심부렸다가 망했다
처음 AI 코딩 도구를 알게 됐을 때, 저도 다른 사람들처럼 흥분했다. "AI한테 다 시키면 되지 뭐. 요즘 AI 똑똑하다며?"
그래서 Cursor라는 도구 하나만 들고, 다른 프로그램을 한 번에 다 만들어달라고 시켰다. 한꺼번에 욕심을 부린 거다.
결과는?
누더기.
코드가 여기저기 엉켜서 어디부터 손대야 할지 모르는 상태가 됐다. Cursor도 자기가 뭘 만들었는지 헷갈려하기 시작했고, 나는 뭐가 뭔지 더 모르겠고. 결국 그 프로젝트는 갈아엎었다.
교훈 1: AI 혼자한테 다 맡기면 망한다. 그리고 한 번에 다 하려고 욕심부리면 더 망한다.
Claude Code도 써봤는데…
다음엔 Claude Code 데스크탑이라는 걸 써봤다. 솔직히 말하면 코딩 실력은 가히 탑급이다. 내가 한국말로 "이러이러한 거 만들어줘" 하면 정말 척척 만들어낸다.
처음 며칠은 "와… 이게 미래구나" 하면서 감탄만 했다.
문제는 그 다음이었다.
작업이 좀 복잡해지고, 내가 이것저것 묻고, 코드도 길어지면… 토큰 제한이라는 녀석이 등장한다. 한창 신나서 작업하다가 "사용량 한도에 도달했습니다. X시간 뒤에 다시 시도하세요" 메시지가 뜨는 순간, 김이 확 빠진다.
💡 토큰이 뭐냐고요? AI가 한 번에 처리하는 글자 수 단위라고 보면 된다. 내가 길게 묻고, AI가 길게 답하고, 코드까지 주고받으면 토큰이 미친 듯이 빠져나간다. 내 실력이 부족할수록 같은 질문을 여러 번 하게 되니까 토큰은 더 빨리 동난다. 슬프지만 사실이다.
물론 돈을 더 내면 된다. 근데 그게 또 만만찮다. 은퇴한 아재 입장에서 매달 비용이 쌓이는 건 부담이다.
교훈 2: AI는 똑똑하지만, 토큰이라는 족쇄가 있다. 그리고 그 족쇄는 돈으로 풀린다.
그래서 찾은 황금 조합
이리저리 헤매다가 정착한 조합이 바로 이거다.
Cursor Pro ($20/월) + Genspark Plus 또는 Pro
이 두 가지를 협업시키는 방식으로 바꾸니까, 코딩 못하는 아재도 진짜로 도구를 만들 수 있게 됐다. 자세한 협업 방식은 2부에서 풀어드린다.
2부. 내가 찾은 3단 협업 워크플로우 — Claude는 머리, Cursor는 손, 나는 눈과 입
Cursor 오토모드 — 토큰 제한 없는 신세계
Cursor Pro $20/월 요금제에서 오토모드(Auto Mode) 를 켜면, 작업 난이도에 따라 Cursor가 알아서 적절한 에이전트(Claude, GPT 등)를 불러와 일을 시킨다.
쉬운 작업이면 가벼운 모델, 어려운 작업이면 강한 모델. 내가 일일이 "이번엔 Claude로 해줘" "이번엔 GPT로" 할 필요가 없다. 그리고 결정적으로 — 토큰 제한 때문에 작업이 중단되는 일이 거의 없다.
물론 한도가 아예 없는 건 아니다. 빡세게 굴리면 한 번씩 걸린다. 그땐 잠깐 산책 다녀오면 풀려있다. (아재의 산책 시간 확보 효과까지 있다.)
📌 Cursor 요금제 (2026년 5월 기준)
- Hobby: 무료 (제한적)
- Pro: $20/월 ← 제가 쓰는 거
- Pro+: $60/월
- Ultra: $200/월
- 공식: https://cursor.com/pricing
Genspark — 클로드 오푸스 무제한 채팅의 위엄
여기서 진짜 꿀팁 하나 풀고 간다.
Genspark Plus / Pro 요금제를 쓰면 Claude Opus, GPT, Gemini 같은 최상위 AI들과 무제한 채팅이 가능하다. 토큰 신경 안 쓰고, 새벽 3시에 졸린 눈 비비면서 200번 질문해도 끊기지 않는다.
📌 Genspark 공식 정보 (2026년 5월 기준)
- Plus: 약 $19.99/월, 50GB AI Drive
- Pro: 약 $20~25/월, 1TB AI Drive
- Claude Opus, GPT, Gemini 등 모든 AI 에이전트 무제한 채팅 (zero credit cost)
- 2026년 12월 31일까지 보장 (Genspark 헬프센터 공식 명시)
- 공식: https://www.genspark.ai/helpcenter
은퇴한 아재가 새벽까지 코딩 붙들고 있을 때, 토큰 제한 메시지 안 보고 마음껏 물어볼 수 있다는 게 얼마나 큰 축복인지 써본 사람만 안다.
협업 구조 — 누가 뭘 하나
| 역할 | 도구 | 하는 일 |
|---|---|---|
| 🧠 머리 (기획·진단) | Genspark의 Claude Opus | 아이디어 → 요청서 작성, 에러 분석 |
| 🔧 손 (실행) | Cursor (오토모드) | 실제 코드 작성·수정·빌드 |
| 👀 눈·입 (사장님) | 나 | 결과 확인, 스크린샷, 복붙 |
3단 협업 워크플로우 — 핑퐁의 미학
자, 이제 본론. 내가 어떻게 일을 시키냐.
1단계. 젠스파크에서 Claude한테 기획 → 요청서 받기
"GIF 변환 도구 만들고 싶어. 동영상 올리면 GIF로 바꿔주는 거."
이렇게 던지면 Claude가 척척 정리해서 Cursor한테 보낼 요청서 (Request Spec) 를 만들어준다. 단계별로, 파일명까지 박아서.
2단계. 요청서 통째로 복사 → Cursor에 붙여넣기
Cursor 오토모드를 켜놓고 그 요청서를 그대로 붙여넣는다. 그러면 Cursor가 알아서 파일을 만들고 코드를 짠다. 가끔 Cursor가 똑똑하게 "이 부분은 A로 할까요 B로 할까요?" 하고 되묻는다.
3단계. Cursor가 물어본 거 → 젠스파크에 다시 붙여넣기
여기가 핵심이다. Cursor가 의문을 던지면, 그걸 그대로 복사해서 젠스파크 채팅창에 붙여넣는다. 그러면 Claude가 "B가 좋겠습니다. 이유는…" 하고 답을 준다. 그 답을 다시 Cursor에 붙여넣는다.
4단계. 브라우저에서 결과 확인 → 스크린샷 → 젠스파크
코드가 완성되면 내가 직접 브라우저에서 새로고침하고 동작시켜본다. 안 되면? 스크린샷 찍어서 젠스파크에 던진다. "이렇게 나오는데 뭐가 문제야?"
Claude가 화면 캡처를 보고 진단을 내려준다. "콘솔에 ffmpeg load failed라는 에러가 있네요. 이건 webpack 설정 문제로 보입니다…" 그 진단을 또 Cursor에 던진다.
이 핑퐁이 끝없이 반복된다. 나는 그저 복사·붙여넣기·새로고침·스크린샷의 4단 콤보를 무한 반복하는 사장님일 뿐이다.
왜 Cursor 혼자서는 안 될까?
이게 좀 의외인 부분인데, Cursor는 자기 손에 있는 코드만 본다. 큰 그림은 못 본다.
예를 들어 "라이브러리 버전이 안 맞아서 안 되는 거예요"라는 진단은 Cursor 혼자서는 잘 못 내린다. 자기 일에 너무 몰입해서 그렇다. 반면 Claude(Genspark)는 한 발 떨어져서 "이거 ffmpeg 0.12 버전 호환성 이슈 같은데?" 같은 거시적 진단을 잘 해준다.
Claude = 컨설턴트, Cursor = 실무자, 나 = 두 사람 사이 메신저 겸 결재라인.
회사 다닐 때 부장님들이 "야 이거 김 과장한테 갖다 줘" 하던 거랑 똑같다. 차이가 있다면 내가 부장이자 메신저라는 것 뿐. 슬프지만 효율적이다.
작은 비밀: 요청서가 협업의 90%다
이 워크플로우의 핵심은 사실 '요청서를 잘 받는 것' 이다.
Claude가 만들어주는 요청서는 단순한 지시문이 아니다.
- 어떤 파일을 만들지
- 어떤 함수가 필요한지
- 제약 조건 (예: "디자인 시스템 건드리지 말 것")
- 검증 방법 (예: "npm run build 통과 확인")
- 커밋 메시지까지
이게 명확할수록 Cursor가 헷갈리지 않고 정확하게 작업한다. AI한테 일 시킬 때 "알아서 잘 해줘"는 망하는 지름길이다. 사람도 마찬가지지만.
3부. 실전 삽질기 — GIF 도구 3일간의 사투
시작은 창대했다
이미지 압축 도구, 리사이즈 도구, 변환 도구까지 만들어보고 자신감이 붙었다. "이 정도면 동영상도 한번 건드려볼까?"
GIF 변환 도구. 동영상 올리면 GIF로 바꿔주는 거. 쿠팡 셀러나 스마트스토어 셀러들이 상세 페이지에 짧은 GIF 넣는 거 많이 봤지 않나. "이거 수요 있겠는데?" 하는 직감이 왔다.
Claude한테 기획안 받고, Cursor한테 던지고, 며칠이면 끝날 줄 알았다.
순진했다.
1일차: "이게 왜 안 돼?"
UI까지는 술술 만들어졌다. 업로드 박스도 예쁘게 뜨고, 동영상 미리보기도 잘 나오고, 자르기 슬라이더도 부드럽게 움직인다.
"오 다 됐네! 이제 변환 버튼만 누르면…"
변환 버튼 클릭 → 아무 일도 안 일어남.
콘솔(F12)을 열어봤다. 빨간 글씨 한 줄.
Can't resolve
<dynamic>
이게 뭔 소리야. 영어 잘하는 아재가 봐도 모르겠다. 일단 스크린샷 찍어서 젠스파크에 던졌다.
Claude의 진단: "Next.js 16의 기본 번들러인 Turbopack이 @ffmpeg/ffmpeg 라이브러리의 동적 import를 분석하지 못해서 그렇습니다. Webpack으로 바꿔서 빌드해보세요."
💡 ffmpeg.wasm이 뭐냐고요? 동영상을 다루는 프로그램이라고 보면 된다. 원래는 컴퓨터에 따로 깔아서 쓰는 건데, 그걸 브라우저 안에서 돌아가게 만든 게 ffmpeg.wasm이다. 즉, 사용자 컴퓨터에서 직접 변환이 이뤄지니까 서버 비용도 안 들고 개인정보도 안 새는 효자 라이브러리다. 그런데 이놈이 까다롭다.
2일차: "또 왜 안 돼?"
Webpack으로 바꿨더니 빌드는 성공. 의기양양하게 브라우저 새로고침.
ffmpeg load failed: Cannot find module 'blob:http://localhost:3000/...'
또 빨간 글씨. 이번엔 처음 보는 에러다. 또 스크린샷, 또 젠스파크.
Claude: "이건 라이브러리 버전 호환성 문제로 보입니다. @ffmpeg/ffmpeg를 0.12.10으로, @ffmpeg/core는 CDN의 0.12.6 버전으로 다운그레이드해보세요."
다운그레이드? 그게 뭐 어떻게 하는 건데? 어차피 내가 직접 안 한다. 요청서 받아서 Cursor에 던지면 끝.
Cursor가 패키지 버전을 바꾸고, 코드를 손보고, 빌드 통과까지 알아서 해줬다.
새벽 1시. 브라우저 새로고침. 콘솔에 마침내…
[ffmpeg] toBlobURL start (core js)
[ffmpeg] toBlobURL done (core js)
[ffmpeg] toBlobURL start (wasm)
[ffmpeg] toBlobURL done (wasm)
[ffmpeg] load start
[ffmpeg] load done ← 이거!!!!
"이게 뜨네!!!"
혼자 키보드 앞에서 박수쳤다. 옆에서 자던 와이프가 깰까봐 손바닥으로만 살살. 변환 엔진 준비 완료. 이제 진짜 GIF만 만들면 된다.
3일차: "마지막 한 방"
동영상 업로드, 자르기, "GIF 만들기" 버튼 클릭.
Conversion failed!
…………
3일째 되니까 화도 안 났다. 그냥 또 스크린샷 찍었다. 이젠 의식처럼.
Claude: "ffmpeg가 palette.png 파일을 만들 때 -update 1 플래그를 빼먹어서 에러가 났습니다. 최신 ffmpeg 버전에서는 단일 PNG 파일을 쓰려면 이 플래그가 필수입니다."
뭔 소린지는 모르겠지만 일단 Cursor에 던졌다. Cursor가 한 줄 추가했다.
새로고침. 동영상 업로드. "GIF 만들기" 클릭.
변환 중...
[gif] palettegen done
[gif] paletteuse done
✅ 변환 완료! 3.87 MB · 480×266
됐다.
다운로드 버튼 누르니까 파일이 떨어진다. 윈도우 사진 앱으로 열어보니까 GIF가 빙글빙글 움직인다.
3일 동안 매달린 게 결국 1.2초짜리 움직이는 그림 한 장이었다. 근데 그게 그렇게 예뻐 보일 수가 없었다.
이 삽질에서 배운 것들
1. "에러 메시지는 죄인이 아니라 안내문이다"
처음엔 빨간 글씨만 봐도 가슴이 철렁했다. 지금은 안다. 빨간 글씨는 AI한테 보여주라고 친절하게 띄워주는 안내문이다. 캡처해서 던지면 Claude가 알아서 해석해준다.
💡 꿀팁: F12 누르고 Console 탭 열어서 빨간 글씨 전체 캡처. 그거 하나만 잘해도 50%는 먹고 들어간다.
2. "한 방에 만들려고 하지 마라"
내가 예전에 Cursor 단독으로 다른 프로그램 만들 때 욕심부려서 한꺼번에 다 시켰다가 코드가 누더기가 됐다.
이번 GIF 도구는 5단계로 쪼개서 진행했다. 카테고리 UI → 업로드 UI → 자르기 UI → 변환 엔진 → 다운로드. 각 단계마다 검증하고 푸시했다. 그러니까 어디서 망가져도 어디로 돌아가야 할지 알 수 있었다.
3. "검증 안 한 코드는 푸시하지 마라"
Cursor가 "완료했습니다" 라고 해도 그건 "빌드가 통과됐다" 는 뜻이지 "브라우저에서 잘 돌아간다" 는 뜻이 아니다.
빌드 통과 ≠ 동작 확인.
이거 모르고 푸시했다가 라이브 사이트 망친 경험, 한 번이면 족하다. 지금은 무조건 로컬 브라우저에서 확인하고 푸시한다.
4. "AI도 가끔 헛소리를 한다"
Claude도, Cursor도 100% 정답을 주는 건 아니다. 가끔 잘못된 해결책을 내놓는다.
그땐 어떻게 하냐고? 다시 묻는다. "이거 해봤는데 안 됐어. 다른 방법 없어?" 그러면 또 다른 답을 준다. 사람이랑 똑같다.
결과물: 진짜 작동하는 도구
이렇게 만든 GIF 변환 도구는 지금 https://tools.warun23.com/tools/gif/from-video 에서 누구나 무료로 쓸 수 있다.
심지어 만들고 나서 Google Search Console에 등록까지 마쳤다. 사이트맵에 모든 도구 페이지 자동 포함되도록 설정해서, 앞으로 새 도구 만들 때마다 자동으로 검색엔진에 노출된다.
코드 한 줄 안 짠 아재가 만든 결과물치고는 나쁘지 않지 않나?
에필로그 — 마음만 있다면 충분합니다
이 글을 끝까지 읽으신 분들께 솔직하게 말씀드리고 싶다.
저는 코딩 못합니다. JavaScript가 뭔지, React가 뭔지, ffmpeg가 뭔지 지금도 정확히는 모릅니다. 그냥 "Claude한테 물어보면 알려주겠지" 하는 마음으로 시작했고, "Cursor한테 시키면 만들어주겠지" 하면서 여기까지 왔습니다.
이 도구방에 있는 모든 도구들 — 이미지 압축, 리사이즈, 변환, GIF 만들기, 유튜브 썸네일 분석, 사주 분석까지 — 전부 같은 방식으로 만들었습니다. 단 한 줄도 직접 안 짰습니다.
"그럼 너 사기꾼 아니냐?"
라고 하실 수도 있다. 근데 생각해보세요.
- 자동차 만드는 법 모르는데 자동차 운전하잖아요.
- 카메라 만드는 법 모르는데 사진 잘 찍잖아요.
- 빵 굽는 법 모르는데 맛있는 빵 잘 찾아 먹잖아요.
AI를 도구로 쓰는 것도 똑같습니다. 만드는 사람과 쓰는 사람은 다릅니다. 우리는 그저 잘 쓰면 됩니다.
시작하려는 분들께
마음만 있고 코딩 못해서 못 했던 분들, 사이트 만들어보고 싶었는데 학원비가 부담돼서 못 갔던 분들, 자녀들이 만든 거 보면서 "나도 해보고 싶다" 생각만 하셨던 분들.
진짜로 됩니다.
은퇴한 아재가, 새벽에 졸린 눈 비비면서, 와이프 깨울까봐 손바닥 박수 치면서, 결국 만들었습니다.
준비물은 세 가지면 충분합니다.
- Cursor Pro ($20/월)
- Genspark Plus 또는 Pro ($20~25/월)
- 포기 안 하는 마음 (무료)
월 5만 원 정도면 학원 한 달 등록비도 안 됩니다. 그 돈으로 진짜 작동하는 사이트를 만들 수 있습니다.
마지막 한마디
이 글이 코딩 고수분들께는 시시한 자랑처럼 보일 수 있습니다. 그분들껜 죄송합니다. 이 글은 저처럼 시작이 어려웠던 분들을 위한 글입니다.
저도 처음엔 무서웠습니다. F12 누르는 것도 무서웠고, 빨간 에러 메시지 보면 심장이 떨렸습니다. 지금은 빨간 글씨가 친구처럼 느껴집니다. (가끔 미운 친구지만요.)
여러분도 분명히 할 수 있습니다.
천천히, 한 단계씩, 욕심부리지 말고, AI랑 친해지면서.
도구방 사장 드림.
📌 다음 글은요? 솔직히 모릅니다 ㅋㅋㅋ
지금 도구방 도구들 채워 넣느라 바쁘거든요. 코딩(이라 쓰고 AI 부려먹기라 읽는다)에 몰두하다 보면 글 쓸 시간이 영영 안 날 수도 있고요.
그래도 틈날 때마다 끄적여 볼 생각입니다. 새벽에 ffmpeg 디버깅하다가 빡쳐서 글로 푸는 날이 올 수도 있고요.
그러니까 다음 글은 "언젠가, 틈나면, 아재 컨디션 봐서" 입니다. 기대는 살짝만 해주세요. 부담되니까요.