분류 전체보기126 IntelliJ에 SpringBoot + Vue.js 설치 및 연동 - 1 상황 이제 Back API는 마무리 되었고, Front 개발 차례이다. 내부회의에서 Vue와 React 중 어떤 것을 고를지 결정하기 전에 프로젝트 내부에 각각 세팅을 해보고, 비교해서 결정하기로 했다. 적용 이 프로젝트 세팅은 아래 사항들을 이미 완료했다고 가정하고 시작한다. 1. JAVA(v11) 설치 2. Node.js 설치 3. Git 설치 4. Spring Boot 세팅 완료 ✔️1. terminal Shell path 변경 사진과 같이 터미널의 shell path를 Git파일에 들어가 bin에 위치한 sh.exe 파일을 선택해주고, -login -i 를 입력한다. IntelliJ 툴을 껐다 켜면 Git bash 터미널 적용이 완료된다. Shell path: C:\Program Files\Git.. 2023. 4. 19. [JAVA] Stream Collectors.groupingBy 널(null) 사용하기 상황 데이터를 grouping 해서 Map으로 리턴해야 하는 상황이다. grouping할 key 값이 nullable한 상황인데, Map의 key값은 null이 될 수 없기때문에 문제가 발생했다. 아래와 같은 exception을 뱉었다. Caused by: java.lang.NullPointerException: element cannot be mapped to a null key 🫥참고로, 만약 그룹핑할 key가 절대로 null이 아니라면 아래와 같이 간단하게 처리할 수 있다. Map map = list.stream().map(li -> new ResponseDto(li) ).collect(Collectors.groupingBy(ResponseDto::getCode)); 해결 ✔️Null값이 있는 Gr.. 2023. 4. 7. [JPA, QueryDSL] intellij QClass import static 자동완성 단축키 상황 QueryDSL을 사용하는데, QClass를 import 할 때, 단축키를 이용한 자동완성이 안되고 import static~ 을 다 입력해야 해서 번거로웠다. 왜 단축키가 안먹지? 생각했는데, 역시나! 자동완성 방법이 있었다. (인텔리제이에서 가능!) 적용 ✔️1. QClass 명과 지정된 변수명을 입력한다. ✔️2. Alt + Enter (windows 기준) 후, 사진과 같이 Add static import~ 를 선택. 📌그럼 이렇게 자동으로 import static이 된다! 2023. 3. 15. [Thymeleaf] 타임리프 삼항 연산자 삼항 연산자 타임리프에서 제공하는 삼항연산자는 우리가 익히 알고있는 일반적인 삼항연산자 뿐만 아니라, Elvis 연산자, No-Operation 도 사용할 수 있다. back단에서 넘겨 받은 데이터에 따라 적절히 사용하면 된다. 적용 ✔️1. 삼항 연산자 📌 일반적으로 널리 사용되는 삼항 연산자이다. 형태를 살펴보자. -> 넘겨 받은 data가 true면 data 출력, false면 '데이터가 없음'을 출력한다. ✔️2. Elvis 연산자 📌 Elvis 연산자는 data가true면해당 값을 출력하고 false면 뒤에 있는 값을 치환하여 출력한다. ✔️3. No-Operation : _ 사용 📌 문자 그대로 작동하지 않는 것이다. 마치 타임리프가 실행되지 않는 것 처럼 말이다. data가 true면 dat.. 2023. 3. 3. [Vue, Spring Boot]Proxy error: Could not proxy request ~ 상황 그동안 내가 맡았던 프로젝트는 front와 back이 뚜렷한 경계없이 Spring boot, JavaScript를 사용하여 한 프로젝트 내에서 풀스택으로 개발을 진행했다. 올해부터는 회사에서 내부 프로젝트를 진행하면서, front-end와 back-end의 구분을 나누게 되었다. back과 front를 분리하여 개발을 진행하는 것이 처음이다보니, 생각지도 못한 곳에서 에러가 발견되곤 했다. (글에 본격적으로 들어가기에 앞서, 나는 Vue2에 대한 전반적인 내용만 겉핥기식으로 이해하고 있는 상황이라서 잘못된 내용이 있을 수도 있다. 문제 있을 경우 살포시 알려주시면 더 공부해보겠다.) 환경 front : vue 2 (8080 포트사용) back : Spring Boot (8081 포트사용) IDE :.. 2023. 2. 28. [jQuery] 제이쿼리 validation 플러그인으로 쉽게 유효성 검사하기 jQuery Validation form 입력 데이터의 유효성을 검증하는 것은 아주 중요한 일이다. jQuery에서 제공하는 validate 플러그인은 유효성 검증을 더욱 쉽게 해주도록 도와준다. 사용자 입장에서 form에 데이터를 입력하고 submit을 했을 때, 개발자가 일일히 걸어놓은 유효성 검증을 거쳐 통과못한 경우에 계속해서 alert창이 뜬다면 번거로울 것이다. validate플러그인을 이용하면 사용자가 빠르게 체크할 수 있도록 시각화해주고 onkeyup, onfocusout을 이용하여 실시간 유효성 검사 가능도 가능하다. 이 외에도 다양한 기능을 제공하니 공식문서를 확인하여 참고해야겠다. https://jqueryvalidation.org/ jQuery Validation Plugin | F.. 2023. 2. 28. 이전 1 ··· 3 4 5 6 7 8 9 ··· 21 다음
