지옥의불구덩이

React 개발환경 설정가이드(1) / VS Code / Window 본 포스팅에서는 아래의 해당내용을 단계별로 진행하면서 React개발을 위한 툴을 설치하고 CRA(Create-React-App)를 이용하여 React샘플 프로젝트를 구성해 보도록 하겠습니다. - 가이드(1) : node / npm 다운로드 및 설치 - 본 포스팅 - 가이드(2) : Visual Studio Code 다운로드 및 설치 - 가이드(3) : Visual Studio Code 설정 및 React프로젝트(CRA) 생성 1. Node 홈페이지(nodejs.org/ko/) 에서 LTS버전 인스톨러 다운로드 2. 다운로드 받은 인스톨러를 실행합니다. 이후 대부분 기본설정을 변경하지않고 Next의 연속... 3. 라이센스 약관 동의 후..

키보드 소개 / 바밀로 문라이트-저소음적축 / 듀가드X싱크웨이 토체티-갈축 바밀로 문라이트 (varmilo moonlight 108key) - 저소음적축 바밀로의 키보드는 저소음 적축, 잘빠진 색감과 디자인으로 유명하지만, 10만원 후반대~20만원대의 제품군으로 가격면에서 부담스러울 수 있습니다. 현재 일(코딩)할때 사용하는키보드가 바밀로 문라이트 저소음적축 키보드 입니다. 구입할 당시에는 저가 제품이 아니여서 조금 망설여졌지만, 지금까지 전혀 후회없이 아주 만족하며 사용하고있습니다. 사용한지 2개월정도 지난 시점에서 장단점을 간단히 적어보겠습니다. ★ 색감이 정말 잘빠졌습니다. ★ 나무결 느낌의 키보드 판이 고급스럽습니다. ★ 저소음적축의 퀄리티가 좋습니다. 정말 조용합니다. ☆ 만약 이동이 잦으시다면..

MySQL 다운로드 및 설치 가이드(3) / MySQL.8.x버전 / Window10 본 포스팅에서는 아래 해당내용을 단계별로 진행하면서 알아보도록 하겠습니다. - 가이드(1) : MySQL 인스톨러 다운로드 - 가이드(2) : 인스톨러 Setup / MySQL데이터베이스 설치 - 가이드(3) : 데이터베이스 생성 / 사용자 계정 추가 - 본 포스팅 ※ MySQL 버전 - 2021.01.24기준 최신버전 "MySQL 8.0.23" ※ 준비물 - 오라클 계정 1. "가이드(2)" 를 통해 설치된 workbench 실행 2. "MySQL80" 커넥션 선택 후, root 계정 비밀번호 입력 후 "OK"클릭 - 자동 로그인(비밀번호 기억하기)을 원할 시, 체크박스 선택후 "OK" 클릭 3. 데이터베이스 생성 및..

MySQL 다운로드 및 설치 가이드(2) / MySQL.8.x버전 / Window10 본 포스팅에서는 아래 해당내용을 단계별로 진행하면서 알아보도록 하겠습니다. - 가이드(1) : MySQL 인스톨러 다운로드 - 가이드(2) : 인스톨러 Setup / MySQL데이터베이스 설치 - 본 포스팅 - 가이드(3) : 데이터베이스 생성 / 사용자 계정 추가 ※ MySQL 버전 - 2021.01.24기준 최신버전 "MySQL 8.0.23" ※ 준비물 - 오라클 계정 1. "가이드(1)" 에서 다운로드받은 인스톨러를 실행시켜줍니다. ※ 인스톨러 설치가 안되어있다면, 이전 포스팅을 통하여 인스톨러 설치부터 진행해 주세요. 2. "Developer Default" 선택 후 "Next>" - 개발용 데이터베이스 통합설치..

MySQL 다운로드 및 설치 가이드(1) / MySQL.8.x버전 / Window10 본 포스팅에서는 아래 해당내용을 단계별로 진행하면서 알아보도록 하겠습니다. - 가이드(1) : MySQL 인스톨러 다운로드 - 본 포스팅 - 가이드(2) : 인스톨러 Setup / MySQL데이터베이스 설치 - 가이드(3) : 데이터베이스 생성 / 사용자 계정 추가 ※ MySQL 버전 - 2021.01.24기준 최신버전 "MySQL 8.0.23" ※ 준비물 - 오라클 계정 1. MySQL 홈페이지로 이동하여 다운로드 페이지(www.mysql.com/downloads/)로 진입합니다. - 무료버전인 커뮤니티 다운로드를 위해 하단의 "Mysql Community(GPL) Downloads" 클릭 2. "MySQL Commu..

제이쿼리 이미지 미리보기 생성 / JQuery Image Preview 이미지에 마우스오버시 미리보기 이미지 툴팁(확대) 생성하는 코드입니다. 이미지만 확대하는 Preview, 이미지 확대후 캡션도 생성하는Preview 두가지 종류 입니다. - 이미지 태그 설정 html 부분 입니다. # mouseover 시, Image Preview Gallery 생성 without Caption with Caption Jquery함수에서 img태그에 data-image속성값이 있으면 해당값을 Caption으로 설정하여 Preview를 생성할 것입니다. HTML에서 원하는 엘리먼트에 "data-속성명" 을 통해 화면에는 표출되지않는 정보들을 부여할 수 있습니다. - Preview 태그를 생성하는 자바스크립트 함..

textarea 글자수 제한 / 바이트(Byte) 제한 클라이언트로부터 입력받고자 하는 텍스트가 긴 문자열의 경우, textarea태그를 설정하여 받게됩니다. 이 때, 입력받을 수 있는 최대 바이트수를 정해두고 해당 범위 내에서만 입력가능하도록 하는 자바스크립트 함수를 설정하겠습니다. (기본 태그로 bootstrap 클래스 적용) ※제한을 "글자수"로 두지않는 이유 한글은 한글자당 2byte를 할당하고, 영문자는 한글자당 1byte를 할당합니다. 만약 제한 기준을 "글자수"로 설정한다면 최대치로 입력했다고 가정했을 때, 한글과 영문자의 구성에 따라TextArea에서 전달하는 데이터의크기가 가변적이게 됩니다. 즉, TextArea를 통하여 전달하는 데이터양의 최대값을 설정하겠다는 취지를 벗어나게됩니다. -..

방금전, 잠을 자려고 누웠는데 집안에서 폭죽터지는 소리가 크게 나서 봤더니 얼마전 구매한 보조등이 폭발하여 조각들이 나뒹굴고 있었습니다. 처음에는 보조등이 문제인가 싶었는데 살펴보니 건전지가 폭발하였더군요.. 해당제품은 예전에 이마트에서 구비해둔 노브랜드 AAA건전지였습니다. 이상한 점은 각기 다른 방에 비치해둔 보조등에끼워둔 건전지가 동시에 폭발한 것이고, 양쪽 보조등 모두 미사용중인데 터졌던 것입니다.. 이에, 해당 내용 관련하여 검색해보니 이마트 측에서 2015년부터 2018년 12월 사이에 판매된 노브랜드 건전지에 일부 결함이 발견되었고, 2020년 11월 10일부터 자발적리콜을 실시한다는 내용이 있더라구요.. 하지만, 문제가 발생하기전에 이런 내용을 어떻게 알 수 있겠습니까 ;; 이 포스팅을 보..

이클립스, 전자정부프레임워크 단축키/사용 팁 웹 개발 코딩시, 주로 이용하는 자그마한 팁 항목들 입니다. * 메모리 용량 제한 늘리기 * 톰캣 타임아웃 제한 늘리기 * encodingType UTF-8 설정하기 * 내부 화면 분할하기 * 메소드, 클래스 선택적 이동하기 * 키워드 자동완성기능 이용하기 * 클래스 자동Import / 자동정리 기능 이용하기 * 프로젝트내 소스파일명 키워드 검색 * 소스파일내부 키워드 검색 1. 이클립스 메모리 용량(Heap size) 제한 늘리기 - 기본 메모리 설정 제한이 낮습니다. 설정파일을 변경하여 메모리제한을 늘리도록 하겠습니다. - 이클립스 설치폴더로 이동하여 eclipse.ini 파일을 편집기를 통하여 열고 "Xms2048m", "Xmx2048m" 으로 변경합니다..

리스트 List 내부 키워드 검색 데이터 목록을 불러올 때, List 혹은 List형식으로 "key" "value" 쌍으로 구성된 리스트 에 담아서 가져오는 경우가 많은데요, 이번 예제에서는 다음과 같은 샘플데이터에서 "city"와 "gender" 키워드 검색을 구현해보겠습니다. 1. 각 경우의 수에 대한 개별 처리 public static void searchList1(List list, String city, String gender) { /* 리스트 내부 검색 method1 */ System.out.println("search >> 도시: "+city+" , 성별: "+gender); List resultList = new ArrayList(); for(int i=0; i0) { System.out..