Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/shinyeeun789/education-web

특성화고등학교 학생을 위한 교육 웹 애플리케이션
https://github.com/shinyeeun789/education-web

css3 education-website html5 javascript jsp mariadb

Last synced: about 1 month ago
JSON representation

특성화고등학교 학생을 위한 교육 웹 애플리케이션

Awesome Lists containing this project

README

        


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

## 💻 프로젝트 소개

### 🕰 개발 기간
2023.08.01 ~ 2023.08.24

### 📚 개발 환경
![Java](https://img.shields.io/badge/Java-007396.svg?&style=for-the-badge&logo=Java&logoColor=white)
![HTML5](https://img.shields.io/badge/html5-E34F26?style=for-the-badge&logo=html5&logoColor=white)
![css3](https://img.shields.io/badge/css-1572B6?style=for-the-badge&logo=css3&logoColor=white)
![JavaScript](https://img.shields.io/badge/javascript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
![ApacheTomcat](https://img.shields.io/badge/ApacheTomcat-F8DC75?style=for-the-badge&logo=ApacheTomcat&logoColor=black)


## 📌 프로젝트 산출물
### 1. Usecase Diagram
usecase diagram1
usecase diagram2
usecase diagram3

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

### 3. ERD
ERD

### 4. Class Diagram
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 : 커뮤니티 목록




image

PIC2 : 게시글 상세 보기




image

PIC3 : 글 수정하기




image

PIC4 : 글 작성하기

#### (2) 공지사항
- 공지사항 글 작성, 수정, 삭제, 상세 글 보기 기능 구현
- 관리자만 공지사항의 글을 작성, 수정, 삭제 가능
#### 📷 View



image

PIC1 : 공지사항 목록




image

PIC2 : 게시글 상세 보기




image

PIC3 : 글 수정하기




image

PIC4 : 글 작성하기


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



image

PIC1 : QnA 목록




image

PIC2 : 글 상세 보기




image

PIC3 : 글 수정하기




image

PIC4 : 질문 글 작성하기




image

PIC5 : 답변 글 작성하기

#### (4) FAQ
- 자주 묻는 질문 리스트를 연동된 mariaDB에서 가져와 화면에 출력
#### 📷 View



image

PIC1 : QnA 목록

### 5. 회사소개
#### (1) 오시는 길
- Daum Map API를 활용하여 특정 위도와 경도의 위치를 표현하는 화면 구현
#### (2) 회사소개
- 아보카도의 슬로건과 비전을 설명하는 화면 구현
#### 📷 View



image





스크린샷 2023-08-23 171743