[Web Service Project]9.Spring Security & OAuth 2.0 로그인

스프링 시큐리티 개념 SpringBoot 1.5와 2.0의 차이 구글 서비스 등록 스프링 시큐리티(Spring Security) 인증(Authentication)와 인가(Authorization) 기능을 가진 프레임워크 스프링 기반의 어플리케이션에서는 보안을 위한 표준 인터셉터, 필터 기반의 보안 기능을 구현하는 것보다 스프링 시큐리티를 통해 구현하는 것을 권장 스프링 시큐리티와 스프링 시큐리티 OAuth2 클라이언트 직접 구현하는 경우 개발해야할 기능 로그인 시 보안 비밀번호 찾기 비밀번호 변경 회원가입 시 이메일 혹은 전화번호 인증 회원정보 변경 OAuth 로그인 구현 시 위 목록들을 모두 구글, 페이스북, 네이버 등에 맡겨 서비스 개발에 집중 Spring Boot 2.0의 OAuth 2.0 설정 방..

[Web Service Project]8. 게시글 삭제

게시글 삭제 수정화면에 삭제 버튼 기능 추가 FrontEnd posts-update.mustache update btn-delete 삭제 버튼을 수정 완료 옆에 추가 id가 btn-delete인 버튼의 click 이벤트가 발생하는 경우 게시글 삭제 javaScript delete 함수 호출 {{>layout/header}} 게시글 수정 취소 수정 완료 삭제 {{>layout/footer}} index btn-delete 버튼 이벤트 등록 delete 함수 호출 시 /api/v1/posts/{id} URL 로 DELETE Method 방식으로 호출하여 게시글을 삭제 요청 var main = { init : function () { var _this = this; $('#btn-save').on('click..

[Web Service Project]7. 게시글 수정

게시글 수정 FrontEnd posts-udate.mustache 화면 개발 index.js 스크립트 내에 update 함수 추가 BackEnd IndexController 내에 update 메서드 추가 PostsAPIController내에 postsService의 update 메서드 호출하는 update 메서드 추가 FrontEnd index.mustache index 타이틀(title)에 a tag를 추가 타이틀을 클릭하면 개당 게시글의 수정 화면으로 이동 {{>layout/header}} 스프링 부트로 시작하는 웹 서비스 No. 3 글 등록 게시글번호 제목 작성자 최종수정일 {{#posts}} {{id}} {{title}} {{author}} {{modifiedDate}} {{/posts}} {{>..

[Web Service Project]6. 게시글 전체 조회

View template 수정 BackEnd Posts List Dto 생성 Controller, Service, Repository Query 생성 View Template 수정 Posts를 보여주기위한 table 구성 index.mustache Mustache 문법 {{#posts}} posts라는 List를 순회 Java의 for문과 동일하게 작동 {{id}}등의 {{변수명}} List에서 뽑아낸 객체의 필드를 사용 {{>layout/header}} 스프링 부트로 시작하는 웹 서비스 No. 3 글 등록 게시글번호 제목 작성자 최종수정일 {{#posts}} {{id}} {{title}} {{author}} {{modifiedDate}} {{/posts}} {{>layout/footer}} BackEn..

[Web Service Project]5. 게시글 등록

Mustache를 활용한 게시글 등록화면 만들기 HTML Layout 방식을 활용하여 공통 영역을 별도의 파일로 분리하여 필요한 곳에서 가져다 쓰는 방식 활용 footer, header 공통 영역을 분리 src/main/resources/templates 디렉토리에 layout 디렉토리를 추가로 생성하여 저장 CSS, JavaScript BootStrap, JQuery 등 프론트엔드 라이브러리를 사용 여기서는 외부 CDN을 사용하여 개발, 실제 서비스에서는 직접 라이브러리를 받아서 사용 페이지 로딩속도를 높이기 위해 css 태그는 header, js 태그는 footer에 위치 HTML은 인터프리터언어로 소스코드를 위에서 아래로 읽고 실행하기 때문에 css를 읽지않고는 깨진화면이 보여질 수 있다. Java..

[Web Service Project] 4. 머스테치로 화면 구성하기

4.1 서버 템플릿 엔진과 머스테치 소개 템플릿 엔진 지정된 템플릿 양식과 데이터가 합져져서 HTML 문서를 출력하는 소프트웨어 -> 클라이언트 템플릿 엔진(리액트, 뷰)와는 다름! Nashorn, J2V8 머스테치 기존 템플릿 엔진의 단점 JSP, Velocity : 적합하지 않음 Freemarker : 템플릿 엔진치고 과하게 많은 기능으로, 비즈니스 로직이 추가될 수도 있음 Tymeleaf : 어려움 템플릿 영역은 화면 역할에만 충실해야한다. mustache 장점 - 다른 템플릿 엔진보다 심플하다. - 로직 코드를 사용할 수 없어 View의 역할과 서버의 역할이 명확하게 분리됩니다. - Mustache.js와 Mustache.java 2가지가 다있어서 하나의 문법으로 크언트/서버 템플릿을 모두 사용 ..