spring boot // 200727 // 블로그 글목록보기 / 삭제하기 / 수정하기

 

글목록 보기

IndexController

 

 

PostController

 

 

PostService

 

 

PostRepository

 

 

post_mapper

 

 

jstl 코어 추가

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

 

index.jsp

 

--------------

mysql 한글설정

https://blog.naver.com/getinthere/221765250539

JSP 게시판 만들기 2강 - MySQL 한글 세팅하기

 

https://ondolroom.tistory.com/496

mysql 세팅

---------------

 

링크달기

 

 

-------------

안드로이드 리액트

@GetMapping("/v1/post/{id}")

이런방식으로...

--------------

 

PostController

 

PostService

 

PostRepository

 

PostDetailRespDto

 

post_mapper

 

 

 

 

 

 

 

딜리트 끝나면 메인페이지로

 

삭제하기

 

detail.jsp

 

 

post.jsp

let index = { // 여기서는 이벤트 리스너를 바인딩만 하고
	init : function() {
		
		$("#btn-save").on("click", ()=> { // 리스너
			this.save(); // 콜백
		});
		
		$("#btn-delete").on("click", ()=> { // 리스너
			this.deleteById(); // 콜백
		});
		
	},
	
	save: function() { // 실제 로직은 여기서 실행
		
		let data ={
				title : $("#title").val(),
				content : $("#content").val(),
				userId : $("#userId").val()
		};
		
		$.ajax({ // 주소는 RESTAPI 방식대로 적어야한다 
			
			type:"post",
			url: "/post",
			data: JSON.stringify(data),
			contentType: "application/json; charset=utf-8",  // http에서는
																// Content-Type
																// 라고 씀
			dataType: "json"  // 스프링은 응답할때 스트링일 경우 무조건 json으로 응답한다
			
		}).done((resp)=>{
			
			alert("글쓰기 성공");
			console.log(resp);
			location.href="/";
			
		}).fail((error)=>{
			
			alert("글쓰기 실패");
			console.log(error);
			
		});
		
	},
	
	deleteById: function() { // 실제 로직은 여기서 실행
		
		let data ={
				id : $("#id").val(),
		};
		
		$.ajax({ // 주소는 RESTAPI 방식대로 적어야한다 
			
			type:"delete",
			url: "/post/"+data.id,
//			data: JSON.stringify(data),
//			contentType: "application/json; charset=utf-8",
			dataType: "json"  // 스프링은 응답할때 스트링일 경우 무조건 json으로 응답한다
			
		}).done((resp)=>{
			
			alert("삭제 성공");
			location.href="/";
			
		}).fail((error)=>{
			
			alert("삭제 실패");
			console.log(error);
			
		});
		
	}
}

index.init();

 

 

 

 

PostController

 

 

PostService

 

 

PostRepository

 

 

post_mapper

 

-----------

 

수정버튼 누르면 수정모드로 변경

 

post.js

 

 

 

 

----------------

 

게시물 수정하기

 

post.js

 

 

 

PostController

 

 

PostService

 

 

PostRepository

 

 

post_mapper

 

 

-------------------

해당 태그 숨기기 보여주기

$(선택자).hide();
$(선택자).show();

-----------------

 

삭제시 본인 확인

 

post.js

 

PostController

방식1