$$config title: 레벨 테스트 keywords: - IT - ... $$ # 개요 ## 서비스 개요 - 서비스명: 게시판 만들기 - 게시판에서 article에 대해 CRUD 기능이 가능한 서비스 ## 기술 - 스프링부트 - 스프링 DATA JPA - MySQL or H2 - 타임리프 - 롬복 ## 배포 - localhost 로 띄우기 ## 필수기능 - 게시글 CRUD - 조회(리스트 페이지) - 작성 # 1차 요구사항 - 유저가 루트 url로 접속시에 게시글 리스트 페이지(http://주소:포트/article/list)가 나온다. - 리스트 페이지에서는 등록 버튼이 있고 버튼을 누르면 http://주소:포트/article/create 경로로 이동하고 등록 폼이 나온다. - 게시글 등록을 하면 http://주소:포트/article/create로 POST 요청을 보내어 DB에 해당 내용을 저장한다. - 게시글 등록이 되면 해당 게시글 리스트 페이지로 리다이렉트 된다. 페이지 URL 은 http://주소:포트/article/list 이다. - 리스트 페이지에서 해당 게시글을 클릭하면 상세페이지로 이동한다. 해당 경로는 http://주소:포트/article/detail/{id} 가 된다. - 게시글 상세 페이지에는 목록 버튼이 있다. 목록 버튼을 누르면 게시글 리스트 페이지로 이동하게 된다. ## 제출 요구사항 - github 에 소스를 올리고 url 로 제출하세요. - readme.md에 요구사항에 관하여 TodoList 체크를 하세요. - readme.md 구현 설명에 간단히 구현 내용에 대해 설명해주세요. - readme.md 미비사항과 막힌 부분에 대해서 적으세요. - readme.md 파일에 서술형 문제를 풀어서 제출하세요. +) 게시글 리스트 페이지, 게시글 상세 페이지, 게시글 등록 페이지 캡쳐본 오픈톡으로 보내기 +) 알고리즘 20제 확인 캡처 ## readme.md 파일 양식 ``` ## 1차 요구사항 구현 - [ ] 유저가 루트 url로 접속시에 게시글 리스트 페이지(http://주소:포트/article/list)가 나온다. - [ ] 리스트 페이지에서는 등록 버튼이 있고 버튼을 누르면 http://주소:포트/article/create 경로로 이동하고 등록 폼이 나온다. - [ ] 게시글 등록을 하면 http://주소:포트/article/create로 POST 요청을 보내어 DB에 해당 내용을 저장한다. - [ ] 게시글 등록이 되면 해당 게시글 리스트 페이지로 리다이렉트 된다. 페이지 URL 은 http://주소:포트/article/list 이다. - [ ] 리스트 페이지에서 해당 게시글을 클릭하면 상세페이지로 이동한다. 해당 경로는 http://주소:포트/article/detail/{id} 가 된다. - [ ] 게시글 상세 페이지에는 목록 버튼이 있다. 목록 버튼을 누르면 게시글 리스트 페이지로 이동하게 된다. - (추가 기능이나 구현기능설명이 필요한 경우 서술) ## 미비사항 or 막힌 부분 - ... ## MVC 패턴 - ... ## 스프링에서 의존성 주입(DI) 방법 - ... ``` # 2차 ## 기술 - 스프링부트 - 스프링 DATA JPA - MySQL or H2 - 타임리프 - 타임리프 레이아웃 - 롬복 - 스프링시큐리티 - 스프링부트벨리데이션 ## 배포 - localhost 로 띄우기 ## 필수기능 - 게시글 CRUD - 조회(리스트 페이지) - 작성 - 수정 - 삭제 - 검색 기능 - 회원기능 - 회원가입 - 로그인 - 로그아웃 # 2차 요구사항 - 모든 페이지 상단에 루트 디렉토리로 이동하는 버튼이 있다.(예: 로고) - 모든 페이지 상단에 로그인 상태 표시하는 버튼이 있다.(예: 로그인 / 로그아웃) - 게시글 상세페이지(http://주소:포트/article/detail/{id})에 수정 버튼이 있다. 수정 버튼을 누르면 게시글을 수정 할 수 있는 폼이나 오고 수정이 가능하다. - 게시글 상세페이지에 삭제 버튼이 있다. 삭제 버튼을 누르면 게시글이 삭제가 된다. 삭제 후 리스트 페이지로 리다이렉트 된다. - 로그인 버튼을 누르면 로그인 폼으로 이동한다. - 로그인 페이지는 사용자 이메일과 비밀번호를 입력하는 폼으로 구성되고 로그인 버튼을 누르면 데이터 검증 후 로그인이 된다. - 로그아웃 버튼을 누르면 로그아웃이 된다. - 모든 페이지 회원가입 버튼이 있다. 버튼을 누르면 회원가입 폼으로 이동한다. - 회원가입 폼은 이메일, 닉네임, 비빌번호, 비밀번호 확인으로 구성된다. 회원가입 버튼을 누르면 데이터 검증 후 회원가입이 된다. - 유저가 게시글 작성 및 수정 접근시 로그인 여부를 검사한다. 본인 글에 대해서만 수정 / 삭제가 가능하다. - 메인페이지에 검색 기능이 구현되어야 한다. input 박스에 내용을 적고 검색 버튼을 누르면 해당 문자가 포함된 게시글이 리스트업 되어야 한다. ## 제출 요구사항 - github 에 소스를 올리고 url 로 제출하세요. - readme.md에 요구사항에 관하여 TodoList 체크를 하세요. - readme.md 구현 설명에 간단히 구현 내용에 대해 설명해주세요. - readme.md 미비사항과 막힌 부분에 대해서 적으세요. - readme.md 파일에 서술형 문제를 풀어서 제출하세요. +) 기능별 페이지 캡쳐본 오픈톡으로 보내기 +) 알고리즘 확인 캡처 ## readme.md 파일 양식 ``` ## 1차 요구사항 구현 - [ ] 유저가 루트 url로 접속시에 게시글 리스트 페이지(http://주소:포트/article/list)가 나온다. - [ ] 리스트 페이지에서는 등록 버튼이 있고 버튼을 누르면 http://주소:포트/article/create 경로로 이동하고 등록 폼이 나온다. - [ ] 게시글 등록을 하면 http://주소:포트/article/create로 POST 요청을 보내어 DB에 해당 내용을 저장한다. - [ ] 게시글 등록이 되면 해당 게시글 리스트 페이지로 리다이렉트 된다. 페이지 URL 은 http://주소:포트/article/list 이다. - [ ] 리스트 페이지에서 해당 게시글을 클릭하면 상세페이지로 이동한다. 해당 경로는 http://주소:포트/article/detail/{id} 가 된다. - [ ] 게시글 상세 페이지에는 목록 버튼이 있다. 목록 버튼을 누르면 게시글 리스트 페이지로 이동하게 된다. # 2차 요구사항 - [ ] 게시글 상세페이지(http://주소:포트/article/detail/{id})에 수정 버튼이 있다. 수정 버튼을 누르면 게시글을 수정 할 수 있는 폼이나 오고 수정이 가능하다. - [ ] 게시글 상세페이지에 삭제 버튼이 있다. 삭제 버튼을 누르면 게시글이 삭제가 된다. 삭제 후 리스트 페이지로 리다이렉트 된다. - [ ] 모든 페이지 상단에 루트 디렉토리로 이동하는 버튼이 있다.(예: 로고) - [ ] 모든 페이지 상단에 로그인 상태 표시하는 버튼이 있다.(예: 로그인 / 로그아웃) - [ ] 로그인 버튼을 누르면 로그인 폼으로 이동한다. - [ ] 로그인 페이지는 사용자 이메일과 비밀번호를 입력하는 폼으로 구성되고 로그인 버튼을 누르면 데이터 검증 후 로그인이 된다. - [ ] 로그아웃 버튼을 누르면 로그아웃이 된다. - [ ] 모든 페이지 회원가입 버튼이 있다. 버튼을 누르면 회원가입 폼으로 이동한다. - [ ] 회원가입 폼은 이메일, 닉네임, 비빌번호, 비밀번호 확인으로 구성된다. 회원가입 버튼을 누르면 데이터 검증 후 회원가입이 된다. - [ ] 유저가 게시글 작성 및 수정 접근시 로그인 여부를 검사한다. - [ ] 본인 글에 대해서만 수정 / 삭제가 가능하다. - [ ] 메인페이지에 검색 기능이 구현되어야 한다. input 박스에 내용을 적고 검색 버튼을 누르면 해당 문자가 포함된 게시글이 리스트업 되어야 한다. - (추가 기능이나 구현기능설명이 필요한 경우 서술) ## 미비사항 or 막힌 부분 - ... ``` # 3차요구사항 ## 아래 기능 중 3가지 이상을 구현하세요. (난이도 쉬운순으로 정렬) 1. 조회 수 - 1단계 : 단순증가 - 2단계 : 로컬 스토리지 + ajax - 같은 브라우저로는 하나의 글에 대해서 조회 수 증가를 2번 이상할 수 없도록 - 난이도 상 1. 프로필 1. 최근 답변과 최근 댓글 - 최근 댓글은 패스 1. 카테고리 1. 마크다운 에디터 1. 비밀번호 찾기와 변경 - 스프링 부트 이메일로 임시 비번 발송 - 특정 GMAIL 계정으로 발송하지 마세요. 1. 소셜 로그인 - 카카오 로그인 - 구글 로그인 1. 답변 페이징과 정렬 1. 댓글 $$ hide # 필수 시청 영상(객관식 or 서술형 출제 개념) - [영상 - [10분 테코톡] ?범블비의 MVC Pattern](https://youtu.be/es1ckjHOzTI) - [영상 - [10분 테코톡] ? 제리의 MVC 패턴](https://youtu.be/ogaXW6KPc8I) - [영상 - [10분 테코톡] 주디의 Spring Bean](https://youtu.be/3gURJvJw_T4) - [영상 - [10분 테코톡] 오찌, 야호의 DI와 IoC](https://youtu.be/8lp_nHicYd4) - [영상 - [10분 테코톡] ?인비의 DTO vs VO](https://youtu.be/z5fUkck_RZM) - [영상 - JVM, JRE, JDK가 뭔가요?](https://youtu.be/VvVruEDCSSY) - [영상 - [10분 테코톡] ? 웨지의 인텔리제이 디버깅](https://youtu.be/gkutTlwi70s) # 구현 미션(2장) ## 제약사항 - 교재 X - chatGPT O - 구글링 O ## 스프링 셋업 - [start.spring.io](https://start.spring.io/) - Spring Boot DevTools - Lombok - Spring Web - Thymeleaf - H2 Database - Spring Data JPA ## 설정 - application.properties ```bash # DATABASE spring.h2.console.enabled=true spring.h2.console.path=/h2-console spring.datasource.url=jdbc:h2:~/local spring.datasource.driverClassName=org.h2.Driver spring.datasource.username=[아이디] spring.datasource.password= # JPA spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.H2Dialect spring.jpa.hibernate.ddl-auto=update ``` ### 질문(Question) 엔티티 | 속성명 | 설명 | | -- | -- | | id | 질문의 고유 번호 | | subject | 질문의 제목 | | content | 질문의 내용 | create_date | 질문을 작성한 일시 | ### 답변(Answer) 엔티티 속성명 | 설명 | | -- | -- | | id | 답변의 고유 번호| | question | 질문 (어떤 질문의 답변인지 알아야하므로 질문 속성이 필요하다)| | content | 답변의 내용| | create_date | 답변을 작성한 일시| ## 프론트 코드 - question_list ```html

제목	작성일시

``` - question_detail ```html

``` $$