자바 웹 공부41 자바 웹 공부 63 - SpringBoot(새로 만들기15 / 게시판) + Axios 오늘은 마무리 작업을 할 거 같다 똑같이 Back-end와 Front-end 서버를 켜고 수정하는 기능을 구현해 보자 front에서 board -> views -> boardUpdateView -> index 아래로 내려와 이쪽에서 이렇게 만들어주고 (input은 복사해서 붙여 넣자) 위로 올라가서 아래로 내려가 onUpda~위에 작성 위로 가서 getBoardResponseHandler위에 아래로 내려와서 추가 위에 minRows를 5로 다시 올라가서 getBoardErrorHandler아래에 적어주자 patchBoard로 가서 넣어줘야 하는 값을 만들어야 하니 api로 가서 만들어주고 돌아와서 onUpdateHandler로 가서 변경하고 브라우저에서 수정을 하면 에러가 뜬다. BoardUpdateVi.. 2023. 4. 3. 자바 웹 공부 62 - SpringBoot(새로 만들기14 / 게시판) + Axios board에서 이미지 추가하는 기능을 구현해 보자 이 버튼을 눌렸을 때 이미지를 추가할 수 있게 만드는 것 views -> BoardWriteView 아래로 내려가면 IconButton이 있는데 이렇게 해주고 새로고침을 하면 생기게 된다. 위로 가서 hidden을 넣게 되면 다시 클릭이 안됨 onImage~를 만들어주자 이렇게 만들고 버튼을 눌러보자 뜨게 된다. 아무거나 사진을 넣고 열기를 하면 뭐가 뜨지를 않는다 그래서 이렇게 만들어주고 위로 가서 event의 타입을 보고 이렇게 만들어 준 뒤 브라우저를 새로고침하고 이미지를 넣고 f12를 켜서 보면 파일에 대한 정보가 보인다. 파일이 들어가져 있는 것을 알았으니 back-end로 보내줘야 한다. Postman에서 body -> form-data 형태로.. 2023. 3. 31. 자바 웹 공부 61 - SpringBoot(새로 만들기13 / 게시판) + Axios 이어서 front-end와 back-end를 합치는 것을 해보자 front -> board -> src -> views -> MyPageView -> myPageContents -> index 주석 해제 시켜주고, 쿠키를 상수로 들고 오고 굳이 return이 필요 없으므로 지워주자 총 코드 constants -> api로 가서 추가해 줘야 위에 에러가 안 걸림 hooks -> paginghooks로 가서 추가 MyPageContent로 와서 아래에 에러가 뜨는데 수정 BoardListItem 가서 추가를 해주고 실행을 하면 에러가 사라져 있다. 로그인하고 마이페이지를 눌러보면 내가 쓴 글이 나온다. 하지만 새로고침을 하게 되면 cookie가 있지만 에러가 걸려서 로그아웃이 되어버린다. MyPageCont.. 2023. 3. 30. 자바 웹 공부 60 - SpringBoot(새로 만들기12 / 게시판) + Axios front-end(React), back-end board를 각각 켜주고 오늘 공부를 시작해 보자 React(front)에 있는 LoginCardView, SignUpCardView index를 보자 SignUpCardView index로 가서 axios 만든 곳 아래 return 사이에 코드를 넣어줄 건데 이렇게 해주고 axios then에 있는 것을 빼주자 그렇게 하고 만든 signUpResponseHandler를 넣어주자 {}, ;을 지우고 위처럼 만들어주자 signUpErrorHandler도 만들어주고 위처럼 똑같이 넣어주자 LoginCardView index로 가서 복사 후 아래 사진처럼 만들어주고 코드를 수정해 주자 utils -> index로 가서 빨간 걸 넣어주는데 빨간 건 바로 위 사진에.. 2023. 3. 29. 자바 웹 공부 59 - SpringBoot(새로 만들기11 / 게시판) + Axios 우리가 이때까지 만든 Spring과 React를 합쳐 버릴 것이다. (Front-end와 Back-end를 합치는 것) 우선 board에서 터미널 하나, front에 있는 board 터미널을 두 개 켜고 (board - spring / front board - React) React에 있는 board에서 npm install axios 실행 여기 가서 axios가 찍혀있으면 설치가 완료된 것이다. axios는 Node기반 js 프로젝트 http 통신이다. 회원가입 처리 React board에 있는 view -> AuthenticationView -> signUpCardView -> index.tsx 여기 줄 그은 것을 지우자 코드를 채워주고 front-end(React) 켜져 있는 터미널에 가서 ctrl.. 2023. 3. 27. 자바 웹 공부 58 - SpringBoot(새로 만들기10 / 게시판) Service 폴더 아래 새 폴더를 만들고 아래에 있는 서비스들을 implementation으로 옮겨주자 넣어주고 sevice 폴더에 AuthService를 새로 만들어 주고 class를 interfate로 변경 import 해주고 원래 있던 AuthService이름을 변경해 주자. 당연히 원래 있던 AuthService명을 위처럼 바꿔주자 Service에서 또 만들어주고 모두 class를 interface로 변경 바꿔주고 원래 있던 MainService는 이렇게 바꿔주자(이것도 모두 포함) Controller로 가면 에러가 나있을 건데 . implementation을 지워주자 이렇게 다른 Controller도 바꿔주자 다 바꿔줬으면 실행해 주고 postman으로 가서 이렇게 실행해 보면(value는 자.. 2023. 3. 24. 이전 1 2 3 4 5 ··· 7 다음
