혼자 버티는 공부는 이제 그만 ❌ 최신 IT 트렌드는 쏟아지고, 실무는 더 빨라졌습니다. StudyHub는 온라인 강의와 스터디 문화를 결합해 배우고 싶은 사람과 가르치고 싶은 사람, 함께 성장하고 싶은 사람을 하나로 잇습니다. 같은 목표와 수준의 이웃들을 만나, 믿을 수 있는 콘텐츠와 스터디로 매일 조금씩, 그러나 확실하게 성장하세요.
함께 학습하는 습관을 만들어주는 서비스, StudyHub에 오신 걸 환영합니다 🎉
| 랜딩 페이지 | 채팅 | 알림 |
|---|---|---|
 |
 |
 |
| 이메일 로그인 | 카카오 소셜 로그인 | 네이버 소셜 로그인 |
|---|---|---|
 |
 |
 |
| 회원가입 | 이메일 찾기 | 비밀번호 찾기 |
|---|---|---|
 |
 |
 |
| 내 정보 수정 | 비밀번호 변경 |
|---|---|
 |
 |
| 회원 탈퇴 | 탈퇴 회원 복구 |
|---|---|
 |
 |
| 지원 내역 | 완료된 스터디 |
|---|---|
 |
 |
| 북마크한 공고 | 북마크한 강의 |
|---|---|
 |
 |
| Category | Stack |
|---|---|
| Common |    |
| Frontend |           |
| Deployment |    |
| Collaboration |    |
 @dirage1 |
 @sysysysyb |
 @JaeHyunLee123 |
|---|---|---|
| 김승원 | 백서영 | 이재현 |
- main / develop 브랜치 기본 생성
- main과 develop으로 직접 push 제한
- PR 전 최소 2인 이상 승인 필수
- Gitmoji 사용
- 적절한 커밋 접두사 작성
- 커밋 메시지 제목 & 내용 작성
- 제목 뒤에 이슈 (#이슈 번호)와 같이 작성하여 이슈 연결
Gitmoji 도입
접두사 설명 🎉 프로젝트 시작 (Begin a project) ✨ 새 기능 추가 (Introduce new features) ♻️ 리팩토링 (Refactor code) 💄 UI/스타일 파일 추가·수정 (Add/update UI & style) 🐛 버그 수정 (Fix a bug) ✏️ 오타 수정 (Fix typos) 🩹 간단한 비치명적 수정 (Simple non-critical fix) 🚚 리소스 이동/이름 변경 (Move/rename resources) 📝 문서 추가·수정 (Add/update docs) 🙈 .gitignore추가·수정➕ 의존성 추가 (Add a dependency) ➖ 의존성 제거 (Remove a dependency) ⬇️ 의존성 다운그레이드 (Downgrade dependencies) ⬆️ 의존성 업그레이드 (Upgrade dependencies) 🔧 설정 파일 추가·수정 (Add/update config files)
커밋 컨벤션
접두사 설명 feature : 새로운 기능 추가, 컴포넌트 파일 생성 fix : 코드/버그 또는 UI 문제 해결 docs : 문서 수정 style : 포매팅/세미콜론 등, 로직 변경 없음 refactor : 코드 리팩토링 (동작 변경 없음) test : 테스트 코드/더미 데이터 추가 chore : 패키지 매니저/기타 작업 (예: .gitignore)design : UI 디자인 변경 (Tailwind 등) types : 타입/인터페이스 정의 추가·수정 comment : 주석 추가·변경 rename : 파일/폴더명 변경 또는 이동(내용 변경 없음) delete : 파일만 삭제 revert : 변경 사항 되돌리기 init : 초기화 관련 작업 !BREAKING CHANGE : 호환성 깨지는 큰 변경 !HOTFIX : 긴급 치명적 버그 수정
- 이슈와 PR은 .github 폴더에 첨부된 템플릿을 사용하여 작성한다.
- 작성 시 Assignees와 Labels를 지정한다.
변수 네이밍
- 약어 사용은 지양한다.
axios 데이터 리턴
axios를 사용할 때AxiosResponse로 감싼 값이 아니라 데이터만 리턴한다.
import 문
import문은 반드시 절대경로로 작성한다.
MSW
- 더미데이터는 mocks/data 폴더 아래에 파일을 만들어 관리한다.
- handler는 mocks/handlers 폴더 아래에 파일을 만들어 관리한다.
- 개별 핸들러를
export하지 않고 핸들러 배열을 만들어 해당 배열을export한다.- 위의 규칙에서
export한 핸들러 배열을mocks/handlers.ts파일의hanlers배열에 스프레드 오퍼레이터로 등록한다.
TanstackQuery
useQuery를 상위 컴포넌트에서 바로 사용하지 않고 별도 훅으로 관리한다.- 훅은 hooks/api 폴더 내에 별도 파일로 관리한다.
- 훅은 useQuery가 반환하는 객체 그대로 반환한다.
- 상위 컴포넌트에서 옵션을 변경할 수 있도록 options 파라미터를 사용한다.
- 쿼리키는 엔드포인트 + search query로 한다
Zod
- Zod schema는 schemas 폴더 아래에 생성한다.
- Zod schema를 정의하는 파일 명은 -schema.ts로 통일한다.
- Zod schema로 정의하고 있는 타입은 별도 interface로 중복 관리하지 않는다.
- schema를 정의하고 있는 파일은 z.infer를 사용해 추론된 타입도 같이 export 한다.
- zod 객체의 변수명은 타입 이름 + Schema로 한다. (PascalCase 사용)
- Discord와 Notion 활용
- 매일 오전 10시 20분에 데일리 스크럼 진행
- 매주 금요일 오후 6시에 KDT 회고와 Weekly Sprint 진행
VITE_KAKAO_CLIENT_ID
VITE_KAKAO_REDIRECT_URI
VITE_NAVER_CLIENT_ID
VITE_NAVER_CLIENT_SECRET
VITE_NAVER_REDIRECT_URI
| 서비스 기획 문서 | 팀 문서 |
|---|---|