알고노트 출시 후기 — 바이브코딩으로 서비스 런칭까지

결론부터: 사이드 프로젝트, 진짜 출시까지 갔습니다

2026년 2월, 알고노트(Algonote)를 정식 출시했습니다. 알고리즘을 단계별로 시각화해서 학습하는 플랫폼이며, 웹과 안드로이드 앱을 동시에 출시했습니다.

핀테크 회사에서 11년 넘게 백엔드 개발을 하면서 "사이드 프로젝트를 해보고 싶다"는 생각을 수백 번은 했을 것입니다. 하지만 이번에는 실제로 시작했고, 실제로 출시까지 완료했습니다. 그 과정에서 느낀 점을 공유하겠습니다.

왜 알고리즘 시각화였는가

코딩 테스트를 준비하면서 항상 느꼈던 것이 있습니다. "이것을 외우는 건 의미가 없다."

퀵소트가 왜 빠른지, BFS가 왜 이 순서로 도는지 — 눈으로 보면 5초면 이해되는 것이 텍스트로는 30분이 걸렸습니다.

기존에 있는 시각화 사이트들도 모두 살펴봤습니다. 모바일에서 사용하기 어렵거나, 한국어 지원이 안 되거나, UX가 2010년대에 멈춰있는 경우가 대부분이었습니다. "직접 만들면 더 잘 만들 수 있겠다"는 확신이 들었고, 그래서 시작했습니다.

바이브코딩의 차별점

요즘 바이브코딩(Vibe Coding)이라는 말을 많이 사용하는데, 저는 조금 다르게 접근했습니다. AI에게 코드를 맡기는 것이 아니라, AI와 대화하면서 아키텍처를 함께 고민하는 방식이었습니다.

프론트엔드는 솔직히 전문 분야가 아닙니다. 백엔드를 11년 해왔지만 React는 깊이 있게 다루지 못했습니다. 그런데 AI와 함께 작업하니 Konva.js로 알고리즘 시각화 캔버스를 만들고, GSAP으로 부드러운 애니메이션도 구현할 수 있었습니다.

핵심은 "무엇을 만들지"를 명확히 알고 있었다는 점입니다. 11년 동안 시스템 설계를 하면서 쌓은 감각이 있었기 때문에, AI에게 "이런 구조로 가자"라고 방향을 제시할 수 있었습니다. 코드 작성은 AI가 도왔지만, 의사결정은 제가 했습니다.

기술 선택 — 왜 이 스택인가

프론트엔드: Next.js + Konva.js

SSR이 필요했고(SEO), 캔버스 기반 시각화가 필수였습니다. Konva.js는 React-Konva 바인딩이 잘 되어있어 선택했습니다. GSAP은 알고리즘 스텝 간의 부드러운 트랜지션에 적합했습니다.

백엔드: Spring Boot + Kotlin

이 영역은 제 홈그라운드입니다. 11년의 경험을 그대로 활용할 수 있어 빠르게 진행했습니다. Redis 캐싱, JPA, QueryDSL — 모두 익숙한 조합이라 고민 없이 결정할 수 있었습니다.

모바일: Capacitor

네이티브 앱을 별도로 개발할 시간이 없었습니다. Capacitor로 웹앱을 감싸서 Play Store에 출시했는데, 생각보다 퀄리티가 양호했습니다. 웹뷰 기반의 한계가 있지만 MVP로는 충분했습니다.

런칭 후 느낀 점

솔직히 말하면, 출시 자체보다 출시를 결정한 순간이 더 어려웠습니다.

"아직 이 기능이 안 됐는데", "저 기능도 넣어야 하는데" — 이런 생각이 계속 들었습니다. 하지만 레몬트리에서 퍼핀 서비스를 운영하면서 배운 것이 있습니다. 완벽한 서비스는 존재하지 않으며, 출시 후 사용자 피드백을 반영하면서 개선하는 것이 훨씬 빠르다는 것입니다. 그래서 핵심 기능만 담고 과감하게 출시했습니다.

출시 후에는 상당한 뿌듯함을 느꼈습니다. 회사에서는 항상 팀 단위로 움직이지만, 이번에는 기획부터 디자인, 개발, 배포까지 전부 혼자(+AI)의 힘으로 해냈기 때문입니다. 그 과정 자체가 큰 학습이었습니다.

다음 스텝

현재는 사용자 피드백을 반영하면서 알고리즘을 지속적으로 추가하고 있습니다. DP, 그래프 영역의 시각화를 보강하고 코딩 테스트 실전 문제도 확대할 계획입니다. 유료 구독 모델도 준비 중입니다.

또한 다음 사이드 프로젝트로 꿀주식(HoneyStock)도 준비하고 있습니다. 이번에도 바이브코딩으로 가볍게 시작해볼 예정입니다.

마무리

사이드 프로젝트는 "언젠가 해야지"가 아니라 지금 바로 시작하시기 바랍니다. AI 도구가 이만큼 발전한 시대에, 하지 않는 것이 오히려 더 아까운 일입니다.