수구리의 데브로그

Remix에서 Server Action과 Client UI 간 데이터 흐름 버그 해결하기

문제 상황비밀번호 재설정 기능을 구현하던 중, 성공 메시지와 카운트다운 타이머가 전혀 동작하지 않는 버그를 발견했습니다. 코드를 살펴보니 성공 UI와 관련된 로직이 완전히 데드코드(Dead Code)가 되어 있었습니다.// 이 코드는 절대 실행되지 않았습니다{actionData && 'success' in actionData && ( 비밀번호가 성공적으로 변경되었습니다! 로그인 페이지로 이동합니다... {countdown > 0 && ` (${countdown}초)`} )}// 이 useEffect도 마찬가지로 실행되지 않았습니다useEffect(() => { if (actionData && 'success' in actionData) { setCountdown(3) // 카..

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

DAY7: 달력 컴포넌트, 관리자 유저 관리, 마케팅 동의 시스템 구축📋 개요DAY6에서 이미지 업로드 시스템과 장소 등록 기능이 완전히 완성된 후, DAY7에서는 여러 핵심 기능을 동시에 개발했습니다. 사용자 경험 개선을 위한 달력 컴포넌트 구현, 관리자 유저 관리 기능 강화, 마케팅 정보 수신 동의 시스템 구축, 그리고 전체적인 UI/UX 통일 작업까지 진행했습니다.🎯 DAY7 목표주요 개발 영역달력 컴포넌트 시스템: 기존 HTML date input을 한국어 친화적 달력으로 교체관리자 유저 관리 시스템: 유저별 장소 수 집계, 권한 관리 기능 완성마케팅 동의 관리: 개인정보보호 강화를 위한 마케팅 정보 수신 동의 토글 시스템프로필 시스템 확장: 내정보 페이지 추가 및 사용자 프로필 관리UI/UX..

“PR 설명 좀 제대로 써주세요…”반복되는 잔소리를 끝내고, AI가 코드 diff를 읽어 PR 템플릿을 자동으로 메워주는 워크플로를 구축한 과정을 정리했다. 그대로 가져다 써도 되고, 팀 상황에 맞게 변형만 해도 된다.GitHub Action이 PR diff를 수집diff를 OpenAI API로 전송 → 시스템 프롬프트로 요약 포맷 강제응답을 PR 본문에 삽입결과 미흡하면 프롬프트만 조정1. 배경 - 왜 자동화?코드 변경량이 커질수록 설명은 더 조잡해졌다.“주요 기능 몇 개만 요약해줘”라는 리뷰어 요청이 반복.ChatGPT를 수동으로 돌리니 → 답변 패턴이 들쭉날쭉.그래서 아예 PR 생성 트리거로 AI 요약을 강제했다.2. 시퀀스 다이어그램3. GitHub Action 코드name: Auto-fill P..