🐰 토끼를 키우며 습관을 완성하는 서비스, Rabbit Habit

Rabbit Habit(레빗헤빗) 은 사용자의 일상 습관을 귀여운 픽셀 토끼 성장 시스템과 결합한
개인·팀 습관 관리 웹 서비스입니다.
습관을 수행하지 않으면 토끼가 배고파하다가, 계속 방치하면 도망가요.
매일의 행동이 곧 토끼의 생존이 되는 경험을 제공합니다.

• 구분: 팀 프로젝트
• 기간: 2025년 9월 4일 ~ 2025 11월 26일
• 배포: https://rabbit-habit-xi.vercel.app

📑 Table of Contents

• 👤 팀원 (Team Members)
• 📌 프로젝트 개요 (Project Overview)
• 🔍 주요 기능 (Key Features)
• 🧰 기술 스택 (Tech Stack)
• 🖥️ 개발 환경 (Software & Tools)
• 🖇 ERD (Entity-Relationship-Diagram)
• 🏗️ 서비스 아키텍처 (Service Architecture)
• 🧩 Actions 명세서 (Actions Specification)
• 🖥️ 화면 설계서 (Wireframe)

👤 팀원 (Team Members)

김소연	이근화	이은진
BE, FE	BE, FE	BE, FE

📌 프로젝트 개요 (Project Overview)

본 프로젝트는 습관 형성과 지속을 돕는 웹 기반 서비스로, 개인 습관 관리뿐 아니라 팀 단위 습관 공유, 게이미피케이션, 실시간 채팅, 알림 기능을 통해 사용자가 습관을 꾸준히 실천할 수 있도록 지원하는 것을 목표로 합니다.

Rabbit Habit은

• 습관 수행 여부를 토끼의 생존 상태로 시각화하고
• 개인 습관 + 팀 습관을 동시에 관리하며
• 채팅·콤보·출석 기록을 통해
  사용자가 “내가 안 하면 토끼가 위험해진다” 는 감정적 몰입을 느끼도록 설계된 서비스입니다.

이를 통해 혼자 하는 습관 관리의 한계를 보완하고, 함께 실천하고, 잊지 않도록 돕는 구조를 제공합니다.

🔍 주요 기능 (Key Features)

✅ 사용자 기능 (User Features)

• 습관 등록 및 관리
  • 개인 습관 / 팀 습관 구분
  • 목표 횟수, 상세 목표 설정
• 토끼 상태 시각화
  • PixiJS 기반 픽셀 애니메이션
  • 습관 수행 여부에 따른 토끼 상태 변화
• 출석 체크 & 히스토리
  • 일별 습관 성공/실패 기록
  • 개인 / 팀 히스토리 분리 관리
• 콤보 시스템
  • 연속 성공 시 콤보 증가
  • 실패 시 콤보 초기화
• 통계 및 분석
  • 주간·월간 수행 패턴 시각화
  • 습관별 성공률 / 달성률 통계 제공
• 팀 기능
  • 초대 코드 생성 및 공유
  • 팀원 수에 따른 팀 습관 활성화
• 채팅 기능
  • 습관별 전용 채팅 채널 제공
  • 실시간 메시지 송수신 및 읽음 상태 표시
• 알림 시스템
  • 설정한 시간에 맞춘 습관 리마인드 푸시 알림
  • 습관 미수행 시 자동 리마인드 알림

✅ 시스템 기능 (System Features)

• KST 기준 날짜 처리
• 자동 미수행 처리 (Cron)
• 서버 액션 기반 데이터 처리
• SSR + Client Component 혼합 구조
• 실시간 상태 동기화
  
  

🧰 기술 스택 (Tech Stack)

🚀 Frontend

• Next.js (App Router)
• React
• TypeScript
• Tailwind CSS
• PixiJS (픽셀 애니메이션)
• Radix UI
• PWA (Progressive Web App)

🔧 Backend

• Next.js Server Actions
• NextAuth.js
• Kakao OAuth API
• WebSocket
• Firebase Cloud Messaging (FCM)
• Cron Job (Vercel)

🗄 Database

• PostgreSQL
• Prisma ORM

☁️ Deployment

• Vercel
• Railway
• Supabase
  • PostgreSQL Database
  • Storage (이미지 저장)

🖥️ 개발 환경 (Software & Tools)

• Languages: Java 17, TypeScript
• IDE: IntelliJ, VS Code
• ORM: Prisma
• Database: PostgreSQL
• Dev Tools: IntelliJ IDEA
• 형상 관리: Git, GitHub
• 협업 도구: Notion

🖇 ERD (Entity Relationship Diagram)

🏗️ 서비스 아키텍처 (Service Architecture)

🧩 Actions 명세서 (Actions Specification)

actions_명세서.pdf

🖥️ 화면 설계서 (Wireframe)

⬆️ TOP