프로젝트 배경
문제점
- n개월 동안 장기 진행되는 부트캠프 과정(백엔드/프론트엔드/스마트모빌리티/AI 등)의 교안, 실습자료, 부록이 노션·드라이브 등에 분산되어 학습 효율이 저하되었습니다.
- 수강생별 학습 진도와 이해도를 실시간으로 파악하기 어려워 맞춤형 피드백 제공에 한계가 있었습니다.
- 팀 프로젝트 진행 시 발표 일정, 피드백, 배포 현황을 통합 관리할 수 있는 시스템이 부재했습니다.
- 학습 중 이해도를 점검할 수 있는 테스트 시스템이 없어 수강생의 취약 부분을 조기에 발견하기 어려웠습니다.
달성하고자 한 목표
- 4개월 커리큘럼의 PDF 교안, Figma 클론 실습 프로젝트, 부록 자료를 통합 제공하는 학습 플랫폼 개발
- 챕터별 이해도 테스트와 학습 진척도 대시보드로 수강생 개인별 학습 현황 추적
- 팀 프로젝트 매칭, 발표 일정 관리, 멘토 피드백 시스템 구축
- 프로젝트 배포 가이드 및 배포 URL 관리 기능으로 실무 배포까지 원스톱 지원
주안점
- PDF 교안을 웹에서 바로 열람할 수 있는 인앱 뷰어 구현 (다운로드 없이 학습 가능)
- 객관식/코드 제출형 테스트로 이론과 실습 이해도를 함께 점검하는 시스템 설계
- 수강생 대시보드에서 커리큘럼 진도율, 테스트 점수, 팀 프로젝트 현황을 한눈에 파악
- 어드민 페이지에서 전체 수강생의 학습 현황을 모니터링하고 콘텐츠를 관리할 수 있는 백오피스 구축
- n개월 동안 장기 진행되는 부트캠프 과정(백엔드/프론트엔드/스마트모빌리티/AI 등)의 교안, 실습자료, 부록이 노션·드라이브 등에 분산되어 학습 효율이 저하되었습니다.
- 수강생별 학습 진도와 이해도를 실시간으로 파악하기 어려워 맞춤형 피드백 제공에 한계가 있었습니다.
- 팀 프로젝트 진행 시 발표 일정, 피드백, 배포 현황을 통합 관리할 수 있는 시스템이 부재했습니다.
- 학습 중 이해도를 점검할 수 있는 테스트 시스템이 없어 수강생의 취약 부분을 조기에 발견하기 어려웠습니다.
달성하고자 한 목표
- 4개월 커리큘럼의 PDF 교안, Figma 클론 실습 프로젝트, 부록 자료를 통합 제공하는 학습 플랫폼 개발
- 챕터별 이해도 테스트와 학습 진척도 대시보드로 수강생 개인별 학습 현황 추적
- 팀 프로젝트 매칭, 발표 일정 관리, 멘토 피드백 시스템 구축
- 프로젝트 배포 가이드 및 배포 URL 관리 기능으로 실무 배포까지 원스톱 지원
주안점
- PDF 교안을 웹에서 바로 열람할 수 있는 인앱 뷰어 구현 (다운로드 없이 학습 가능)
- 객관식/코드 제출형 테스트로 이론과 실습 이해도를 함께 점검하는 시스템 설계
- 수강생 대시보드에서 커리큘럼 진도율, 테스트 점수, 팀 프로젝트 현황을 한눈에 파악
- 어드민 페이지에서 전체 수강생의 학습 현황을 모니터링하고 콘텐츠를 관리할 수 있는 백오피스 구축
프로젝트 성과
커리큘럼 & 교안 뷰어
수강생용 10개 화면 + 어드민용 5개 화면 = 총 15개 화면 개발
학습 완료 체크 시 진도율이 자동 갱신되어 대시보드에 실시간 반영
학습 완료 체크 시 진도율이 자동 갱신되어 대시보드에 실시간 반영
챕터별 이해도 테스트
챕터당 평균 10문항 × 40챕터 = 400문항+ 테스트 뱅크 구축
수강생별 취약 챕터를 자동 분석하여 "복습 추천" 알림 제공, 어드민에서 전체 수강생의 평균 점수 및 오답률 높은 문항 통계 확인 가능
수강생별 취약 챕터를 자동 분석하여 "복습 추천" 알림 제공, 어드민에서 전체 수강생의 평균 점수 및 오답률 높은 문항 통계 확인 가능
팀 프로젝트 관리 시스템
발표 후 멘토가 항목별(기획력/기술구현/발표력/협업) 점수와 코멘트를 남기면 팀원 전체가 열람 가능. 코드 리뷰 댓글 기능으로 상세 피드백 지원
관리자 백오피스
4개월(16주) 커리큘럼 × 3개 트랙(백엔드/프론트엔드/스마트모빌리티) 콘텐츠 통합 관리
기획/디자인/프론트엔드/백엔드/배포 전 과정 풀스택 개발
기획/디자인/프론트엔드/백엔드/배포 전 과정 풀스택 개발
핵심 기능

학습 콘텐츠 통합 관리
4개월 과정의 주차별/챕터별 커리큘럼 목록을 제공하고, PDF 교안을 웹 내에서 바로 열람 가능. Figma 클론 실습 프로젝트 링크 연동, 핵심 요약 부록 자료 다운로드 기능 포함

이해도 테스트 시스템
각 챕터 학습 완료 후 객관식 문제 및 코드 제출형 문제로 이해도 점검. 제출 즉시 채점 결과와 오답 해설 제공. 테스트 점수 이력 관리

팀 프로젝트 & 피드백
팀 매칭 후 팀별 페이지 생성. 프로젝트 진행 현황(기획/개발/배포 단계), 발표 일정 등록, 발표자료 업로드, 멘토 피드백 작성/열람 기능 제공

어드민 & 수강생 관리
전체 수강생의 학습 진도율, 테스트 점수, 팀 프로젝트 현황을 테이블/차트로 조회. PDF 교안 및 테스트 문항 업로드/수정. 공지사항, 일정 관리 기능
진행 단계
기획/설계
2024.03.
요구사항 분석, 4개월 커리큘럼 구조 설계, 화면 설계서 작성
디자인
2024.03.
UI/UX 디자인, 학습자용/어드민용 화면 15개 설계
백엔드 개발
2024.04.
FastAPI 서버 구축, PostgreSQL DB, S3 파일 업로드, JWT 인증
프론트엔드 개발
2024.04.
React + TypeScript, PDF 뷰어, 대시보드, 테스트 시스템 구현
배포/운영
2024.06.
실제 교안 데이터 연동 테스트, AWS 배포, 운영
프로젝트 상세
본 프로젝트는 부트캠프 교육과정(백엔드/프론트엔드/스마트모빌리티 등)을
운영하며 축적한 교안, 실습자료, 평가 시스템을 통합한 학습관리시스템(LMS) 플랫폼 개발 프로젝트입니다.
[수강생용 주요 기능]
1. 대시보드 (메인)
- 내 학습 현황: 전체 진도율 (%), 이번 주 학습 목표
- 최근 학습 이어하기: 마지막으로 본 교안 바로가기
- 다가오는 일정: 테스트 마감일, 발표일 등
- 팀 프로젝트 현황: 현재 단계, 팀원 목록
2. 커리큘럼 & 교안
- 트랙 선택: 백엔드 / 프론트엔드 / 스마트모빌리티
- 주차별 챕터 목록: 1주차~16주차, 챕터별 학습 완료 체크
- PDF 교안 뷰어: 웹 내 인앱 뷰어, 페이지 이동, 확대/축소
- 실습 프로젝트: Figma 클론 실습 링크 (예: 인스타그램 클론, 쇼핑몰 클론)
- 부록 자료: 핵심 요약본 PDF 다운로드
3. 이해도 테스트
- 챕터별 테스트 진입: 학습 완료 후 테스트 버튼 활성화
- 문제 유형: 객관식 (4지선다), 코드 제출형 (정답 코드 비교)
- 제출 & 채점: 즉시 채점, 점수 및 오답 해설 표시
- 테스트 이력: 과거 테스트 점수 목록, 재응시 가능
4. 팀 프로젝트
- 팀 페이지: 팀명, 팀원 목록, 프로젝트 주제
- 진행 현황: 기획 → 디자인 → 개발 → 배포 단계 표시
- 발표 일정: 중간발표/최종발표 날짜, 발표자료 업로드
- 멘토 피드백: 발표 후 멘토 피드백 열람 (항목별 점수 + 코멘트)
- 배포 URL 등록: 최종 배포 링크, 시연 영상 업로드
5. 마이페이지
- 내 정보: 이름, 이메일, 트랙, 기수
- 학습 통계: 총 학습 시간, 완료 챕터 수, 평균 테스트 점수
- 수료증: 전체 과정 완료 시 수료증 발급 (PDF 다운로드)
[어드민용 주요 기능]
1. 수강생 관리
- 전체 수강생 목록: 이름, 트랙, 진도율, 평균 점수, 상태
- 필터링: 진도율 80% 미만, 테스트 60점 미만 → "관리 필요" 자동 표시
- 개별 상세: 수강생별 챕터별 진도, 테스트 점수 이력
2. 콘텐츠 관리
- 교안 업로드: 트랙/주차/챕터 선택 후 PDF 업로드
- 테스트 문항 관리: 문제 추가/수정/삭제, 정답 설정
- 부록 자료 관리: 부록 PDF 업로드/삭제
3. 테스트 통계
- 챕터별 평균 점수, 오답률 높은 문항 Top 10
- 수강생별 테스트 점수 분포 차트
4. 공지사항 & 일정
- 공지사항 작성/수정/삭제
- 일정 등록: 테스트 마감일, 발표일, 휴강일 등
5. 팀 프로젝트 관리
- 팀 목록: 팀명, 팀원, 진행 단계, 멘토 배정
- 피드백 작성: 발표 후 항목별 점수 및 코멘트 입력
[사용 기술 스택]
- Frontend: React, TypeScript
- Backend: FastAPI (Python)
- Database: PostgreSQL
- Storage: AWS S3 (PDF, 영상 파일)
- Authentication: JWT 기반 인증
- PDF Viewer: react-pdf 또는 PDF.js
- Deployment: AWS EC2 / Vercel
운영하며 축적한 교안, 실습자료, 평가 시스템을 통합한 학습관리시스템(LMS) 플랫폼 개발 프로젝트입니다.
[수강생용 주요 기능]
1. 대시보드 (메인)
- 내 학습 현황: 전체 진도율 (%), 이번 주 학습 목표
- 최근 학습 이어하기: 마지막으로 본 교안 바로가기
- 다가오는 일정: 테스트 마감일, 발표일 등
- 팀 프로젝트 현황: 현재 단계, 팀원 목록
2. 커리큘럼 & 교안
- 트랙 선택: 백엔드 / 프론트엔드 / 스마트모빌리티
- 주차별 챕터 목록: 1주차~16주차, 챕터별 학습 완료 체크
- PDF 교안 뷰어: 웹 내 인앱 뷰어, 페이지 이동, 확대/축소
- 실습 프로젝트: Figma 클론 실습 링크 (예: 인스타그램 클론, 쇼핑몰 클론)
- 부록 자료: 핵심 요약본 PDF 다운로드
3. 이해도 테스트
- 챕터별 테스트 진입: 학습 완료 후 테스트 버튼 활성화
- 문제 유형: 객관식 (4지선다), 코드 제출형 (정답 코드 비교)
- 제출 & 채점: 즉시 채점, 점수 및 오답 해설 표시
- 테스트 이력: 과거 테스트 점수 목록, 재응시 가능
4. 팀 프로젝트
- 팀 페이지: 팀명, 팀원 목록, 프로젝트 주제
- 진행 현황: 기획 → 디자인 → 개발 → 배포 단계 표시
- 발표 일정: 중간발표/최종발표 날짜, 발표자료 업로드
- 멘토 피드백: 발표 후 멘토 피드백 열람 (항목별 점수 + 코멘트)
- 배포 URL 등록: 최종 배포 링크, 시연 영상 업로드
5. 마이페이지
- 내 정보: 이름, 이메일, 트랙, 기수
- 학습 통계: 총 학습 시간, 완료 챕터 수, 평균 테스트 점수
- 수료증: 전체 과정 완료 시 수료증 발급 (PDF 다운로드)
[어드민용 주요 기능]
1. 수강생 관리
- 전체 수강생 목록: 이름, 트랙, 진도율, 평균 점수, 상태
- 필터링: 진도율 80% 미만, 테스트 60점 미만 → "관리 필요" 자동 표시
- 개별 상세: 수강생별 챕터별 진도, 테스트 점수 이력
2. 콘텐츠 관리
- 교안 업로드: 트랙/주차/챕터 선택 후 PDF 업로드
- 테스트 문항 관리: 문제 추가/수정/삭제, 정답 설정
- 부록 자료 관리: 부록 PDF 업로드/삭제
3. 테스트 통계
- 챕터별 평균 점수, 오답률 높은 문항 Top 10
- 수강생별 테스트 점수 분포 차트
4. 공지사항 & 일정
- 공지사항 작성/수정/삭제
- 일정 등록: 테스트 마감일, 발표일, 휴강일 등
5. 팀 프로젝트 관리
- 팀 목록: 팀명, 팀원, 진행 단계, 멘토 배정
- 피드백 작성: 발표 후 항목별 점수 및 코멘트 입력
[사용 기술 스택]
- Frontend: React, TypeScript
- Backend: FastAPI (Python)
- Database: PostgreSQL
- Storage: AWS S3 (PDF, 영상 파일)
- Authentication: JWT 기반 인증
- PDF Viewer: react-pdf 또는 PDF.js
- Deployment: AWS EC2 / Vercel








