본문 바로가기

dev

 (261)
List remove ConcurrentModificationException foreach로 리스트 순회하다가 중간에 삭제해야 하는 경우 아래와 같이 코드 작성하면 예외가 발생합니다. 위의 예제 코드는 리스트의 원소가 3인 경우 삭제하다가 ConcurrentModificationException 예외가 발생했습니다. ConcurrentModificationException가 발생한 원인은 리스트에 추가나 삭제를 하면 modCount가 갱신되는데 위의 예제 같은 경우 modCount가 제대로 갱신되지 않기 때문입니다. 따라서 이런 문제를 해결하려면 foreach가 아닌 일반 for문을 사용하거나 iterator를 사용하거나 removeIf를 사용하는 방법이 있습니다.
UnsatisfiedDependencyException 에러 처리 스프링 개발중에 처음 보는 에러를 아래와 같이 발겼했습니다. 이런 에러가 발생하는 원인은 스프링에 의해 생성된 bean이 자기가 의존하는 bean이 아직 생성되지 않기 때문에 발생한 것이 원인입니다. 스프링에서 bean 생성 순서를 정하지 않았다면 일반적으로 패키지 알파벳 순서대로 bean이 생성되는데 이때 참조대상의 bean이 참조하려는 bean보다 늦게 생성된다면 위와 같은 에러가 발생하는 것입니다. 따라서 의존성을 주입할 때(DI) bean 생성 순서를 고려해야 할 것입니다.
배열 중복 비교 2개의 배열의 중복을 비교하는 방법은 여러 가지 있는데 그중에 한 가지 방법을 설명하겠습니다. =========================================================== var arr1 = [11, 12, 13, 14]; var arr2 = [11, 12]; arr1.forEach(function(v, i){ var flag = false; arr2.forEach(function(w, j){ if(v === w){ flag = true; return false; } }); if(flag === true){ console.log(v); } }); =========================================================== 위의 소스는 2개의 배..
leaflet 지도 표출 gis 개발자라면 leaflet에 대해 아실겁니다. 쉽게 얘기해서 leaflet은 웹 화면에 지도 이미지를 표출하기 위한 자바스크립트 라이브러리입니다. 이번에 포스팅하는 글은 leaflet을 사용해 간단하게 배경지도를 출력하는 것입니다. 위의 소스를 보게 되면 지도 중심 좌표(남산타워)를 배열로 생성합니다. (위도가 먼저 나오고, 경도가 그 다음으로 나옵니다.) leaflet Map 클래스 객체를 생성하고 중심 좌표를 초기 지도 위치로 설정합니다. 배경지도 표출 및 leaflet Map 객체에 추가합니다. 마커위치를 중심좌표로 설정하고 leaflet Map 객체에 추가합니다. 초기 지도위치와 마커가 중심좌표(남산타워) 기준으로 표출된 것을 확인할 수 있습니다. 예제파일이 필요하면 아래 첨부파일 다운받으면..
정규표현식 전화번호 체크 회원가입 기능 구현할 때 사용자가 입력한 전화번호가 제대로 입력되었는지 체크해야 될 때가 있습니다. (이상한 값을 입력한 경우 대비) ========================================================= //전화번호 입력 체크 function checkPhoneNumberCallback(value){ if(value === ""){ return; } var reg = /^\(?(\d{0,3})\)?[-]?(\d{0,4})[-]?(\d{0,4})$/; var checkFlag = reg.test(value); if(!checkFlag){ alert("전화번호 다시 입력하세요."); } } ===============================================..
media query 모바일 웹 화면을 개발하다보면 단말기 마다 해상도가 달라서 css를 따로 작업해야 할 때가 있습니다. media query를 사용하면 쉽게 해결할 수 있습니다. ============================================================== @media (min-width: 280px) and (max-width: 360px) { input[type=text] {width: 100px;} input[type=file] {width: 50px;} textarea {width: 150px;} } ============================================================== 위의 css 내용을 보게 되면 화면이 최소 280px 부터 최대 360..
이미지 미리보기 사용자가 올린 이미지를 미리 보여 주는 기능을 개발할 때 이미지를 webapp 밑에 저장되어 있는 이미지 파일을 보여주는 경우도 있지만 webapp 말고 다른 특정 디렉토리(서버 외부 디렉토리)에 있는 이미지 파일을 보여줘야 되는 경우가 있습니다. 소스를 보게 되면 특정 이미지 파일을 File 객체로 생성하고 파일 확장자를 response의 contentType에 추가하고 response의 outputStream을 통해 이미지 파일을 출력합니다. 소스에서 버퍼를 써야 되는게 맞지만 이미지 파일 사이즈는 대체로 가볍기 때문에 버퍼를 쓰지 않았습니다. 위와 같이 이미지 미리보기가 잘 되는 것을 확인할 수 있습니다.
input type file css 브라우저에서 파일 업로드를 할 때 디자인을 입히지 않으면 화면이 부자연스럽습니다. 이런 경우 label을 사용하거나 before/after를 사용해서 디자인 하는데 저는 before/after를 사용하겠습니다. css를 살펴보면 다음과 같이 작성했습니다. input 태그에 "uploadBtn"이란 id를 주고 width를 100px로 했습니다. 아래부터 중요한 내용이 나오는데 "content"라는 속성을 사용했습니다. content는 태그 앞 또는 뒤에 텍스트나 이미지를 추가할 수 있게 해주는 속성입니다. before에는 content에 빈 문자열을 추가했고, 배경으로 "download.png"를 주었습니다. after에는 content에 "파일첨부"라는 텍스트를 추가했습니다. 이렇게 css를 작성하고 ..

티스토리툴바