📝 프로젝트 문서화

[taeuk-gang]

프로젝트 산출물 분할요소들

프로젝트 계획서

• 목적: 미세먼지 이슈로 인한 마스크 수요 증가로 미세먼지 마스크 쇼핑몰 사이트 구축

• 사업성

  1. 미세먼지가 사회적 이슈로 사람들의 관심을 끌고있음
  2. 미세먼지 마스크 전문 판매 사이트가 없음
  3. 미세먼지의 심각성·수치를 알리는 컨텐츠 마켓팅 (미세먼지 지도 · 뉴스 리스트)

• 주요 소비층

  일반인	어린이	스포츠맨
  주요 고객층 - 사회적 이슈 영향	대한민국엔 어린이 미세먼지 마스크가 없다를 근거로 해외수입하여 판매	야외 활동을 주로 하는 고객층

요구사항 명세서

화면명	요구사항명	요구사항 내용	담당자	진행사항
공통	다국어처리	- 하나의 파일을 이용하여, 언어 리소스 처리 - 추후 상단 메뉴바에 한글/영어 선택 가능 처리	강태욱	완료(1/2)
컴포넌트	상단 메뉴	- 로그인·마이페이지 링크 연결 - 주문조회·장바구니·관심상품 버튼 추가 - 최근본 상품 팝업창 연결 - 데스크탑 아이콘 생성 버튼 추가 - 마스크샵 타이틀 추가 - 상품 카테고리별 이동 링크 연결	강태욱	진행중
메인 페이지	레이아웃	- 미세먼지 지도 컴포넌트 추가 - 정기배송 배너 추가 - 인기 상품 / 추천 상품 리스트 추가	함성준	진행중
카테고리 페이지	레이아웃	- 선택된 카테고리 / 메뉴명 표시 - 서브 카테고리 이동 링크 추가 - 선택된 카테고리별 상품 페이지별 진열	강태욱	진행중
상품 상세 페이지	레이아웃	- 상품명 / 가격 / 배송비 표시 - 구매 수량 / 사이즈 표시 - 결제 모듈 추가 - 장바구니 / 관심상품 연결 - 상품 후기 / Q&A 게시판 추가	함성준	진행중
로그인 페이지	레이아웃	- ID / PW / 아이디 저장 - 네이버 / 카카오 로그인 방식 추가 - 로그인 방식에 대해서 더 논의 필요...	강태욱	진행중
컴포넌트	미세먼지 지도	- 대한민국 도단위로 미세먼지 수치 표시 - 현재지역의 미세먼지 수치 표시 - 현재시각 표시	강태욱	완료
컴포넌트	하단부	- 회사소개 / 이용약관 / 이용안내 / 고객센터 - 교환·반품 시스템 / 서브메뉴 표시	최수장	진행중
DB	미세먼지 정보	- 미세먼지 정보 지역별로 몽고DB에 저장	이민혁	완료
문서화	마스크 정보	- 판매할 마스크 목록 깃 이슈 문서화	최수장	진행중
공통	환경구축	- 쇼핑몰 사이트 개발환경 / 모니터링 셋팅	전가빈	진행중

DB 설계서

모든 요청과 응답은 JSON을 사용합니다

1 - 회원

	1 . /account [POST]
		새로운 회원을 만듭니다	
	    A. 요청
	        username: 회원아이디 - string
	        phone:	회원 전화번호 - string
	        address: 회원 주소 - string
	        rank: 회원 권한 or 등급 - string
	        mileage: 회원 마일리지 - string
	    B. 응답
	        status : 성공여부
	        message: 응답 메세지

	2. /account [PUT]
		회원의 데이터를 수정합니다. rank는 불가
		A. 요청
			username: 회원아이디
			바꿀 필드 : 바꿀 내용
		B. 응답
			status : 성공여부
			message: 응답 메세지 

	3. /account [PATCH]
		회원의 rank 데이터를 수정합니다
		반드시 해당 토큰이 관리자의 토큰인지 확인
		A. 요청 헤더
			Authorization: Bearer [토큰]
		B. 요청
			username: 회원아이디
			new_rank : 새로운 등급
		C. 응답
			status : 성공여부
			message: 응답 메세지

	4. /account [DELETE]
		회원 데이터 삭제
		반드시 해당 토큰이 관리자의 토큰인지 확인
		A. 요청 헤더
			Authorization: Bearer [토큰]
		B. 요청
			username: 회원아이디
		C. 응답
			status : 성공여부
			message: 응답 메세지

2- 카테고리

	1. /category [GET]
		카테고리 리스트 가져오기
		A. 요청
			category : 카테고리 이름 - string
		B. 응답
			category_list : sub카테고리 리스트 - json

	2. /category [POST]
		카테고리 리스트 추가하기
		반드시 해당 토큰이 관리자의 토큰인지 확인	
		A. 요청 헤더
			Authorization: Bearer [토큰]
		B. 요청
			category : 카테고리 이름
			new_subcategory: 새로운 sub카테고리 - string
		C. 응답
			status : 성공여부
			message: 응답 메세지

    3. /category [DELETE]
        카테고리 리스트 삭제하기
        반드시 해당 토큰이 관리자의 토큰인지 확인
        A. 요청 헤더
            Authorization: Bearer [토큰]
        B. 요청
            category : 카테고리 이름
            new_subcategory: 새로운 sub카테고리 - string
        C. 응답
            status : 성공여부
            message: 응답 메세지

3- 메인페이지 이미지 데이터 제공
4- 서브카테고리

    1. /subcategory [GET]	
   		서브카테고리의 아이템리스트 가져오기
        A. 요청
            category : 카테고리 이름 - string
            subcategory:  sub카테고리 - string
        B. 응답
            itemlist : 아이템리스트 - json - 추후 논의

4- 장바구니

	1 . /cartlist [POST]
        새로운 장바구니리스트를 생성합니다
        A. 요청
            username: 회원아이디 - string
            phone:	회원 전화번호 - string
            address: 회원 주소 - string
            itemname: 아이템이름 - string
            itemsize: 아이템사이즈 - string
            itemnum: 아이템개수 - int
            cycle: 	배송주기 - string
            date: 주문시각 - date
        B. 응답
            status : 성공여부
            message: 응답 메세지

	2. /cartlist [GET]
        장바구니리스트를 가져옵니다
        A. 요청
            username: 회원아이디 - string
        B. 응답
            username: 회원아이디 - string
            phone:	회원 전화번호 - string
            address: 회원 주소 - string
            itemname: 아이템이름 - string
            itemsize: 아이템사이즈 - string
            itemnum: 아이템개수 - int
            cycle: 	배송주기 - string
            date: 주문시각 - date

	3. /cartlist [PUT]
        장바구니 리스트 데이터를 수정합니다
        A. 요청
            no: 장바구니 리스트번호
            username: 회원아이디
        바꿀 필드 : 바꿀 내용
        B. 응답
            status : 성공여부
            message: 응답 메세지 

	4. /cartlist [DELETE]	
		장바구니 리스트 삭제
		A. 요청
			no: 장바구니 리스트번호
			username: 회원아이디
		B. 응답
			status : 성공여부
			message: 응답 메세지

6- 즐겨찾기

 	1 . /favorite [POST]
		새로운 즐겨찾기리스트를 생성합니다
		A. 요청
	 		username: 회원아이디 - string
			itemeno: 아이템번호 - int
			itemname: 아이템이름 - string
		B. 응답
			status : 성공여부
			message: 응답 메세지

    2. /favorite [GET]
        즐겨찾기리스트를 가져옵니다
        A. 요청
            username: 회원아이디 - string
        B. 응답
            username: 회원아이디 - string
            itemeno: 아이템번호 - int
            itemname: 아이템이름 - string
    3. /favorite [DELETE]
        즐겨찾기리스트 삭제
        A. 요청
            username: 회원아이디 - string
            itemeno: 아이템번호 - int
            itemname: 아이템이름 - string
        B. 응답
            status : 성공여부
            message: 응답 메세지

8- 아이템

	1 . /item [POST]
		새로운 아이템을 만듭니다
		반드시 해당 토큰이 관리자의 토큰인지 확인
		A. 요청 헤더
			Authorization: Bearer [토큰]
		B. 요청
	 		itemname: 아이템이름 - string
			company: 회사이름 - string
			img: 아이템사진 - string - 추후논의
			itemprice: 아이템가격- int
			itemsize:  아이템사이즈 - string
			option: 옵션 - json
		C. 응답
			status : 성공여부
			message: 응답 메세지

	2 . /item [GET]
		아이템을 가져옵니다
		A. 요청
	 		itemname: 아이템이름 - string
		B. 응답
			itemname: 아이템이름 - string
			company: 회사이름 - string
			img: 아이템사진 - string - 추후논의
			itemprice: 아이템가격- int
			itemsize:  아이템사이즈 - string
			option: 옵션 - json

	3. /item [PUT]
		아이템의 데이터를 수정합니다
		반드시 해당 토큰이 관리자의 토큰인지 확인
		A. 요청 헤더
			Authorization: Bearer [토큰]
		B. 요청
			itemname: 회원아이디
			바꿀 필드 : 바꿀 내용
		C. 응답
			status : 성공여부
			message: 응답 메세지 

    4. /item [DELETE]
        아이템 데이터 삭제
        반드시 해당 토큰이 관리자의 토큰인지 확인
        A. 요청 헤더
            Authorization: Bearer [토큰]
        B. 요청
            temname: 회원아이디
        C. 응답
            status : 성공여부
            message: 응답 메세지

개발환경 명세서

SERVER OS: Ubuntu 16.04LTS
SERVER LANGUAGE: Node.js
WEB FRAMEWORK: React.js
Code Linter: ESLint
DB: MongoDB

Mask-Shop
├─Components 			// React 작업 폴더
│  ├─fonts			// 폰트파일
│  ├─history			// 브라우저 히스토리 관리
│  ├─lib			// 공용 라이브러리
│  ├─redux			// 클라이언트 데이터 관리 스토어
│  ├─src			// 페이지, 컴포넌트 파일
│  ├─stylesheets		// CSS 디자인 파일
│  └─_locales			// 언어 리소스 파일
├─public			// 공용 소스
│  ├─assets			// 이미지 외 파일
│  └─images			// 이미지 파일
│      └─HomeGallery
│          └─my-icons-collection
│              ├─license
│              └─svg
└─server			// 서버 파일
    ├─config
    └─lib

화면 설계·구현

이름	화면 디자인 이미지(레이아웃)	디자인 이미지(구현)
메인 페이지
상품 카테고리 페이지
상품 상세 페이지
로그인 페이지

• 음... 스토리보드 작성은 전체 페이지 유기적으로 구현 후 추가...

기능 설계·구현

기능	내용
미세먼지 지도	- 현재시간 / 현재지역 / 미세먼지 수치 표시
정기배송 서비스	- 상품 리스트 / 정기배송 달력 표시
로그인 기능	- 세션 유지
관리자 기능	- 메인 페이지 콘텐츠 관리 - 전체 상품 리스트 등록·삭제 등 관리 - 회원정보 관리 - 상품 상세 페이지 관리 - Q&A, 후기 게시판 관리
사용자 기능	- Q&A, 상품후기 이용 - 사용자 등급 부여
결제 기능	- 결제 모듈 연결 및 사용
추가바람	추가바람

테스트 계획서

기능	테스트 방법
메인 페이지 - UI	width * height 조절하면서 확인
메인 페이지 - 링크 연결	모든 링크가 제목에 맞는 URL로 연결되는지 확인
메인 페이지 - 상품 리스트	클릭했을 때, 해당 상품 링크로 이동 확인
메인 페이지 - 미세먼지 지도	1. 시간 확인 2. 현재 지역 확인 3. 지역 마우스 접근시, 해당지역 미세먼지 표시 확인
메인 페이지 - 정기배송 배너	이용하기 버튼 클릭시, 해당 서비스 링크로 이동 확인

테스트 결과보고서

• 테스트 결과 없음