🚀 StudyHub 강의, 구인 공고

StudyHub는 온라인 학습자들의 심리적 고립감을 해결하고 지속적인 학습 동기를 제공하는 커뮤니티 플랫폼입니다. 강의 정보 공유, 스터디 모집, 실시간 채팅, 알림 기능을 통해 같은 목표를 가진 학습자들을 연결하여 함께 성장할 수 있는 환경을 제공합니다.

https://learn.ozcoding.site

아래는 API가 개발 중일 때 사용한 익스프레스 서버입니다. https://github.com/ThePott/studyhub-express 더미데이터로 프로젝트 코드가 오염되지 않도록 하였습니다.

🛠️기술 스택

Frontend Framework & Language

Styling & UI

State Management & Data Fetching

Routing & Forms

Validation & Utilities

Development Tools

팀 소개

하흥주

• FE 팀장
• 공통 컴포넌트
• 강의 목록 페이지
• 공고 작성/수정 페이지
• 공고 세부 페이지
• 헤더 + 알림 드롭다운

장병권

• 플로팅 아이콘
• 채팅 기능
• 태그 검색
• 태그 추가 모달
• QA

이혜정

• 구인 목록 페이지
• 지원자 조회 모달
• 지원자 상세 조회 모달

이은정

• 공고관리
• 공고 지원 폼
• 구인 카드 공통컴포넌트
• PPT 제작
• QA

기획 문서

사용자 요구사항 정의서

https://docs.google.com/spreadsheets/d/19C4btPlvS83xM4OVs446ej5-75SNeHCgqxFUdLoSNS0/edit?gid=771422336#gid=771422336

플로우 차트

https://www.figma.com/board/33wt1uWgocIqCZTGw31Gn1/%EC%9D%B5%EC%8A%A4%ED%84%B4%EC%8B%AD-3%EA%B8%B0-3%ED%8C%80-%ED%94%8C%EB%A1%9C%EC%9A%B0%EC%B0%A8%ED%8A%B8?node-id=0-1&t=a894NYot24UsIPcf-1

와이어 프레임

https://www.figma.com/design/AnjFEyRItydGY6YUpl58lW/%EC%9D%B5%EC%8A%A4%ED%84%B4%EC%8B%AD-3%EA%B8%B0-3%ED%8C%80-%ED%99%94%EC%9D%B4%ED%8C%85?node-id=19-2023&t=mt0gO0nmACQhNFXp-1

화면 정의서

https://www.figma.com/design/AnjFEyRItydGY6YUpl58lW/%EC%9D%B5%EC%8A%A4%ED%84%B4%EC%8B%AD-3%EA%B8%B0-3%ED%8C%80-%ED%99%94%EC%9D%B4%ED%8C%85?node-id=127-33&t=mt0gO0nmACQhNFXp-1

📦 설치

1. 사전 요구 사항

MacOs

brew install node

2. 프로젝트 설치

git clone https://github.com/OZ-Coding-School/oz_externship_fe_03_team3
cd oz_externship_fe_03_team3
npm install
npm run dev

3. 프로젝트 실행

주소창에 http://localhost:5173