1. 배경: "뇌 빼고 Yes만 외치다 망했습니다"
솔직히 말하자면, 저는 그동안 복붙으로 연명하는 바이브 코더에 가까웠습니다. 그런데 이번 사내 워크샵에서 Claude Code에 대해 더 자세히 배우고 나니 자신감이 폭발했습니다. /init이니 /resume이니, 터미널에서 명령어 몇 번 치면 다 될 것 같았거든요.
그래서 야심 차게 "강사와 운영진을 위한 교육 과정 링크 관리 대시보드"를 완성해야겠다고 다짐했습니다. Claude가 6단계 기획안을 짜줬고, 저는 신나서 Phase 1부터 3까지 내용을 보지도 않고 "Yes, Yes, Yes!"만 눌렀습니다.
Python 코드 편집기의 스크린샷
결과는? 대참사였습니다. 클로드를 너무 믿었던 걸까요? 실행되는 건 하나도 없고 에러만 무한 반복.
간단한 웹앱을 만드는거니까 오류가 전~혀 안 날 거라고 생각했는데 ㅎㅎ 제 착각이었어요.
2. 해결 내용: "Lindy로 뼈대 잡고, Claude로 영혼 불어넣기"
맨땅에 헤딩은 그만! 전략을 바꿨습니다.
Lindy AI로 일단 눈에 보이는 UI, 최소한의 기능이 동작하는 페이지를 만들고,
Claude Code로 심폐소생술을 하는 하이브리드 전략입니다.
제가 쓴 이전 글(https://www.gpters.org/marketing/post/iljalreo-lindyneun-build-apps-gineungdo-isseoyo-cunggyeogjeogin-gyeolgwamul-Q88zWfRI24V6xjt)을 참고하셔도 좋습니다.
사용 Tool & 워크플로우는 아래와 같습니다.
Lindy AI: 이 친구가 알잘딱깔센 만들어준 예쁜 첫 단추 페이지를 → GitHub에 코드 업로드 시킴
Supabase: DB 연결 및 인증 처리
Vercel: 냅다 배포
Claude Code (Web): GitHub 연동해서 본격적인 기능 구현 및 디버깅
이런 식으로 결과물 계속 봐가면서 작업했습니다!
터미널도 좋지만, 웹 버전을 쓴 이유는 사진 첨부가 편하고, 휴대폰으로도 작업이 가능했기 때문입니다. (퇴근길 지옥철에서 노트북 안 열고 명령 가능)
클라우드 코드 대시보드의 스크린 샷
만약 기능 구현하다가 꼬인다 싶으면? (이게 맞는진 모르겠지만)
냅다 새 채팅창 열어서 신선한 뇌를 가진 Claude에게 일을 시키면서 병렬적으로 작업했어요.
다만 새로운 기능을 추가해야해서 Supabase DB에 새로운 테이블을 생성해야할때는,
제가 직접 SQL Editor 들어가서 쿼리를 실행 해주어야 했어요.
마이그레이션인지 뭔지 당연히 처음 해봤고요. 그래도 하라는대로 했더니 어렵지는 않았습니다.
3. 솔루션 결과: (감동)
그렇게 여러 삽질 끝에 얻어낸 결과물 ... 감동 그 자체였습니다.
제가 구현한(사실 Claude가 다 한) 기능 리스트를 보면 너무 뿌듯합니다.
최종 구현 기능 리스트
: 그 어떤 것도 ‘저절로’ 된 건 없거든요. 하나하나 손맛을 느끼며(?) 수정하고 조립한 결과물입니다.
(1) 권한별 대시보드: 운영진 vs 강사 로그인 시 다른 화면 노출
테스트하려고 강사 계정으로 로그인하다가 스팸보다 무서운 ‘매직링크 지옥’을 경험했어요 ...
(2) 캘린더 다중 선택 기능 (날짜 뚝뚝 떨어져 있어도 OK)
(3) 강사 정보 입력 개선
- 기존 강사 목록을 드 롭다운으로 재활용
(4) 드래그 앤 드롭(DND)으로 링크 순서 변경 가능
(5) 캘린더 뷰 기능 구현
(6) 휴지통 기능 - 15일 후 자동 영구 삭제
(7) 실시간 알람 기능 - 운영진이 내용 수정하면 강사 대시보드 우측 상단 🔔 아이콘에 '불' 들어옴. 강사가 링크를 추가하거나 삭제하면 운영진에게 알람이 감.
(8) 다중 필터 기능
4. Lesson Learned: "이 정도면 저, 개발자(진) 아닌가요?"
이번 프로젝트를 통해 배운 점은 명확합니다.
Plan Mode 맹신 금지: AI가 계획을 세워도, 사람이 읽고 검토해야 한다. (Phase 1부터 차근차근!)
모로 가도 서울로 가면 된다: Lindy AI로 UI 잡고 Git 연동하고 Vercel 배포한 다음 Claude Code로 기능 추가하는 것도 나쁘지 않아요. (대신 Lindy로 첫 단추 메울 때 기술스택은 지정해주는 게 좋습니다 ㅎㅎ)
다 준다는 마인 드: 오류가 발생했을 때 최대한 자세하게 적어야합니다.
줄게 줄게 모든 걸 줄게
앞으로의 계획은 이 대시보드를 강사님들께 공유해서 피드백을 받아보는 것입니다.
덧) 저희 팀 똘똘이 개발자분께서 Supabase DB 권한 신경써야한다고 알려주셨어요!
혹시 저처럼 바이브코딩으로 Supabase 연동하실거면 이 부분 꼭 주의하시길.
읽어주셔서 감사합니다 ❤️
