모범운전사 (14.♡.71.139)
2025년 7월 2일 PM 06:37 · 수정됨(07. 05. 16:33)
올해 초, 홍콩 여행 중 비오는 날 하루를 빼서 마카오 여행을 갔습니다.
마카오에 가기 전 많은 호텔에서 무료 셔틀버스를 운영한다는 정보는 알았지만,
생각보다 셔틀버스 탑승 위치나 노선 정보를 수집하는 일이 힘들더군요.
그래서 한국에 돌아와 비슷한 서비스가 있는지 확인했는데
그 당시에는 찾지를 못해서 스스로 만들어버렸습니다.
바이브 코딩이라는 이름하에 주로 제미니를 괴롭혔지만
챗지피티, 클로드도 번갈아가며 괴롭힌 결과물이
얼마전에 나와서 이렇게 개발한당에 수줍게 공유드려봅니다.
사용법은 단순합니다.
제가 정해둔 지점들을 검색하거나 지도의 핀에서 선택하여 출발지/목적지를 정합니다.
요일과 시간대를 정합니다.
그러면, 요일과 시간대에 맞게 최적의 셔틀버스+도보 경로를 안내하며
구글맵에 경로를 표시하게 됩니다.
스크린샷은 이렇습니다.

호기심이 생기시는 분들이 있으시다면
https://www.macaoshuttle.com
이 주소로 가시면 직접 확인해보실 수 있습니다.
기술스택도 간단하게 적어봅니다.
DB : Postgresql (Supabase) / pgrouting과 postgis를 애드온으로 사용했습니다.
백엔드 : NestJS
프론트엔드 : NextJS
CI/CD : Github Action + Vercel (프론트) / Github Action + AWS ECS (백엔드)
이정도입니다.
바이브코딩으로 제가 머릿속으로만 생각한걸 실제로 만들어낼 수 있었다는 점이
개인적으로는 너무 좋았습니다.
앞으로도 바이브코딩을 이용해서 다른 것들을 계속 만들어볼 생각입니다.
두서없는 글 읽어주셔서 감사합니다!
댓글 (4)
-
Gggang9
25.07.03 · 106.♡.33.16
- 모
모범운전사
→ ggang9 작성자
25.07.03 · 221.♡.181.114
아 좋은 정보네요!
제가 디자인 감각이 영 꽝이라 그냥 색상으로 처리했었는데
훨씬 더 좋을거 같습니다!
감사합니다! - 챠
챠비
25.07.05 · 125.♡.105.177
대단하시네요 Cursor같은 AI편집기 안쓰고,
각 AI에 복/붙해서 하신거죠?
진정한 바이브코딩은 커서가
소스까지 병합을 해주는 것입니다 ㅋㅋㅋ - 모
모범운전사
→ 챠비 작성자
25.07.05 · 114.♡.132.42
커서 trial을 초반에 써봤는데 진짜 장난 아니긴 하더군요;;
근데 제가 프롬프트 작성에는 좀 약해서인지 모르겠는데,
가끔 제가 고쳐둔걸 뭉개버리는 경우가 있어서 그냥 포기하고 복붙으로 했습니다.
그렇다고 마냥 써준대로 빌드하면 뜬금없는 에러가 튀어나오며 빌드가 실패하니
그냥 쓰기도 뭐하더군요..
그래도, 복붙해놓은걸 엄청 잘 기억하는 편이라
작업 난이도가 엄청 높아진다거나 하지는 않아서 잘 써먹었네요.
댓글을 작성하려면 이 필요합니다.
https://developers.google.com/maps/documentation/javascript/advanced-markers/graphic-markers?hl=ko