특성화고등학교 학생들을 위한 교육 웹 애플리케이션 개발 프로젝트입니다.

💻 프로젝트 소개

🕰 개발 기간

2023.08.01 ~ 2023.08.24

📚 개발 환경

📌 프로젝트 산출물

1. Usecase Diagram

2. 화면 설계도

화면 설계 링크 : https://ovenapp.io/view/kqNoJGz4tNM76HCoGLTreUfdLWn49gzj/

3. ERD

4. Class Diagram

📱 주요 기능

1. 회원 기능

(1) 회원가입

• 아이디 중복 체크, 비밀번호와 비밀번호 확인의 값이 동일한지 체크한 후, 모든 조건이 true인 경우에만 회원가입할 수 있도록 구현

(2) 로그인

• 아보카도의 기능을 사용하기 위해서는 로그인 필수
• 비로그인 시 FAQ 리스트만 접근 가능

(3) 마이페이지

• 로그인한 사용자의 개인 정보 변경 가능
• mariaDB에 저장되어 있는 암호화된 비밀번호를 복호화하여 input에 password type으로 출력

📷 View

PIC1 : 회원가입

PIC2 : 로그인

PIC3 : 마이페이지

2. 온라인 강의 기능

(1) 과목별 강의 목록

• 과목별 온라인 강의 목록을 확인할 수 있는 화면

(2) 강의 추천

• 강의를 다른 사용자에게 추천할 수 있는 기능 구현
• 추천수를 바탕으로 메인 페이지에 인기 강의 리스트 출력

(3) 강의 플레이어

• 비디오 플레이어를 통해 온라인 강의를 수강할 수 있는 기능 구현
• 재생, 일시정지, 중지, 음량 조 기능이 포함되어 있는 비디오 플레이어 구현

📷 View

PIC1 : 과목별 강의 목록

PIC2 : 강의 정보

PIC3 : 강의 목록

PIC4 : 강의 플레이어

3. 커뮤니티

(1) 커뮤니티

• 커뮤니티 글 작성, 수정, 삭제, 상세 글 보기 기능 구현
• 댓글 기능 구현

📷 View

PIC1 : 커뮤니티 목록

PIC2 : 게시글 상세 보기

PIC3 : 글 수정하기

PIC4 : 글 작성하기

(2) 공지사항

• 공지사항 글 작성, 수정, 삭제, 상세 글 보기 기능 구현
• 관리자만 공지사항의 글을 작성, 수정, 삭제 가능

📷 View

PIC1 : 공지사항 목록

PIC2 : 게시글 상세 보기

PIC3 : 글 수정하기

PIC4 : 글 작성하기

(3) QnA

• QnA의 질문과 답변 글 작성, 수정, 삭제, 상세 보기 기능 구현
• 답변 글 추가 시 화면의 상단에 질문 글이 보이도록 구현
• 질문 글 삭제 시 답변 글도 같이 삭제되도록 구현

📷 View

PIC1 : QnA 목록

PIC2 : 글 상세 보기

PIC3 : 글 수정하기

PIC4 : 질문 글 작성하기

PIC5 : 답변 글 작성하기

(4) FAQ

• 자주 묻는 질문 리스트를 연동된 mariaDB에서 가져와 화면에 출력

📷 View

PIC1 : QnA 목록

5. 회사소개

(1) 오시는 길

• Daum Map API를 활용하여 특정 위도와 경도의 위치를 표현하는 화면 구현

(2) 회사소개

• 아보카도의 슬로건과 비전을 설명하는 화면 구현

📷 View