|
| 1 | +# BackSpace |
| 2 | + |
| 3 | +백스페이스는 Windows 95, 싸이월드, 레트로 키치 미학에 영감을 받은 소셜 미니홈피 서비스입니다. |
| 4 | +이 프로젝트는 React, TypeScript, Supabase를 사용해 브라우저에서 레트로 OS 사용 경험을 제공합니다. |
| 5 | + |
| 6 | +## ✨ 핵심 기능 |
| 7 | + |
| 8 | +### OS 시스템 |
| 9 | + |
| 10 | +- **윈도우 창 관리**: 열기, 닫기, 최소화, 최대화, 복원 |
| 11 | +- **드래그 이동**: 타이틀 바 드래그로 자유롭게 윈도우 이동 |
| 12 | +- **태스크 바**: 열린 앱 표시, 창 포커스 전환, 시작 메뉴, 시스템 트레이에서 시간 및 테마 제어 |
| 13 | +- **바탕화면 바로가기**: 미니홈, 갤러리, 친구 등 앱을 OS에서 즉시 실행 |
| 14 | +- **라이트/다크 모드**: 시스템 테마 감지 및 로컬 스토리지를 저장 및 테마 전환 |
| 15 | + |
| 16 | +### 인증 |
| 17 | + |
| 18 | +- **이메일 & 비밀번호**: 검증을 통한 이메일 & 비밀번호 로그인 및 회원 가입 |
| 19 | +- **소셜 로그인**: Google, GitHub, Kakao 소셜 로그인 |
| 20 | + |
| 21 | +### 미니홈 |
| 22 | + |
| 23 | +- **홈**: 프로필, 소개, 최근 사진, 최신 게시물 및 친구 요청 |
| 24 | +- **갤러리**: 사진 업로드, 조회, 수정, 삭제 및 좋아요와 댓글 |
| 25 | +- **메모**: 게시글 작성, 조회, 수정, 삭제 및 좋아요와 댓글 |
| 26 | +- **방명록**: 방명록 작성, 답글 및 삭제 |
| 27 | + |
| 28 | +### 친구 |
| 29 | + |
| 30 | +- **사용자 검색**: 닉네임, 이메일로 사용자 검색 |
| 31 | +- **친구 요청**: 친구 요청 확인, 수락, 거절 |
| 32 | +- **친구 목록**: 친구 목록 및 미니홈 방문, 친구 삭제 |
| 33 | + |
| 34 | +## 👥 팀 & 기여도 |
| 35 | + |
| 36 | +**이서진**: 아이디어/기획, 디자인, UI/UX, 프로젝트 설정 및 아키텍처 설계, 디자인 시스템 설계, OS 시스템 및 윈도우 관련 로직, 태스크 바 시작 메뉴 및 테마 제어, 테마 컨텍스트, 윈도우 탭 전환 로직, 미니홈 방명록 탭, 친구 사용자 검색/친구 요청, 아바타/인풋/텍스트아레아/로더 컴포넌트, QA 및 디버깅 |
| 37 | +**김지호**: 데이터베이스 설계 및 관리, 바탕화면 페이지, 태스크 바 관련 로직, 바탕화면 및 태스크 바 연동 로직, 커스텀 스크롤 바, 미니홈 갤러리, 친구 목록, 라운드 탭/컨테이너 컴포넌트, QA 및 디버깅 |
| 38 | +**정진환**: 로그인 및 회원가입 페이지, 인증 로직, 타이틀바/버튼/체크박스 컴포넌트, 미니홈 메모, 시연 영상 및 발표 |
| 39 | +**김수연**: 미니홈 홈, PPT |
| 40 | + |
| 41 | +## 📂 프로젝트 구조 |
| 42 | + |
| 43 | +`src` 폴더는 기능과 특징별로 정리: |
| 44 | + |
| 45 | +``` |
| 46 | +src |
| 47 | +├── assets/ # Fonts, icons, logos, and other static assets |
| 48 | +├── components/ # Reusable, un-opinionated UI components (Button, Input) |
| 49 | +├── contexts/ # React contexts (ThemeContext) |
| 50 | +├── features/ # Domain-specific application features (friends, minihome) |
| 51 | +├── hooks/ # Custom React hooks (useDraggable, useAuthUser) |
| 52 | +├── layouts/ # Layout components for page structure (AuthLayout) |
| 53 | +├── os/ # Components for the OS UI shell (Window, Taskbar, Shortcut) |
| 54 | +├── pages/ # Top-level page components (Auth pages, OS main) |
| 55 | +├── router/ # Routing logic (ProtectedRoute, PublicRoute) |
| 56 | +├── stores/ # Zustand global state stores (useAuthStore, useWindowStore) |
| 57 | +├── styles/ # Global CSS, fonts, and Tailwind utilities |
| 58 | +└── utils/ # Utility functions (Supabase client setup) |
| 59 | +
|
| 60 | +``` |
0 commit comments