오늘은 '목록으로' 버튼을 클릭 했을때 게시글 목록 조회 화면으로 돌아가는 기능을 구현해보자 📚 VS code 📕 boardDetail.jsp 수정 삭제 목록으로 📕 boardDetail.jsp const goToListBtn = document.getElementById("goToListBtn"); goToListBtn.addEventListener("click", ()=>{ // 이동할 주소 저장 let url = "/board/" + boardCode; // URL 내장 객체 : 주소 관련 정보를 나타내는 객체 // URL.searchParams : 쿼리스트링만 별도 객체로 반환 const params = new URL(location.href).searchParams; let cp; if(para..
ON/spring
이제까지 게시글 조회/ 수정 / 삽입을 구현해보았다! 그렇다면 게시글 삭제를 진행하면 된다! 역시 수정 이후로 하는거라 조금 수월했다! 🌝 게시글 삭제 📚 VS code 📕 boardDetail.js // 게시글 삭제 버튼이 클릭 되었을 때 document.getElementById("deleteBtn").addEventListener("click", () => { if(confirm("정말 삭제 하시겠습니까?")){ location.href = location.pathname.replace("board","board2") + "/delete"; + location.search; // /board2/1/2006/delete(GET) } }) 📚 Spring 📗 BoardController2.java //..
오늘은 댓글 목록에 대한 기능을 구현 할 예정이다. 댓글/ 대 댓글 기능을 구현하려면 계층형 쿼리와 REST API를 알아야한다. 📝 계층형 쿼리 (START WITH, CONNECT BY, ORDER SIBLINES BY) 📝 🥇 START WITH : 상위 타입(최상위 부모)으로 사용될 행을 지정 (서브쿼리로 지정 가능) 🥈 CONNECT BY 상위 타입과 하위 타입 사이의 관계를 규정 PRIOR(이전의) 연산자와 같이 사용하여 현재 행 이전에 상위 타입 또는 하위 타입이 있을지 규정 부모 -> 자식 계층 구조 CONNECT BY PRIOR 자식 컬럼 = 부모 컬럼 자식 -> 부모 계층 구조 CONNECT BY PRIOR 부모 컬럼 = 자식 컬 🥉 ORDER SIBLINGS BY : 계층 구조 정렬 ..
게시글 수정를 위해 먼저, 주소를 작성할 예정이다. 어제와 같이 location.href 을 이용해서 URL을 설정해주면된다. (log 참고) 📚 VS code 📕 boardDetail.jsp // 게시글 수정 버튼 클릭 시 const updateBtn = document.getElementById("updateBtn"); updateBtn.addEventListener("click",()=>{ console.log() location.href=location.pathname.replace("board","board2") +"/update" +location.search; /* '/board2/1/2008/update?cp=1' */ }) location.pathname.replace("board","b..
글쓰기 버튼을 눌렀을때! 요청 주소로 넘어가기 위해서 location 을 이용할 것이다! 🤔 location이란 ? 현재 활성화된 웹페이지의 URL 정보를 포함하는 window 객체의 프로퍼티로 location.href로 현재 주소를 확인할 수 있다. 예시) location.href='/member/login' (해당 주소 요청(GET방식)) * 주소를 작성할 수 있는 방법 아래 2개 * location.href = "/board2/" + location.pathname.split("/")[2]; location.href = `/board2/${location.pathname.split("/")[2]}/insert` 📂 결과 : /board2/1/insert 📝 js 코드 if (insertBtn != ..
📰 공공 데이터 데이터베이스, 전자화된 파일 등으로 공공기관에서 사용할 목적으로 처리된 자료 또는 정보이다. 공공기관에서의 일상적 업무수행의 결과물로 생성 또는 수집/취득한 다양한 형태(텍스트, 이미지, 동영상 등)의 모든 자료이다. 📰 공공 데이터 이용을 위한 세팅 방법 https://www.data.go.kr/ 회원가입 후 로그인 → 오픈API 검색 후 활용신청 → 마이페이지 → 인증키 발급현황 → 활용신청 상세기능정보 → 요청정보 세팅 후 미리보기 공공 데이터를 사용하기 위해 발급받은 나만의 인증키이다! (다른사람한테 노출되면 안되니 노출 하지 마시길!) 요청 변수에서 return Type이 xml / json에 따라 다르게 보인다. 📂 OPEN API. 이론 📚 Spring 📗 Air.java p..
이번시간에는 프로필 이미지 추가 / 변경 / 삭제 할 예정이다. 그 전에 이미지 선택 하여 동그란 화면에 이미지를 미리보기 할 예정이다. 📚 VS code 📕 myPage-profile.jsp (프로필 부분만 발췌함) 🤔 accpt = "image/*" : 이미지만 허락하겠다라는 뜻이다. 프로필 프로필 이미지를 변경할 수 있습니다. x 이미지 선택 변경하기 이메일 로그인 회원 이메일 가입일 로그인 회원 가입일 📕 myPage.js (프로필 부분만 발췌함) const profileImage = document.getElementById("profileImage");//Img 태그 const deleteImage = document.getElementById("deleteImage");//x버튼 const ..
오늘은 게시글 상세에서 좋아요 누르는 부분을 할 예정이다. 우선 생각해야할게 누가 ! 어떤 게시글! 좋아요를 클릭/ 취소 했는지 알아봐야한다. 그렇다면 그럼 정보를 어떻게 얻어 올 수 있을까 ? 총 3가지 방법이 있는데 그 중 가장 편하고 쉬운 3번으로 진행해보기로 했다. 1) ajax로 session에 있는 loginMember의 memberNo를 반환 2) HTML 요소에 로그인한 회원의 번호를 숨겨 놓고 js로 얻어오기 (data-value) ❗ 3) jsp 파일 제일 위에 있는 script 태그에 JS+EL이용해서 전역 변수로 선언해둔다. ❗ 📚 VS code 📕 boardDetail.jsp 📕 boardDetail.js // 좋아요 버튼이 클릭 되었을 때 const boardLike = docu..
