본문 바로가기

분류 전체보기85

자주 쓰이는 Ajax 활용법 - 부분 갱신 feat.@ResponseBody 클라이언트는 서버에 다양한 요청을 날리게 되고 서버는 그러한 요청이 올바른 요청인지 확인을 거치고 응답을 하게 된다. 이러한 요청과 응답이 세트로 일어날 때 크게 두가지 방식으로 진행되는데 하나는 동기이고 하나는 비동기이다. 동기는 화면이 갱신된다는 특징이 있고 비동기는 화면 갱신 없이, 즉, 새로고침없이 응답을 페이지에 노출시킬 수 있다는 특징이 있다. 그리고 새로고침없이 응답을 view에 뿌려주는 작업을 해주는 대표적인 자바스크립트 라이브러리가 Ajax이다. Ajax 는 Asynchronous Javascript And Xml의 약자이다. JavaScript를 사용한 비동기 통신, 클라이언트와 서버간에 XML 데이터를 주고받는 기술인 셈이다. 이 Ajax를 사용하는 이유는 단순히 view단에 뿌려줄 .. 2022. 11. 21.
[마이바티스+오라클] 검색할 때 종종 막히는 바인딩 변수 오라클 DB와 MyBatis 를 사용하면서 검색 로직을 구현하려고 하면 어떻게 사용자가 입력한 값을 파라미터에 담아 매퍼에 넘기고 매퍼가 그걸 어떻게 받는지 어떻게 대소문자 구분 없이 (Case Insensitive) 값을 찾게 설정하는지 어떻게 파라미터를 포함하는 모든 값을 조회할 수 있게 % 를 넣을 수 있는지 요 3가지를 주로 고민하게 된다 오늘은 초보자들이 이러한 고민의 해답을 다른 블로그에서 찾기가 어려워서 이 글에서 쉽게 설명해볼까 한다. 먼저 컨트롤러에서 서비스로 제대로 호출했다고 가정하고 서비스는 아래와 같이 진행되어야 한다. public List findBySearchValue(파라미터 타입 파라미터 이름) { // Map으로 파라미터를 담아서 보내주는 방법 Map 참조변수 = new H.. 2022. 11. 7.
프레임워크와 라이브러리의 차이가 뭔가요? [ 면접 질문 ] 보통 A 와 B 의 차이가 뭔지 묻게 되면 이 둘이 굉장히 다른 것이라는 착각을 할 수 있는데 애초에 프레임워크와 라이브러리는 상당히 유사합니다. 그래서인지 사람들이 쉽사리 그 차이점을 말하기가 어려운 것이죠. 오늘은 이 둘의 공통점은 무엇이고 차이점은 무엇인지 알아보겠습니다. 먼저 이 둘의 공통점은? 지구 어딘가 이타적이고 뛰어난 개발자들이 특정 목적을 위해 어렵게 구현해낸 로직을 어떠한 이유에서인지 배포한 것입니다. 이를 통해 전세계의 사람들이 스스로 로직을 짜지 않고 올려져있는 로직을 쉽게 받아서 사용할 수 있게 됐습니다. 예를 들어 요리를 못하는 자취생이 누군가 만들어놓은 밀키트를 통해 집에서 쉽게 손이 많이 가는 요리를 간편하게 해먹을 수 있는 것과 비슷합니다. 바로 이것이 프레임워크이와 라이브.. 2022. 10. 29.
[SpringBoot Data JPA] 중복은 있을 수 없어 -1 어떠한 정보를 DB에 저장하고 싶을 때 여러 가지 방법으로 중복체크를 할 수 있지만 그중 나름 간단하면서도 쉬운 방법은 form을 submit 할 시 중복체크를 하는 것이다. 그렇게 하기 위해서는 일단 자바스크립트 단에서 form의 값을 받아서 ajax를 통해 컨트롤러에 전달해야 한다. 아래는 샘플 코드이다. 필자는 기본 alert 대신 SweetAlert2라는 라이브러리를 사용했다. 1. 데이터 추가/수정 관련 자바스크립트 var 넣을 값을 담은 변수 = { 넣을 값 }; $.ajax({ type: "POST", url: "/URL 경로", data: 넣을 값을 담은 변수, success: function (data) { if (data === 1) { Swal.fire({ icon: 'success'.. 2022. 10. 26.
[JAVA] JPA 활용법 -1 (QueryDSL 적용해보기) QueryDSL이란? Spring Boot Data JPA 는 쿼리문을 직접 짜지 않아도 함수명만 알맞게 적어주면 쿼리를 자동으로 짜주는 ORM으로 유명한데 사실상 조금만 복잡하고 동적인 쿼리를 짜려고만 해도 JPQL등을 통해 쿼리를 직접 짜야하는 불상사가 발생하고 만다. 이러한 불편함을 줄여주고자 자바만 알아도 쿼리를 대신 짜주는 프레임워크가 있는데 이를 QueryDSL 이라고 부른다. 쿼리가 아니라 자바 기반이라서 컴파일 시점에 오류 발견이 가능하고, 자동완성도 지원하여 실무에서도 많이 사용되고 있다. 필자도 QueryDSL을 사용해보고 싶었지만 진입장벽이 있는 것 같아서 망설이다가 블로그에 글을 쓸 핑계로 공부를 해보고 알아낸 내용을 공유해보려고 한다. 1. 개발환경 맞추기 1-1 generate .. 2022. 10. 24.
유효성 검사(?)로 클라이언트를 막아보자 - 1 인풋은 텍스트인데 숫자만 받고싶을 때 (복붙도 막아준다) 인풋은 숫자인데 클라이언트가 직접 입력하길 바라지 않을 때 disabled 처럼 보이는 readonly 를 만들고 싶을 때 영어만 사용가능하게 제한하고 싶을 때 (제출할 때 검사됨) 영어와 숫자까지만 가능하게 제한하고 싶을 때 (제출할 때 검사됨) 영문만 사용가능하게 제한하고 싶을 때 (입력할 때 검사됨) function engOnly() { var objEvent = event.srcElement; var numPattern = /^[A-Za-z]*$/; numPattern = objEvent.value.match(numPattern); if (numPattern == null) { Swal.fire({ text: "영문만 입력 가능합니다.", .. 2022. 10. 20.
소소한 팁 -2 제 버튼은 왜 submit이 아닌데 submit이 되죠? " 버튼 과 같이 기본으로 만든 버튼은 클릭하면 폼 전송이 일어난다. 그 이유는 기본 버튼의 기본값이 submit이기 때문이다. "버튼"은 "버튼"과 같다. 고로 불필요한 폼 전송을 피하려면 "을 쓰거나" 과 같이 버튼 타입을 명시해서 버튼 태그를 사용하면 된다. 2022. 10. 20.