슬기로운 개발생활

신입 백엔드 포트폴리오 만들기 - 프로젝트 명세서

by coco3o
반응형

취업을 위한 개인 포트폴리오를 만들어보려고 한다.

우선 먼저 생각해야 할 것은 프로젝트 명세서를 작성해 보는 것이다.

고민해본 프로젝트 명세서는 다음과 같다.

1. 아이템 선정
2. 개요
3. 요구사항 분석
4. DB 설계
5. API 설계
6. 화면 설계서
7. 개발 및 테스트
8. 배포
9. 도메인 설정
10. ReadMe 및 포트폴리오 ( 자소서 ) 작성
11. 회고

 

1. 아이템 선정

전반적인 웹의 기본 소양이 되는 CRUD 게시판을 만들고, 기능을 하나씩 추가해 나가는 식으로 진행한다.


2. 개요

  • 프로젝트 명칭 : Board Service
  • 개발 인원 : 1명
  • 개발 기간 : 2021.11.10 ~ 2022.01.10
  • 주요 기능 :
    • 게시판 - CRUD 기능, 조회수, 페이징 및 검색 처리
    • 사용자 - Security 회원가입 및 로그인, OAuth 2.0 구글, 네이버 로그인, 회원 정보 수정, 유효성 검사 및 중복 검사
    • 댓글 - CRUD 기능 
  • 개발 언어 : Java 11
  • 개발 환경 : SpringBoot 2.5.6, gradle 7.2, jpa(Spring Data JPA), Spring Security, Oauth 2.0, mustache
  • 데이터베이스 : MySQL
  • 형상관리 툴 : GitHub
  • 간단 소개 : 전반적인 웹의 기본 소양이 되는 게시판

3. 요구사항 분석

1. 회원 가입 페이지

  • 유효성 검사
    • 닉네임은 최소 2~10자이며, 특수문자를 제외한 한글 (ㄱ~ㅎ, 가~힣), 알파벳 대소문자(a~z, A~Z), 숫자(0~9)로 구성
    • 이메일 형식 패턴 적용해 확인
    • 한 개의 칸이라도 공백 혹은 빈칸이 있는지 확인하고 있다면, "OOO는 필수 입력 값입니다."의 메시지 보여주기
    • 비밀번호는 최소 8~16자 이상이며, 영문 대 소문자, 숫자, 특수문자를 사용하게 하기
  • 중복확인
    • 데이터베이스에 존재하는 아이디를 입력한 채 회원가입 버튼을 누른 경우 "이미 사용중인 아이디입니다."의 메시지를 보여주기
    • 데이터베이스에 존재하는 이메일을 입력한 채 회원가입 버튼을 누른 경우 "이미 사용중인 이메일입니다."의 메시지를 보여주기
    • 데이터베이스에 존재하는 닉네임을 입력한 채 회원가입 버튼을 누른 경우 "이미 사용중인 닉네임입니다."의 메시지를 보여주기
    • 모든 검사가 통과되었다면 로그인 페이지로 이동시키기

2. 로그인 페이지

  • 로그인을 하지 않은 경우 아래 페이지만 이용가능
    • 회원가입 페이지
    • 로그인 페이지
    • 게시글 목록 조회 페이지
    • 게시글 상세보기 페이지
    • 게시글 검색 페이지
    • 그 외 로그인을 하지 않거나 올바르지 않은 경로로 접속한 사용자가 로그인이 필요한 경로에 접속한 경우 로그인 페이지로 이동
  • 로그인 검사
    • 아이디와 비밀번호가 일치하지 않을 시 "아이디 또는 비밀번호가 일치하지 않습니다. "의 메시지를 보여주기
    • 이외의 다른 에러 메시지 또한 처리하기
    • 모든 검사가 통과되었다면 로그인 후 index 페이지로 이동시키기

3. 회원정보 수정

  • 회원정보 수정은 닉네임, 비밀번호만 가능
  • 수정란이 빈칸 혹은 공백으로 된 경우 “공백 또는 입력하지 않은 부분이 있습니다.”의 메시지 보여주기
  • 닉네임이 중복확인을 통해 중복일 경우 “이미 사용중인 닉네임입니다.” 메시지 보여주기
  • 닉네임은 최소 2~10자이며, 특수문자를 제외한 한글 (ㄱ~ㅎ, 가~힣), 알파벳 대소문자(a~z, A~Z), 숫자(0~9)만 가능
  • 비밀번호 수정 또한 최소 8자~16자이며, 영문 대 소문자, 숫자, 특수문자를 사용하게 하기
  • 수정 완료 시 수정 날짜 업데이트해주기

4. 소셜 로그인 기능 만들기

  • 구글, 네이버 로그인이 가능하도록 하기
  • 데이터베이스에 이미 존재하는 이메일이 있을 시 기존 회원 데이터 정보를 유지하기
  • 소셜 로그인 사용자도 닉네임, 비밀번호 설정이 가능하고, 일반 로그인도 가능하게 하기

5. 게시글 검사

  • 게시글 작성, 수정 시 제목과 내용은 공백 혹은 빈칸으로 작성하지 않도록 하기
  • 내가 작성한 글만 수정, 삭제 가능하게 하기
  • 로그인을 하지 않고 글 작성 버튼을 누른 경우 로그인 페이지로 이동

6. 댓글 검사

  • 댓글은 로그인한 사용자만 작성 가능하게 하기
  • 댓글 작성 및 수정시 빈칸 혹은 공백으로 된 경우 “공백 또는 입력하지 않은 부분이 있습니다”의 메시지 보여주기
  • 댓글 수정 및 삭제는 해당 댓글 작성자만 가능하게 하기
  • 게시글 삭제 시 해당 댓글 데이터도 같이 삭제되게 하기

4. DB 설계

created_date와 modified_date는 날짜 포맷을 적용해주어 datetime > varchar로 변경


5. API 설계


6. 와이어프레임 ( 화면 설계서 )

게시글 관련

더보기

1. 게시글 전체 목록

전체 목록을 페이징 처리하여 조회할 수 있다.

2. 게시글 등록

로그인한 사용자만 새로운 글을 작성할 수 있고, 작성 후 목록 화면으로 redirect 한다.

3. 게시글 상세보기

본인이 작성한 글만 수정 및 삭제가 가능하다.

4. 게시글 수정 화면

제목과 내용만 수정할 수 있고 수정 여부를 확인 후 상세보기 화면으로 redirect 한다.

5. 게시글 삭제 화면

삭제 후 전체 리스트 화면으로 redirect 한다.

6. 게시글 검색 화면

검색 키워드에 포함된 글을 모두 보여준다.

검색된 게시글이 많을 경우 다음과 같이 페이징 처리되어 조회할 수 있다.


회원 관련

더보기

1. 회원가입 화면

회원가입 시 유효성 검사 및 중복확인을 진행하며 완료 시 회원 정보를 저장하고 로그인 화면으로 이동시킨다.

2. 로그인 화면

로그인 실패 시 어떤 이유로 실패했는지 메시지가 나오고, 로그인에 성공하면 게시글 전체 리스트 화면으로 redirect 한다.

2-1. OAuth 2.0 소셜 로그인 화면

3. 회원정보 수정 화면

닉네임과 비밀번호만 변경할 수 있고, 변경된 닉네임이 중복될 경우 현재 사용 중임을 알려주고

완료 시 게시글 전체 리스트 화면으로 redirect 한다.


3. 댓글 관련

더보기

1. 댓글 작성 화면

미로그인 화면
로그인 화면

댓글은 로그인 한 사용자만 달 수 있으며, 댓글 작성 완료시 현재 페이지를 reload 한다.

2. 댓글 수정

댓글 수정은 작성자만이 할 수 있다.

수정 완료 후 현재 페이지를 reload 한다.

3. 댓글 삭제

댓글 삭제 또한 댓글 작성자만이 할 수 있다.


7. 개발 내용

  • 게시판 CRUD 작성 후부터 블로그에 기록했기 때문에 해당 부분은 생략하겠다. (아래 깃허브 코드 참고)
  1. Spring Boot JPA 게시판 조회수 기능 추가
  2. Spring Boot JPA 게시판 페이징 처리 구현
  3. Spring Boot JPA 게시판 검색 기능 & 검색 페이징 구현
  4. Spring Boot JPA 게시판 LocalDateTime format 변경하기
  5. Spring Boot JPA 게시판 Security 회원가입,로그인 구현
  6. Mustache CSRF 적용 및 문제해결
  7. 커스텀 어노테이션을 통해 중복코드 개선
  8. Spring Boot 회원가입 Validation 유효성 검사하기
  9. Spring Boot 게시판 Validation을 커스텀하여 회원가입 중복검사 구현
  10. Spring Boot 게시판 Security 로그인 실패시 메시지 출력하기
  11. Spring Boot 게시판 Security 회원정보 수정(ajax) 구현
  12. Spring Boot 게시판 OAuth 2.0 구글 로그인 구현
  13. Spring Boot 게시판 OAuth 2.0 네이버 로그인 구현
  14. Spring Boot 게시판 JPA 연관관계 매핑으로 글 작성자만 수정,삭제 가능하게 하기
  15. Spring Boot JPA 게시판 댓글 작성 및 조회 구현하기
  16. 양방향 순환참조 문제 및 해결방법
  17. Spring Boot JPA 게시판 댓글 수정 및 삭제 구현하기
  18. Spring Boot JPA 게시판 댓글 작성자만 수정,삭제 가능하게 하기
  19. [리팩토링]DTO Inner Class로 한번에 관리하기

프로젝트 주소 : https://github.com/hojunnnnn/board

 

GitHub - hojunnnnn/board: Spring Boot, JPA, Spring Security로 만든 게시판 웹 사이트 프로젝트입니다.

Spring Boot, JPA, Spring Security로 만든 게시판 웹 사이트 프로젝트입니다. - GitHub - hojunnnnn/board: Spring Boot, JPA, Spring Security로 만든 게시판 웹 사이트 프로젝트입니다.

github.com

 

반응형

블로그의 정보

슬기로운 개발생활

coco3o

활동하기