CRUD
-
(React) 2 - 생활코딩(React) 2개발/React 2024. 1. 23. 11:45
■ create 구현하기 delete 는 버튼 클릭 시 삭제되도록 할 때 링크 사용 시 문제 될 수 있다. 따라서 delete 는 페이지 개념이 아니라 버튼같은 operation(동작) 개념으로 사용하는게 낫다. 사용을 위해 Control.js 를 별도로 만들고 App.js import 한다. 이벤트를 실행했을 때 실행되어야 하는 함수를 핸들러라고 부른다. Control.js 에 onClick 함수를 넣어준다. 함수 안에서 onChangeMode() 함수를 실행시키고 인수로 'create' 값을 전달해준다. 전달받은 값을 _mode 로 이름짓고 이를 setState 를 통해 mode 의 값을 변경해준다. create 클릭 시 모드가 create 로 변경된 것을 확인 가능하다. 이제 각 create, up..
-
(국비교육) 77 - Spring boot + vue 게시판 만들기 3 ( 수정하기 + 삭제하기)개발/국비교육 2023. 9. 21. 12:25
■ 수정 삭제 버튼 만들기 (sep19) 수정 삭제 버튼을 만들어준다. https://www.bottlehs.com/vue/vue-js-axios-%EB%B0%8F-rest-api-%EB%A5%BC-%ED%99%9C%EC%9A%A9%ED%95%9C-crud-%EA%B5%AC%ED%98%84/ Vue Js Axios 및 Rest Api 를 활용한 CRUD 구현 Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리이다. 비동기 방식은 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이며,Ajax를 통해서 서버에 요청을 한 www.bottlehs.com 메소드에 deletepost() 메서드를 만들어준다. detail 에 있는 bno 값 제대로 불러지는 ..
-
(국비교육) 36 - project1 이어하기4 + 5회차 시험 + 로고 제작 사이트 + 게시판 수정 기능 만들기개발/국비교육 2023. 7. 20. 17:39
■ 수정하기 만들기 edit 함수 만들기 누르면 edit 으로 이동하게 설정 번호도 그대로 가져오게 #{ } 으로 작성 이제 맵핑처리 필요하다. edit get mapping 만들어준다. detail 타입 안맞아서 오류 뜬다. 이를 맞춰주는 메소드를 유틸에 만들어주고자 한다. char 형태 숫자인지 아닌지 판별하는 isDigit을 사용해 str.charAt(i) 값을 비교한다. isDigit 은 참,거짓을 나타내는데 만약 숫자라면 re 라는 변수에 담아준다. 그리고 이 문자열을 인트 타입으로 변환해준다 혹은 stringbuilder 로 차곡차곡 쌓은 것은을 내보낼 수도 있다. append 로 이를 쌓아주고 쌓은 char 값을 toString()을 통해 문자열로 만들고 parseInt 를 통해 int 타입..
-
(국비교육) 35 - project1 이어하기3 + 웹포트 설정 + 포트열기 + 상대 IP 가져오기 + 삭제하기 작업(CRUD)개발/국비교육 2023. 7. 19. 17:13
■ 웹포트 설정 및 모듈 설정 8080은 웹테스트 포트 80은 진짜 웹포트 따라서 8080 -> 80 으로 변경 모듈 / 로 변경한 이유는 /pro 말고 / 만으로 열리게 처리하기 위해서이다. 다음과 같이 확인이 가능하다. ■ 상대방 ip 가져오기 상대방 ip 가져와본다. 192.168.0.0 처럼 표시되므로 String 으로 받는다. 해더쪽을 읽어서 forwarded ip 뽑을 것이다. 만약 없거나 ip.length() == 0 거나 대소문자 상관없이 unknown 일때 다른 헤더에서 IP 주소를 가져오기 위해 다음과 같은 순서로 확인하는 것이다. "unknown".equalsIgnoreCase(ip) 와 ip.equlsIgnoreCase("unknown") 동일한 뜻이다. public String g..