SHS LMS Project

SHS는 학원형 온라인 강의 서비스를 위한 통합 LMS 프로젝트입니다.
공개 메인 사이트, 학생/강사용 LMS, 관리자 운영 화면, AI 기반 학습 보조 기능을 하나의 저장소에서 함께 운영하도록 구성되어 있습니다.

프로젝트 개요

이 프로젝트는 다음 흐름을 중심으로 설계되어 있습니다.

• 공개 메인 페이지에서 강의, 공지, 강사 정보를 탐색
• 회원가입 및 로그인 후 권한에 따라 학생/강사/관리자 영역으로 진입
• 학생은 수강, 진도 관리, 시험 응시, 오답노트, QnA, 리뷰, AI 챗봇 사용
• 강사는 강의 초안 작성, 승인 요청, 강의/공지/강의실 운영, QnA 답변 처리
• 관리자는 사용자 권한 승인, 강의 승인/반려, 과목 관리, 공지 관리, 알림 발송 수행

주요 기능

1. 공개 메인 서비스

• 메인 랜딩 페이지 및 LMS 진입 분기
• 강의 목록/상세 조회
• 공지/이벤트 목록 및 상세 조회
• 강사 소개 및 검색 기능
• 첨부파일 업로드/다운로드

2. 학생 LMS

• 수강 신청 및 찜 기능
• 수강 중/수강 완료 강의 관리
• 강의 진도 시작, 진도율 저장, 수강 진행 현황 확인
• 강의실 내 공지, 강의, QnA, 리뷰 이용
• 시험 응시 및 채점 결과 확인
• 오답노트 자동 적재 및 상세 조회
• 과목 기반 AI 학습 챗봇 사용

3. 강사 LMS

• 강의 초안 저장 및 신규 강의 등록 요청
• 기존 강의 수정 요청 및 승인 대기/반려 내역 조회
• 내 강의 목록 관리
• 강의실 내 강의/공지 등록, 수정, 삭제
• 수강생 QnA 답변 및 미답변 질문 관리

4. 관리자 서비스

• 전체 회원 조회
• 강사 권한 승인/반려 및 블랙리스트 관리
• 과목 생성/수정/삭제
• 강의 승인/반려 및 삭제
• 공지사항 작성/수정/삭제
• QnA/리뷰 운영 관리
• 사용자 대상 알림 발송

5. AI 기능

• OpenAI API를 이용한 학습 챗봇
• 오답 문항 해설 보조 챗봇
• 시험 문제 생성용 AI 서비스 모듈 포함
• 시험 제출 후 오답노트 기록 및 학습 재활용 구조 제공

참고: 현재 ExamService는 문제은행(DB) 기반 시험 출제를 사용하고 있으며, AiExamService는 AI 기반 문제 생성 확장용 서비스로 별도 존재합니다.

기술 스택

Frontend

• React 19
• Vite
• React Router
• Axios
• Tailwind CSS
• Headless UI

Backend

• Java 21
• Spring Boot 3.4
• Spring Web / WebFlux
• Spring Data JPA
• Spring Security
• MySQL
• Lombok

프로젝트 구조

SHS/
├─ Frontend/                # React + Vite 프론트엔드
│  ├─ src/api/              # 백엔드 API 호출 모듈
│  ├─ src/router/           # 전체 라우팅 정의
│  ├─ src/pages/main/       # 공개 메인 페이지
│  ├─ src/pages/lms/        # 학생/강사 LMS 페이지
│  ├─ src/pages/admin/      # 관리자 페이지
│  └─ src/components/       # 공통 UI 컴포넌트
├─ backend/                 # Spring Boot 백엔드
│  ├─ src/main/java/com/shs
│  │  ├─ User/              # 회원/인증/계정 관리
│  │  ├─ admin/             # 관리자 기능
│  │  ├─ courses/           # 강의, 공지, 리뷰, QnA, 찜, 진도
│  │  ├─ enrollments/       # 수강 관리
│  │  ├─ exam/              # 시험, 문제은행, 오답노트
│  │  ├─ chat/              # AI 챗봇
│  │  ├─ notifications/     # 알림 기능
│  │  ├─ subject/           # 과목 관리
│  │  └─ attachment/        # 첨부파일 처리
│  └─ src/main/resources/   # application.properties
└─ *.md                     # 설계/흐름 정리 문서

권한 구조

• STUDENT: 수강, 시험, 오답노트, QnA, 리뷰, 찜, 챗봇
• TEACHER: 강의 등록/수정 요청, 강의실 운영, 공지/QnA 관리
• ADMIN: 회원/과목/강의/공지/리뷰/QnA/알림 운영

Spring Security 설정상 공개 경로와 인증 경로가 분리되어 있으며, LMS 및 관리자 API는 권한별 접근 제어를 적용합니다.

실행 방법

1. 백엔드 실행

backend 디렉터리에서 실행합니다.

cd backend
.\gradlew bootRun

기본 포트:

• Backend: http://localhost:8282

2. 프론트엔드 실행

Frontend 디렉터리에서 실행합니다.

cd Frontend
npm install
npm start

기본 포트:

• Frontend: http://localhost:5173

환경 설정

백엔드는 application.properties 기준으로 다음 환경 변수를 사용합니다.

• DB_PASSWORD: MySQL 비밀번호
• OPENAI_API_KEY: OpenAI API 키

프론트엔드는 Axios 기본 주소를 http://localhost:8282로 사용하며, 세션 기반 인증을 위해 withCredentials: true가 설정되어 있습니다.

참고 문서

저장소 루트에는 구현 흐름을 정리한 문서가 함께 포함되어 있습니다.

• Project_System_Flow.md
• Backend_코드흐름_상세분석.md
• LMS_AI_동작원리_정리.md
• LMS_AI_코드흐름_상세정리.md
• AI 시험 구조.md
• Exam_클래스명세서.md

현재 저장소 기준 특징

• 프론트엔드와 백엔드가 하나의 저장소에서 함께 관리됩니다.
• 메인 서비스, LMS, 관리자 화면이 역할별로 분리되어 있습니다.
• 시험, 오답노트, 챗봇 등 학습 기능이 일반 LMS 기능과 통합되어 있습니다.
• AI 기능은 Spring 서버에서 OpenAI API를 직접 호출하는 구조입니다.