본문 바로가기

Vue2

Vue 게시판 (2) PostsReg.vue (글 등록) 새로운 글 등록 제목 본문 목록으로 저장 PostsDetail.vue(글 상세조회, 수정, 삭제) 게시글 상세 작성자 : {{posts.author}} ({{posts.createdDate}}) 제목 본문 작성글 본문 테스트중입니다 목록으로 수정 삭제 저장 취소 글 상세 글 수정 글 삭제 삭제 후 글이 10건이므로 페이징 처리가 필요없어서 페이지 버튼은 표출되지 않았다. 상세조회, 수정, 삭제 API는 따로 건드릴게 없으므로 코드를 첨부하지는 않았다. 이제 여기서 더 추가할 것은 로그인이다. 로그인을 통해 사용자를 식별하고 작성자 정보는 프론트가 아닌 서버에서 확인하는 것으로 변경하여 등록이나 수정마다 현재는 작성자, 수정자가 코드로 고정이 되어있는데 이 부분을 수정할.. 2023. 1. 1.
Vue 게시판 (1) JPA CRUD(1) JPA에 대해 공부하면서 실제로 어떻게 적용해 사용하는지 알아보기 위해 REST API 방식의 CRUD를 구현해복자 한다. 게시판을 만든다는 가정하게 코드를 작성할 것이다. 따라서 REST API + SPA 로 분리하 hyo7730.tistory.com 이전에 JPA 로 구현했던 API에 요청할 수 있는 클라이언트 화면을 Vue를 통해 구현해봤다. 들어가기전에 Vue 2버전과 3버전은 차이가 있으니 이 점 참고해야한다. 그 외 생성과 동시에 npm을 통해 추가로 설치한 도구들이 있다. vue router 3.x.x (router) axios 0.2x.x (ajax) v-pagination-3 (테이블 페이징 컴포넌트) App.vue 가장 최상단 컴포넌트이다. 내가 작성한 코드들은 랜.. 2023. 1. 1.