레퍼런스 마이닝

몇 해 전부터 바닐라 JS에 대한 언급이 많았다. 프로그래밍에서의 바닐라 용어는 복잡하고 화려한 UI나 사용하기 편리한 부가기능을 제외한 그야말로 기본적인 기능만 구현한 상태를 뜻한다. 그러므로 바닐라 JS는 새로운 프레임워크나, 라이브러리가 아닌 순수 자바스크립트이다. 이미 우리가 사용하는 브라우저에는 바닐라 JS가 탑재되어있다. 바닐라 JS 공식 홈페이지에는 순수 자바스크립트를 사용하면, 가볍고 빠르며 호환성이 좋다는 언급을 하고 있다. 최근 외국에서는 jQuery를 사용하는 프로젝트가 점점 줄어들고 있는 상황이다. 국내 또한 점점 외국 개발 트렌드에 맞춰가는 추세이다. 아직 국내에는 jQuery 의존도가 높긴 하지만 바닐라 JS, ES6, 타입 스크립트 등을 공부하여 시대 흐름에 뒤처지지 않은 개발..

버블 정렬 기본 개념 서로 인접한 두 원소를 검사하여 정렬하는 알고리즘(인접한 2개의 레코드를 비교하여 크기를 순서에 맞게 서로 교환한다.) 선택 정렬과 기본 개념이 유사하다. 버블 정렬 구체적인 개념 버블 정렬은 1|2, 2|3, 3|4 ... 이런 식으로 마지막(마지막 -1) 번째 자료까지 비교하여 교환한다. 1회전을 수행하고 나면 가장 큰 자료가 맨 뒤로 이동하므로 2회전에서는 맨 끝에 있는 자료는 정렬에서 제외되고, 2회전을 수행하고 나면 끝에서 2번째 자료는 정렬에서 제외된다. 이런 식으로 정렬을 1회전 수행할 때마다 정렬에서 제외되는 자료가 하나씩 늘어난다. 버블 정렬 알고리즘 예제 import java.util.Arrays; public class BubbleSort { public stat..

https://loading.io/ loading.io - Your SVG + GIF + PNG Ajax Loading Icons Build Your Ajax Loading Icons with SVG / CSS / GIF / PNG ! loading.io 로딩 이미지를 무료로 다운로드할 수 있는 사이트이다. 급하게 개발자가 로딩 이미지를 구해야 할 때 사용한다. 로딩 이미지를 만들 수 있는 각종 옵션들이 여러 존재하며, 수많은 샘플들이 존재한다. 이역시 모두 수정 가능하다. 로딩 이미지를 찾는다면 Loading.io를 추천한다.

도메인 주소로 ip 찾는 방법이다. CMD 에서 간단한 명령어로 확인할 수 있다. 1. ping ping 테스트를 통해 해당 도메인의 ip주로를 확인 할 수 있다. 2. nslookup nslookup은 도메인 이름과 ip 주로를 확인하는 기능을 가진 네트워크 관리 툴 중 하나이다. 3. tracert tracert는 현재 내가 접속한 네트워크 환경에서부터 접속하고자 하는 호스트의 목적지 ip까지 이동하는 경로를 확인할 수 있다.

JSdoc을 사용하여 자바스크립트를 문서화하는 도구이다. 간단한 설정과 명령어로 주석을 통해 깔끔한 템플릿을 통해 문서를 만들어준다. frontend 에도 주석을 꼼꼼히 다는 습관이 필요하다. https://github.com/jsdoc/jsdoc jsdoc/jsdoc An API documentation generator for JavaScript. Contribute to jsdoc/jsdoc development by creating an account on GitHub. github.com https://github.com/clenemt/docdash clenemt/docdash :zap: Lodash inspired JSDoc 3 template/theme. Contribute to clenem..

동적 SQL에서 공통적으로 필요한 것은 collection 파라미터를 반복 처리하는 것이다. IN 절을 통한 동적 SQL, 동적 Inset문이 대표적이 예이다. foreach 엘리먼트 내부에서 접근할 수 있는 변수명을 collection을 통해 지정할 수 있다. 또한 foreach 엘리먼트에서 사용할 수 있는 item, index 두 가지 변수를 선언한다. 이 엘리먼트는 또한 열고 닫는 문자열로 명시할 수 있고 반복 간에 구분자도 추가할 수 있다. SELECT EMP_ID , EMP_NAME , BIRTH_DATE , DEPT_CODE , EMP_TYPE , USE_YN , TEL , HOBBY , SALARY , LEV FROM TEMP WHERE EMP_ID IN #{item} empList 리스트에..

자바스크립트에서 자주 사용하는 객체 전달 의미로 사용되는 = 은 참조를 의미한다. 대부분이 참조만으로도 기능상의 문제가 없이 작동하기 때문이다. 아래 예제는 참조한 객체의 key 값 변경이 미치는 영향을 알아본 것이다. 일반적인 상황에서는 데이터가 중간에 변동될 일이 없다. 하지만 얕은 복사, 깊은 복사가 필요한 경우가 있다. 간단한 예를 들어 복사하는 방법을 알아보자. 얕은 복사(Shallow Copy) 얕은 복사에는 다양한 방법이 제공된다. // JQuery extend() var data = { key: 'trend' }; var ref = $.extend({}, data); console.log(data); console.log(ref); data.key = 'issue'; console.log(..

React 개발 중에 나타난 Warning이다. Warning이라 큰 문제는 없지만 console에 자꾸 나타나는 것은 언젠가는 바로 잡아야 한다. DocumentTitle.js 31 라인 div와 DocumentTitle.js 30 라인 p 태그의 문제라고 친절히 알려준다. 태그의 문제가 있다. 퍼블리셔가 작업한 HTML을 그대로 가져와 Component를 구성하였는데 React의 꼼꼼함에 걸린 셈이다. ... p 태그는 인라인 요소만 포함 할 수 있다. div 태그는 블럭 요소이므로 p 태그 안에 div 태그를 넣는 것은 부적절하다는 의미이다. 원인은 생각보다 간단하다. React는 태그에 대해 엄격한 성격을 가지고 있다. 태그를 열고 닫고를 정확히 해야 하며 또한 성격에 맞게 제대로 사용해야 한다.

https://www.iconfinder.com/ 3,650,000+ free and premium vector icons. SVG, PNG, AI, CSH and PNG format. Iconfinder is the leading search engine and market place for vector icons in SVG, PNG, CSH and AI format. www.iconfinder.com 아이콘을 무료로 다운로드할 수 있는 사이트이다. 디자이너 또는 퍼블리셔가 아니라면 아이콘을 프로그래머가 필요할 일은 없다. 하지만 예외사항은 늘 있는 법이다. 가끔이지만 그럴 때 이용하는 사이트이다. 퀄리티 있는 아이콘이야 무료는 아니지만 무료 아이콘으로도 충분히 만족스러운 결과를 낸다. 사이트에 접속..

코드를 작성하다보면 수많은 약어와 합성어가 많이 사용된다. 그런 소스코드에 대해 스펠링 검사를 하는건 불필요한 작업이다. 그래서 스펠링 검사를 끄는게 효과적이다. Spelling 검사 해제 Window -> Perferences -> General -> Editors -> Text Editors -> Spelling