수구리의 데브로그

[바이브 코딩 #6] 데이트 코스 추천 서비스 개발기

DAY6: 이미지 업로드 RLS 정책 문제 해결📋 개요DAY5에서 구현한 이미지 업로드 기능에서 발생한 Supabase Storage RLS(Row Level Security) 정책 관련 오류를 해결하고, 안정적인 이미지 업로드 시스템을 완성했습니다.🐛 발견된 문제에러 상황Error uploading compressed image: SyntaxError: Unexpected token '문제 분석Supabase Storage RLS 정책 부재: place-images 버킷에 적절한 RLS 정책이 설정되지 않음403 Unauthorized 응답: 이미지 업로드 시 JSON 대신 HTML 에러 페이지 반환클라이언트 JSON 파싱 실패: HTML 응답을 JSON으로 파싱하려다 에러 발생근본 원인Supaba..

[바이브 코딩 #5] 데이트 코스 추천 서비스 개발기

DAY 5: 카카오 지도 API 연동 및 이미지 최적화📋 기능 개요유저가 장소를 등록할 때 카카오 지도 API와 연동하여 위치 정보를 정확하게 수집하고, 이미지를 자동으로 압축하여 최적화하는 기능을 구현합니다.✅ 완료된 기능1단계: 환경 설정 (완료)1-1. 환경 변수 추가위치: app/config/env.ts추가된 변수: KAKAO_MAP_APP_KEY용도: 카카오 지도 JavaScript SDK 인증설정: VITE_KAKAO_MAP_APP_KEY (클라이언트에서 사용)1-2. TypeScript 타입 정의위치: app/types/kakao-map.ts포함 내용:카카오 지도 API 인터페이스 (KakaoLatLng, KakaoMapOptions)위치 데이터 타입 (PlaceLocationData)검색..

[바이브 코딩 #4] 데이트 코스 추천 서비스 개발기

이번 단계에서는 유저가 직접 장소를 등록할 수 있는 기능을 개발해보았다.추후에는 본인이 등록한 장소들 또는 기존에 다른 유저가 등록한 장소들을 가지고 코스를 등록할 수 있도록 기획을 해볼 예정이다!새로운 데이터베이스 스키마를 추가했고 유저의 무분별한 장소 등록을 방지하고자 하루에 최대 3개정도까지만 등록할 수 있도록 기획했다.그리고 유저 본인이 등록한 장소를 카드 형태로 확인할 수 있고, 장소 수정은 불가능하고 삭제 후 재등록을 통해서만 가능하도록 기획해보았다.그리고 현재는 모든 장소가 관리되어지고 있는데 나중에는 관리자의 승인에 의해서만 장소 등록이 될 수 있도록도 고려를 해야하지 않을까 생각한다.일단은 유저 참여형 서비스를 개발해보고 싶었다. 어드민에서 등록되어져 있는 장소들만 가지고 유저에게 보여주..

코스모스 (Course-More-Us) - 3일차 개발 기록개발 기간: 2025년 06월 17일개발자: yangsuyoung프로젝트: 데이트 코스 추천 서비스 "코스모스"📋 개발 개요3일차는 관리자 페이지 리팩터링, UI/UX 개선, 그리고 소셜 로그인 공통 로직 리팩터링에 집중했습니다. 기존 코드의 일관성을 높이고 재사용 가능한 컴포넌트 체계를 구축하여 유지보수성을 크게 향상시켰습니다.🚀 주요 구현 사항1. 관리자 페이지 리팩터링 ✅공통 컴포넌트 적극 활용기존의 분산된 UI 요소들을 표준화된 공통 컴포넌트로 통일했습니다.수정된 파일들:app/routes/admin.users._index.tsxapp/routes/admin.places._index.tsxapp/routes/admin.places.ne..

코스모스 (Course-More-Us) - 2일차 개발 기록개발 기간: 2025년 06월 15일 ~ 2025년 6월 16일개발자: yangsuyoung프로젝트: 데이트 코스 추천 서비스 "코스모스"📋 개발 개요둘째날은 이용약관 동의 시스템 구현과 회원가입 플로우 개선에 집중했습니다. 특히 카카오 OAuth와 이메일 회원가입 모든 방식에 약관 동의 단계를 추가하고, 복잡한 RLS 순환 참조 문제를 해결하는 과정이 핵심이었습니다.🚀 주요 구현 사항1. 이용약관 시스템 구현 ✅서비스 이용약관 전문 페이지파일: app/routes/terms.tsx내용: 11개 조항의 상세한 서비스 이용약관서비스 이용 목적 및 범위회원가입 및 계정 관리개인정보 처리 및 보호서비스 이용 규칙콘텐츠 및 지적재산권서비스 제공 및 ..

이제는 익숙한 바이브 코딩이라는 단어가 있다바이브 코딩은 진짜 말 그대로 본인이 코드를 작성하지 않고도 느낌대로 코딩하는 걸 말한다.그냥 내가 만들고 싶은 아이디어만 있다면 그걸 느낌대로 구체화 해 나가면서 정말 손이 가는대로 개발하는 것이다.나도 지금까지 제대로 된 서비스나 프로젝트가 없으니 이번 기회에 지금까지 내가 터득했던 지식을 총동원해서내가 직접 코드를 작성하지 않고 기획과 디자인 그리고 개발까지 해보려고 한다.일단 1일차를 진행하면서 나는 정말 단 한 줄의 코드 조차 치지 않았다 (진짜임)그럼 나는 뭘 했냐?일단 아이디어를 구체화하는데 노력했다초기에 내 아이디어는 대략 이러했다.처음 가보는 지역에 데이트할 곳이나 먹거리나 카페들을 찾는데 너무 여기저기 돌아다녀야하는게 불편했다예를 들어 네이버 ..