글쓰는 개발자

안녕하세요. 글쓰는 개발자 입니다. 오늘은 회원가입 등에 사용되는 항목들을 MetaData로 DB에서 관리하고 그것을 View단(jsp)에 뿌려주는 방법을 설명하고자 합니다. 업무로 회원의 프로필 작성을 맡았는데 항목이 총 31가지 였고, 각각 직접입력, radioButton, checkBox등이 있는데 일일이 text로 입력하는 것이 아니라 DB에서 그 항목들을 불러오는 방식을 취했습니다. 이유는 항목값이 변경 또는 추가 되었을 때 DB값만 변경하면 되기 때문입니다. 그리하여, 제가 어떤 방식으로 구현했는지 설명드리겠습니다. 1. DB 1) MetaDataTable 성별선택을 예로들면, 성별을 부모키, 남자, 여자, 상관없음을 자식키 형태로 만듭니다. domain_key는 data각각을 나타내는 고유한..

안녕하세요. 글쓰는 개발자입니다. 회원가입 혹은 프로필 작성시 특수문자, 공백 체크 등 유효성 검사를 필요로 하는 경우가 많은데요. 저도, 프로필 작성을 맡으면서 닉네임의 유효성 검사가 필요했습니다. 연속된 야근으로 오늘도 자정이 넘어 글을쓰는 중이라 코드만 소개하겠습니다. 아래 코드를 보시면 필수입력, 닉네임 빈칸 체크, 한글 및 영문 숫자 길이 체크, 특수문자 포함에 관한 javascript 정규식이 포함되어 있습니다. 주석이 친절(?)하게 달려있으니 확인하시기 바랍니다. //닉네임 체크 [S] function checkNickName() { var nickname = document.getElementById('nickNm').value; //닉네임 입력값 받아오기 var nickLength = 0..

안녕하세요. 글쓰는 개발자입니다. 오늘은 업무 중에 활용했던, 커리어넷 OPEN API 센터의 학교명 검색 기능을 활용해서 비동기 검색제시어 기능을 구현한 것을 간단하게 소개하려고 합니다. 동기, 비동기 방식에 대한 자세한 설명이 필요할 것 같지만, 다른 포스팅에서 다루도록 하고 기능구현만 간단히 소개하겠습니다. 1. 검색제시어 기능 다양한 포털사이트에서 검색을 하실 경우 아래에 유사한 검색어들이 제시되는 것들을 보셨을 것입니다. 그것이 바로 검색제시어 기능입니다. 비동기 방식이기 때문에 검색어가 변경될 때 마다 매번 새로고침 되지않고 제시어만 계속 바뀌게 됩니다 2. 기능 구현 커리어넷의 OPEN API를 예시로 들었지만, DB에서 불러온 값들을 활용하셔도 됩니다. 1) html 간단하게 검색어를 입력..

안녕하세요. 글쓰는 개발자입니다. 글을 쓰는 시점은 야근을 마치고 돌아오자마자 새벽 1시가 좀 넘었는데요. 단위테스트를 진행하면서 Chrome에서는 잘되던 javascript remove() 함수가 IE10에서는 사용불가한 이슈가 있었습니다. 그렇다면, 예제와 해결 방법을 알려드리겠습니다. 테스트용으로 리스트를 만들었고 remove() 함수를 먼저 적용해보았습니다. Chrome에서는 잘되었지만, IE10에서는 아래 그림과 같은 에러를 확인할 수 있었습니다. 그러나, removeTestIE10() 을 보시면, 삭제하고자하는 node의 parent를 선언하고, var test = paren.document.getElementById("test1"); removeChild(test) 의 방식으로 해결했습니다...

안녕하세요. 글쓰는 개발자입니다. 고등학교 친구들을 만나고 집에 돌아오자마자 글을 쓰게 되었는데요. 저의 개발자 친구 K와 C랑 셋이서 이야기를 하다가 기술면접 이야기가 나왔고, K가 Javascript의 '=='과 '==='의 차이를 알려줘서 바로 포스팅하게 되었습니다. 결론부터 말씀드리면, "==="(strict equality) 을 사용하는 것이 바람직 합니다. 비교결과 예측이 쉽고, 형 강제(coercion) 변환이 일어나지 않기에 평가가 빠르기 때문입니다. 그럼, 결론을 염두에 두시고 아래 내용을 보시기 바랍니다. 아래 내용은 친구 K의 설명과 아래 링크의 설명을 참고했습니다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Equality_comp..

안녕하세요. 글쓰는 개발자입니다. 제가 업무 중에 검색필터 팝업창을 만들게 되었는데 이때, 배열 형식으로 선택된 값들을 저장했습니다. 그러한 이유는 배열에 저장된 값들을 Query문으로 날려줘서 검색을 진행하기 때문인데요. 오늘은 제가 업무 중에 사용한 방법을 포스팅하고자 합니다. 목차 1. html 2. javascript 3. 전체 코드 4. 사용된 javascript 내장 function 5. 결론 1. html 예제로 연령선택을 만들었습니다. checkbox를 활용해서 중복선택이 가능하게 만들었습니다. 10세 20세 30세 40세 50세 60세 필터입력값 : 2. javascript (아래 코드를 참고하세요.) ageArr이라는 필터내용을 저장하는 배열을 생성합니다. confirmCheck를 통해..

안녕하세요. 글쓰는 개발자 입니다. 오늘은 STUFF 함수를 설명하고자 합니다. 업무를 하면서, Category형태로 하위항목이 2depth, 3depth씩 있을 때 부모 Depth를 Key, 그에 해당하는 자식Depth 내용을 List형태로 만들어 Value로 삽입해야 하는 경우가 종종 생깁니다. 그 때 Java단 혹은 JavaScript단에서 고생하실 필요없이, 한번에 SQL로 해결하는 방법을 알려드리겠습니다. 1. Table 자료형태 아래그림과 같이 address Table을 하나 생성했습니다. 1Depth Sido에 '부산'이 반복되고 2Depth Sigungu에 '남구'가 반복되고 3Depth Bemd에 읍면동이 자식항목으로 뿌려지고 있습니다. Sido Sigungu Bemd 부산 남구 대연동 ..

US안녕하세요, 글쓰는 개발자입니다. 오늘은 개인적으로 굉장한 분노의 날이자, 감사한 날인데요. 크롬 개발자 도구를 활용한, Mobile 디버깅 방법에 관해서 포스팅 하고자 합니다. 목차 1. 자신의 모바일기기 USB 연결 2. 모바일(휴대폰) 개발자 모드 설정하기 3. adb설치하기(매우 중요!) 4. 설치 후 환경변수 설정 5. cmd에서 설치 확인하기 6. 크롬(Chrome) 브라우저에서 확인 업무를 진행하면서 크롬 개발자 도구의 모바일 환경에서는 잘되는데 QC결과상 실제 Android 환경에서는 제대로 되지 않는 경우가 있어서 모바일 개발환경을 구축하려고 블로그를 뒤졌는데 잘 안되었습니다. 여러 포스팅에서 많은 중간과정을 생략해서.... (믿고 믿었던 블로그가 사기였어.) 그리하여, 우리 빛과 소..

안녕하세요. 글쓰는 개발자입니다. Apache Tomcat을 Eclipse 혹은 STS에 연동하는 작업(아래 링크 참고)을 마쳤으니, https://backstreet-programmer.tistory.com/24 [Java 개발환경] WAS setting (Apache Tomcat, Wild fly, resin 4.0) 안녕하세요. 글쓰는 개발자입니다. Java를 기반으로 웹개발을 하다보면, 반드시 필요한게 WAS(Web Application Server) 입니다. 저는 학원에서 Apache Tomcat 8.5v을 사용했고, 현재, 회사에서는 Wild Fly, 전자정.. backstreet-programmer.tistory.com 본격적인 Spring Frame work를 위한 시리즈를 준비했습니다. ..

안녕하세요. 글쓰는 개발자입니다. Java를 기반으로 웹개발을 하다보면, 반드시 필요한게 WAS(Web Application Server) 입니다. 저는 학원에서 Apache Tomcat 8.5v을 사용했고, 현재, 회사에서는 Wild Fly, 전자정부 표준프레임워크에서는 resin 4.0을 쓰는 등 다양한 WAS가 있습니다. 아마, 제 포스팅을 보시는 분들이라면 Apache Tomcat을 많이 사용하시리라 생각이 되어, 오늘은 eclipse 혹은 STS에 WAS를 setting 하는 방법을 포스팅하겠습니다. (에러 발생시 해결도 있습니다!) 1. Apache Tomcat 설치 구글에 Apache Tomcat을 검색해도 되고, 아래 URL을 통해서 홈페이지에 접속합니다. https://tomcat.apa..