백로그
0할 일
0진행 중
0리뷰
0완료 (30일)
3DB 모델 구축: User + UserSetting + QT 핵심 모델 4개
## 목표 Rails 8.1.2 프로젝트에 핵심 DB 모델 6개를 TDD로 구축합니다. ## 작업 범위 ### 1. Devise 설치 및 User 모델 - `rails generate devise:install` 실행 - User 모델 마이그레이션 (UUID PK): email, nickname, provider, provider_id, role(enum: user/admin), profile_image, phone, notification_enabled, notification_time, current_session_id - 인덱스: email(unique), [provider, provider_id](unique) - Devise 모듈: :database_authenticatable, :omniauthable (omniauth_providers: [:google_oauth2, :kakao]) ### 2. UserSetting 모델 - user_id(FK unique), timezone(default: Asia/Seoul), language(default: ko), preferred_difficulty(default: 3), auto_next_day(default: true), current_session_id - User has_one :user_setting ### 3. QtTheme 모델 - title, description, is_default, is_active, total_day, is_ai_generated, generation_status(enum: draft/generating/completed/published), user_id(FK nullable) - User has_many :qt_themes ### 4. QtContent 모델 - theme_id(FK), day_number, bible_passage, theme_title, content, questions(JSON array), difficulty(default: 3), week_number, reading_passage, estimated_minutes, tags, bible_chapter, bible_verse - QtTheme has_many :qt_contents ### 5. QtSession 모델 - title, theme_id(FK), creator_id(FK->users), start_date, end_date, total_days, is_public, invite_code(unique 8자), max_participants, status(enum: active/completed/cancelled) - QtTheme has_many :qt_sessions ### 6. QtParticipant 모델 - session_id(FK), user_id(FK), role(enum: creator/member), is_active, joined_at - unique index: [session_id, user_id] - QtSession has_many :qt_participants ## 기술 요구사항 - 모든 테이블 UUID PK (id: :uuid) - ApplicationRecord에 `self.implicit_order_column = "created_at"` 이미 설정됨 - enum은 Rails 8 방식 사용 - 모델 테스트 (validations, associations, scopes) 작성 - fixtures 작성 ## 참고 - docs/migration/index.md §2 데이터 모델 참조
OmniAuth 소셜 로그인 (Google/Kakao) + 세션 관리
## 목표 Devise + OmniAuth로 Google/Kakao 소셜 로그인을 구현합니다. ## 전제 조건 - User 모델이 이미 Devise와 통합되어 있다고 가정합니다 - User 모델에 provider, provider_id, email, nickname 등 컬럼이 있습니다 - devise gem, omniauth gem이 Gemfile에 이미 있습니다 ## 작업 범위 ### 1. Gemfile 추가 - `omniauth-kakao` gem 추가 - `bundle install` 실행 ### 2. Devise 설정 - config/initializers/devise.rb 설정 (mailer, secret_key 등) - OmniAuth provider 설정 (Google OAuth2, Kakao) - 환경변수: GOOGLE_CLIENT_ID, GOOGLE_CLIENT_SECRET, KAKAO_CLIENT_ID, KAKAO_CLIENT_SECRET ### 3. OmniAuth 콜백 컨트롤러 - app/controllers/users/omniauth_callbacks_controller.rb - Google 콜백: 사용자 find_or_create - Kakao 콜백: 사용자 find_or_create - User.from_omniauth 클래스 메서드 ### 4. 세션 관리 - 로그인/로그아웃 플로우 - 비인증 사용자 → 로그인 페이지 리다이렉트 - authenticate_user! before_action 설정 ### 5. 로그인 페이지 UI - app/views/devise/sessions/new.html.erb - Google 로그인 버튼 + Kakao 로그인 버튼 - Tailwind CSS 스타일링 (모바일 반응형) - 로고 + 앱 소개 텍스트 ### 6. 라우팅 - config/routes.rb에 devise_for :users 추가 - OmniAuth 콜백 라우트 설정 ### 7. 테스트 - OmniAuth mock을 사용한 통합 테스트 - 로그인/로그아웃 플로우 테스트 ## 참고 - 레거시: src/contexts/AuthContext.tsx 분석 - docs/migration/index.md §3-1 인증/세션 API
디자인 시스템: UI 파셜 + 레이아웃 + Stimulus 컨트롤러
## 목표 Tailwind CSS v4 기반 디자인 시스템을 구축합니다. shadcn/ui 스타일을 ERB 파셜로 변환합니다. ## 현재 상태 - 이미 존재하는 파셜: _button.html.erb, _card.html.erb, _flash.html.erb, _input.html.erb - 기존 파셜을 확인하고, 부족한 부분을 보완합니다 ## 작업 범위 ### 1. 기존 파셜 검토 및 보완 - app/views/shared/ 디렉토리의 기존 4개 파셜 확인 - 필요시 개선 (다크모드, 접근성, 변형 옵션) ### 2. 추가 UI 파셜 생성 (12개) - _modal.html.erb: 모달 다이얼로그 (backdrop + 애니메이션) - _select.html.erb: 커스텀 셀렉트 드롭다운 - _tabs.html.erb: 탭 네비게이션 - _avatar.html.erb: 프로필 아바타 (이미지 + 이니셜 폴백) - _badge.html.erb: 상태 배지 (success, warning, error, info) - _progress.html.erb: 진행률 바 - _switch.html.erb: 토글 스위치 - _tooltip.html.erb: 툴팁 - _alert.html.erb: 알림 배너 - _dropdown.html.erb: 드롭다운 메뉴 - _separator.html.erb: 구분선 - _table.html.erb: 테이블 ### 3. 앱 레이아웃 - app/views/layouts/application.html.erb 수정: - 모바일: 하단 네비게이션 (4탭: QT, 묵상, 통독, 기도) - 데스크톱: 사이드바 네비게이션 - 헤더: 앱 이름 + 프로필 메뉴 - 다크모드 토글 - app/views/shared/_header.html.erb - app/views/shared/_sidebar.html.erb - app/views/shared/_bottom_nav.html.erb ### 4. Stimulus 컨트롤러 - app/javascript/controllers/modal_controller.js (열기/닫기/ESC) - app/javascript/controllers/dropdown_controller.js (토글/외부클릭닫기) - app/javascript/controllers/tabs_controller.js (탭 전환) - app/javascript/controllers/tooltip_controller.js (표시/숨김) - app/javascript/controllers/dark_mode_controller.js (다크모드 전환) - app/javascript/controllers/sidebar_controller.js (사이드바 토글) ### 5. 다크모드 - Tailwind dark: 클래스 사용 - prefers-color-scheme 미디어쿼리 지원 - localStorage에 사용자 설정 저장 ## 스타일 가이드 - 색상: 주 색상 indigo-600, 보조 amber-500 - 모바일 우선 (min-width breakpoint) - 간격: p-4, gap-4 기본 - 모서리: rounded-lg 기본 - 그림자: shadow-sm ~ shadow-md - 폰트: font-sans (기본 시스템 폰트) ## 파셜 컨벤션 - 모든 파셜은 local variable로 옵션을 받습니다 - 예: render "shared/button", text: "저장", variant: :primary, size: :md - 기본값은 파셜 내부에서 설정 ## 참고 - docs/migration/index.md §6 UI 구조 - 레거시 src/components/ui/ (27개 shadcn 컴포넌트) - 레거시 src/components/layout/ (AppLayout, Header, Sidebar, BottomNav)