전체 카테고리

Java에서 템플릿을 이용해 Excel 파일을 다운로드 하기 위해서는 크게 두 가지 경우를 사용한다. 'JExcel'을 사용하는 방식과 'POI + Jxls'를 사용하는 방식이 그것이다. 이 글에서는 내가 직접 사용해본 'POI + Jxls'을 사용하는 방식에 대해서 간단히 정리할 것이다. 1. POI 우선 POI란 아파치 소프트웨어 재단에서 만든 라이브러리로서 마이크로소프트 오피스 파일 포맷을 순수 자바 언어로서 읽고 쓰는 기능을 제공한다. 주로 워드, 엑셀, 파워포인트와 파일을 지원하며 최근의 오피스 포맷인 Office Open XML File Formats (OOXML, 즉 xml 기반의 *.docx, *.xlsx, *.pptx 등) 이나 아웃룩, 비지오, 퍼블리셔 등으로 지원 파일 포맷을 늘려가고..

$.each() 특정 요소의 하위 요소를 하나씩 꺼내기를 반복한다. Javascript의 Array.forEach와 같은 기능을 한다. + $.each()에서는 일반적인 for문처럼 break, continue가 되지 않는지 의문이었으나 아래와 같이 대체하여 사용할 수 있다. $.each(list, function(idx, item) { if(expression) { return false; // break; return true; // continue; } });

Closest(), find() 함수는 모두 선택한 요소를 기점으로 특정 요소를 찾는 역할을 한다. Closest() jQuery 선택자로 선택한 요소로부터 상위 요소로 옮겨가며 해당 조건에 맞는 요소를 찾을 때까지 탐색한다. 조건에 맞는 가장 가까운 부모 요소를 찾으면 탐색을 중단한다. find() jQuery 선택자로 선택한 요소로부터 하위 요소로 옮겨가며 해당 조건에 맞는 요소를 찾을 때까지 탐색한다. 조건에 맞는 가장 가까운 자식 요소를 찾으면 탐색을 중단한다. cf. filter() 자신의 자식(하위) 요소들 중 조건에 맞는 모든 요소를 찾는다. find()와 마찬가지로 자식 요소에서 검색하는 역할을 수행하나, 그 대상이 하나인지 여러개인지에 차이가 있다. cf. Javascript - Arra..

outerHTML, innerHTML HTML에서 제공하는 함수로, 자신을 포함한 HTML, 자신 하위의 HTML을 반환한다. Test cf. innerTEXT : 내부의 텍스트를 반환한다. cf. jQuery에서 innerHTML과 유사한 html() 함수는 제공하나, outerHTML 기능을 제공하진 않는다. 하지만 outerHTML함수와 같은 기능으로 동작하는 함수를 사용자 정의 함수로 구현할 수 있다. $.fn.outerHTML = function () { return $(this).clone().wrapAll("").parent().html(); } 선택한 요소를 div(다른 태그여도 상관없다.)로 감싸고, 이 div(선택한 요소의 parent)의 내부 html을 추출하는 방식이다.

offset(), offset(coordinateObj) jQuery 선택자로 선택한 요소의 좌표를 가져오거나 설정할 수 있다. 인자가 없을 경우 요소의 좌표를 가져오고, 인자(top, left 속성을 지닌 객체)를 넣어줄 경우 해당 좌표로 요소를 이동시킨다.

Strict strict 모드는 Javascript ES5부터 지원하는 기능으로 'use strict'를 작성함으로써 적용할 수 있다. 'use strict' 하단부터 적용되며, 이는 곧, 내가 앞으로 엄격한 JS 문법을 사용해 코드를 작성할 것이니, JS Engine 역시 엄격하게 문법을 적용시켜서 처리해달라는 의미가 된다. strict 모드를 적용함으로써 코딩의 실수를 최소화할 수 있고, JS Engine이 처리하는 알고리즘이 단순해져 퍼포먼스가 빨라지기 때문에 strict 모드로 코드를 작성하는 것은 필수라고 할 수 있다. 때문에, 되도록이면 코드 최상단에 'use strict'를 작성해 전체 스크립트에 strict 모드를 적용할 것을 추천한다. 전체 스크립트에 적용할 경우(전역 레벨의 strict..

debugger 키워드 debugger 위치에서 코드의 실행을 멈춘다. 단, 브라우저의 개발자 도구 창이 열려있을 때에만 멈춘다. ES5부터 지원하는 기능이다. 아래의 코드를 개발자 도구를 켠 상태로 실행하면 2번째 라인에서 실행이 멈춰서, 콘솔에 로그가 찍히지 않음을 볼 수 있다. var sports = "스포츠"; debugger; console.log(sports); debugger 코드를 테스트하고자 하는 코드의 중간 중간에 삽입함으로써 부분적으로 코드를 테스트할 수 있게 되는 장점이 있다.

AngularJS에는 기본 내장 디렉티브들뿐만 아니라, 사용자가 직접 디렉티브를 생성해서 사용할 수도 있다. 디렉티브를 생성하는 데에는 기본적으로 아래의 구조를 따른다. var app = angular.module("모듈명", []) app.directive("디렉리브명", [], function(){ return { restrict: E/A/C/M(조합 가능), template/templateUrl: "", replace: true/false, priority: x transclude: true/false, scope: true/false, {...} } }); 디렉티브를 생성할 때에는 아래와 같은 옵션들을 줄 수 있다. 1) restrict 디렉티브를 적용할 DOM element의 속성을 의미한다. ..

입사하게 된 회사에서 기존의 코드를 볼 기회가 생겼다. AngularJS를 기반으로 진행된 프로젝트에 RequireJS를 사용한 것을 보고 이에 대해 간략히 정리해보고자 한다. 일반적으로 Javascript 기반의 어플리케이션을 개발하다보면 여러 파일로 분리하여 개발하게 된다. 이 경우에 유지보수성은 증대될 수 있으나, 파일의 수가 증가함에 따라 스크립트 태그의 삽입이 누락되거나 잘못 배치될 가능성이 커진다. 더불어 스크립트의 종속성을 관리하기 어려워진다. RequireJS는 JavaScript 종속성을 쉽게 관리하고, 지연로딩(Lazy-Loading)하기 위해 사용되는 Javascript 라이브러리다. 종속성을 모듈의 형태로 관리하며, 모듈을 생성하고 호출하기 위한 API를 제공한다. 1. Requir..

AngularJS에서 지시자(Directive)란 기존의 방식으로는 HTML의 DOM을 제어하기 위해 Javascript 혹은 JQuery를 사용함으로써 가능했다면, AngularJS에서는 기존 HTML을 확장하는 방식을 지시자를 통해 제공한다. 하나의 DOM에는 이와 연결되는 하나의 Directive를 만들어 해당 DOM을 조작할 수 있다. data-ng-app, ng-app ng-app으로만 사용해도 되나, 일부 HTML 편집기에서 오류가 발생하기 때문에 HTML표준 규칙을 맞춰주기 위해 data-ng-app으로 사용하곤 한다. 해당 부분부터 AngularJS를 사용하겠다는 의미로, 사용하고자 하는 모듈명을 작성하기도 한다. ng-init 자바스크립트 변수나 함수를 초기화한다. ng-model 양방향..