프로그램 소개 사이트 개발 #2 | 사이트맵 작성, 화면 설계도, 화면별 프로세스, DB 설계 | 기획

앞선 포스팅
프로그램 소개 사이트 개발 #1 | 웹 개발에 대한 이해, 기획 (tistory.com)

---

목차

프로젝트 계획서
사이트 맵 작성
화면 설계
화면별 프로세스 설계
DB 설계

---

프로젝트 계획서

개요
* 프로그램 소개 사이트를 개발한다. 프로그램 소개 내용은 차차(?) 정한다.
* 사용자
사이트에 가입할 수 있다.
게시판에 글을 작성하면서 자료를 업로드할 수 있다.
업로드시 학생 / 교사를 구분해준다.
문서의 일부를 드래그해서 코멘트를 달거나, 댓글을 달거나, 공감을 표시할 수 있다.
마이페이지에서는 참여 온도가 부여된다.
* 관리자
공지사항에 글을 게시할 수 있다.
사용자 DB 조회 가능함
* 프로젝트는 (Html, CSS, JavaScript), (Python)를 사용한다.
* 데이터베이스로는 MySQL을 사용한다.
* 개발의 각 단계에서는 티스토리에 문서화해둔다.

산출물
* config : 환경 설정 파일
* readME : 설명 문서
* UML 다이어그램 : Use Case Diagram, UML class diagram
* Test plan : test case를 만들고 각각을 테스트
* source code

 

타임라인

이름	시작 날짜	완료 날짜	기타
UML use case diagram	22.1.9.
프로젝트 Test case 정리	22.1.9.
데이터베이스 테이블 작성	22.1.9.
개발 환경 설정	22.1.9.
UML 클래스 다이어그램 작성	22.1.9.
디자인
기능 구현
검토
배포

테스트 케이스

기능	테스트 내용	입력	예상 결과
회원가입
로그인
탐색(페이지 뷰)
게시판 글 작성
댓글
좋아요
마이페이지
관리자 - 사용자 DB 조회
관리자 - 공지사항 글 업로드

 

---

UML Use case diagram

Use case diagram이란, 시스템과 사용자의 상호작용을 다이어그램으로 표현한 것으로 사용자의 관점에서 시스템의 서비스 혹은 기능 및 그와 관련한 외부 요소를 보여주는 것이다.

이번 프로젝트에서는 주요한 기능이 [회원가입], [로그인], [탐색], [게시판 글 작성/업로드], [댓글/좋아요], [마이페이지], [관리자/DB조회], [관리자/공지사항 글 업로드]이다. 이 기능에 맞추어 UML을 그려보면 될 것 같다. (권한에 관한 것도 지정해야함 ex-로그인 없이 글 작성 불가함)

---

스토리보드 설계 : 화면별 프로세스 / 화면

 

 

 

 

---

DB 설계 : MySQL

- 교육 관련 사이트이므로 LMS DB 설계 참고하기 :)

[펌] 이러닝 시스템 중 LMS 데이타베이스 이렇게 설계하자. : 네이버 블로그 (naver.com)

 [회원가입], [로그인], [탐색], [게시판 글 작성/업로드], [댓글/좋아요], [마이페이지], [관리자/DB조회], [관리자/공지사항 글 업로드]

 

 

 

---

참고 자료

[펌] 이러닝 시스템 중 LMS 데이타베이스 이렇게 설계하자. : 네이버 블로그 (naver.com)
으랏차 :: 간단한 쇼핑몰 DB설계 및 DB에 데이터를 입출력하는 웹페이지 제작 (tistory.com)
[ 쇼핑몰 웹 사이트 개발하기 ] 7. UML 클래스 다이어그램 그리기 : 네이버 블로그 (naver.com)
UI / UX 디자인할때 유용한 자료와 웹사이트 (tistory.com)
IT 기획 연구소 (yslab.kr)
으랏차 :: 간단한 쇼핑몰 DB설계 및 DB에 데이터를 입출력하는 웹페이지 제작 (tistory.com)
[웹/앱 설계의 기본] 화면설계서 작성방법 (brunch.co.kr)
[ 쇼핑몰 웹 사이트 개발하기 ] 3. 프로젝트 계획서 작성 : 네이버 블로그 (naver.com)