프로젝트 개요:
기술 스택:
백엔드:
mongoose
ODM 사용)jsonwebtoken
라이브러리)bcryptjs
(비밀번호 해싱)nodemailer
(이메일 발송)multer
, express-fileupload
(파일 업로드 처리)sharp
, resize-img
(이미지 처리)dotenv
(환경 변수 관리)cors
(Cross-Origin Resource Sharing)body-parser
, cookie-parser
, cookie-session
(미들웨어)프론트엔드:
App.js
, index.js
등)axios
(HTTP 클라이언트)개발 도구 및 환경:
nodemon
(개발 중 서버 자동 재시작)cross-env
(환경 변수 설정 호환성)프로젝트 구조:
backend: 서버 사이드 코드
src/
: 주요 소스 코드
server.js
: 메인 서버 실행 파일mail/
: 이메일 템플릿 및 발송 로직middleware/
: Express 미들웨어 (예: auth.js
인증 미들웨어)models/
: MongoDB 스키마 및 모델 정의routers/
: API 라우팅 정의uploads/
: 업로드된 파일 저장 (예: 이미지)frontend: 클라이언트 사이드 코드 (React 애플리케이션)
public/
: 정적 파일 (HTML, 아이콘 등)src/
: React 컴포넌트, API 클라이언트, 페이지, 스타일 등
App.js
: 메인 애플리케이션 컴포넌트index.js
: 애플리케이션 진입점apiClient.js
, api/api.js
: 백엔드 API 통신 로직components/
: 공통 UI 컴포넌트pages/
또는 역할별 폴더 (adminPage/
, professorPage/
, studentPage/
): 페이지별 컴포넌트hooks/
: React Hooksassets/
: 이미지, 폰트 등 정적 에셋