흐음 프로젝트 소개

"흐음..."은 개발자가 다른 사람의 코드를 처음 볼 때 자연스럽게 나오는 첫 말에서 시작된 이름입니다.
개발자들이 서로의 코드를 공유하고 리뷰하며 피드백을 주고받을 수 있는 온라인 플랫폼입니다.

📑 페이지 구성

페이지	경로	설명
홈	/	메인 홈화면
게시글 보기	/code/view/:id	선택한 코드 상세 보기
게시글 작성	/write	새로운 글 작성 페이지 (로그인 필요)
마이페이지	/my-page	사용자 개인 페이지 (로그인 필요)
로그인	/sign-in	사용자 로그인 페이지
회원가입	/sign-up	새로운 사용자 등록 페이지

홈 화면

게시글 보기

게시글 작성

마이 페이지

로그인 페이지

회원가입 페이지

⚙ 주요 기능

• 코드 공유 및 리뷰: Markdown 기반의 에디터를 통해 코드와 설명을 쉽게 작성하고 공유할 수 있습니다.
• 사용자 경험 향상: SPA(Single Page Application) 구조를 활용하여 빠르고 매끄러운 페이지 전환을 제공합니다.
• 사용자 경험 향상: 구글 계정을 통한 소셜 로그인으로 간편하고 안전한 인증을 지원합니다.
• 사용자 데이터 관리: BaaS 서비스인 Supabase를 활용하여 사용자 인증부터 게시글, 댓글, 좋아요까지 실시간으로 관리합니다.

🕶️ 기술 스택

Deploy

 

Frontend

 

👩‍👩‍👧‍👧 프로젝트 멤버 소개

KIMgyeongmIN00	SuimKim	dev-woohyeok
게시글 뷰어 및 편집 페이지 구현	사용자의 전역 상태 관리 코드 구현 마이 페이지 구현	public / private 라우팅 경로 설계 공통 컴포넌트 및 마이 페이지 구현
llddang	LSJ0706	choichangyeon
게시글 작성 페이지 구현 공통 컴포넌트 및 소셜 로그인 구현	회원가입 / 로그인 페이지 구현 supabase trigger 설정	Header 컴포넌트 구현 홈 페이지 구현

📍 프로젝트 실행

$ git clone https://github.com/KIMgyeongmIN00/Hmm-code-review-site
$ cd Hmm-code-review-site

$ pnpm install
$ pnpm dev

📁 프로젝트 구조

📦 Hmm-code-review-site
├─ public
└─ src
   ├─ main.jsx
   ├─ App.jsx
   ├─ app
   │  ├─ ProtectedRouter.jsx
   │  └─ Router.jsx
   ├─ components
   │  ├─ commons
   │  ├─ features
   │  └─ layouts
   ├─ contexts
   │  └─ auth
   │     ├─ AuthProvider.jsx
   │     ├─ auth.context.js
   │     └─ auth.reducer.js
   ├─ data
   ├─ hooks
   │  └─ auth
   │     └─ useSignInForm.js
   ├─ libs\api
   ├─ pages
   ├─ styles
   └─ utils

📃 프로젝트 기록

피그마 Link

노션 Link

배포된 링크 : HMM...

KPT 회고 : 추가 예정...