본문 바로가기

컴퓨터150

[Spring] 스프링 Optional 클래스를 이용한 null 쿼리스트링 처리 RequestParam은 기본적으로 해당 주소에 쿼리 파라미터가 없을 경우 해당 메서드를 실행시키지 않는다. 그러나 RequestParam의 requered를 false로 주면 쿼리 스트링이 없을 경우에 해당 값에 null을 넣게 된다. 이럴 때 Optional을 이용하여 처리 가능하다. 아래와 같이 처리할 경우 /chatBoot 이라는 경로로만 들어온다면, message에 null이 들어가게 되고, orElseGet의 결과에 따라 newMessage에는 "안녕"이 들어가 null 쿼리 스트링 처리가 가능해진다. @GetMapping("/chatBoot") public String chatBoot(@RequestParam(required = false) String message) { Optional u.. 2023. 8. 21.
[js]인풋으로 사진 입력받아 띄우기 let file = document.frm.fileInput.files[0] URL.createObjectURL(file) 위 코드를 사용하여 frm라는 이름의 폼 내의 fileInput이라는 인풋 태그의 파일에 접근한다. URL.createOnjectURL은 블롭이나 파일 객체를 URL형식으로 변환해준다. 즉, 두 번째 줄 코드 결과로 나오는 url 값을 img태그의 scr에 넣으면 사진이 나온다! 2023. 8. 18.
[React] Axios로 폼 데이터 제출 예제 코드/파일 제출 폼 데이터 제출 예제 코드이다. name으로 접근하여 파일을 받아와 제출한다. const onSubmit = (e) =>{ e.preventDefault(); let formData = new FormData(); formData.append('uploadFile', document.frm.uploadFile.files[0]); // send axios.post("http://localhost:3000/fileUpload", formData) .then(res=>{ //처리 }) .catch(e=>{ alert(e); }) } 위 코드는 아래의 폼에 frm이라는 name으로 접근하여 uploadFile의 name으로 접근한 후 파일을 받아와 제출한다. 아래 형태로 @RequestParam으로 값을 받을 .. 2023. 8. 17.
[React] 리액트 필수 훅 예제로 알아보기 리액트 훅 Hook은 갈고리라는 의미이다. 리액트의 함수형 컴포넌트에서 상태(state)와 생명주기 메서드(lifecycle methods)를 관리하기 위한 방법을 제공한다. 원래 존재하는 기능(함수, 컴포넌트 등)에 갈고리처럼 끼어들어가 존재감을 뽐낸다고 하면 된다. 즉, 훅은 class, 함수를 따로 작성하지 않고도 state와 다른 React의 기능들을 사용할 수 있게 해준다. 기본 Hooks useState : 상태를 관리하기 위한 훅, 즉 변수 값을 관리한다. useEffect : 사이드 이펙트를 처리한다. React에게 컴포넌트가 렌더링 이후에 어떤 일을 수행해야하는 지를 정의한다. useContext : 컴포넌트 트리 상에서 전역적인 데이터를 공유하기 위한 훅이다. 추가 Hooks useRe.. 2023. 8. 10.