본문 바로가기

분류 전체보기

Array essential with ES6 -1- 소스코드 중간중간에 ES6 문법이 적용되어 있습니다. 예제코드를 실행한 브라우져 환경은 크롬 카나리 입니다.. ES6문법에 대한 설명이 생략된것은 포스팅에 포커스가 스터디에 맞춰져 있기때문입니다. 배열의 생성자 var arr1 = []; var arr2 = new Array(); // [] var arr3 = Array(); //new 연산자 생략가능 var arr4 = new Array(10); //[undefined,undefined,...] 길이가 10인배열 var arr5 = [1,2,3]; //[1,2,3] var arr6 = new Array(2,3); // [2,3] /*생성자 예외*/ var arr1 = [1,2,] // IE8 : [1,2,undefined] other : [1,2] va.. 더보기
Data Structures & Algorithms with JavaScript O'REILLY 에서 나온 책으로 간단한 스터디를 진행하고자 합니다. 초기 발단은 ,리액트 스터디에서 한분이 의견을 주셨고 저도 거기에 적극 동참해서, 기존 스터디의 서브 스터디로 진행하게 되었는데 자바로 입문할당시 면접을 준비하면서, 자료구조나 알고리즘을 공부했지만 현재 자바스크립트를 주력언어로 쓰는만큼 자바스크립트로 된 자료구조를 한번쯤 공부해야된다는 막연한 생각이 있었습니다. 그래서 이번기회에 이책을 기준으로 스터디를 진행하게 된것이고 디자인 패턴은 진행할지 모르겠지만, 순차적으로 디자인패턴에대해서도 개별 공부할 계획에 있습니다. 책의 서평을 보니 오역이랑 예제에 대한 검증이 되어있지않다는 이야기가 있지만, 기본적으로 자바에대한 알고리즘 지식이 있기 때문에 진행하는데 있어 큰문제는 없어 보입니다. .. 더보기
implement a paging on stored procedure Node.js 에서 mariassql 모듈을 이용해 stored procedure 를 호출하고 사용해 왔지만, procedure 에서 declare 한 variable 에 out (반환) 을 사용해본적이 없었다. 클라이언트에서 넘긴 최소한의 정보들을 req.body로 호출하고 그값을 prepare 하게 넘겨서 mariasql 에서 제공하는 limit 함수를 이용해 paging 처리된 목록들을 출력하는데 전역 변수나 클로저를 사용하지않고, 프로시저를 통해 반환값을 가져오고 싶었다. 먼저 페이징 처리에 가상 시나리오는 다음과 같다. -자유 게시판 (테이블명칭 : Board )에 100개의 정상적인 ROW 데이터 존재. -사용자는 10개씩 1페이지로 데이터를 보길 원함. 가상 시나리오를 통해 페이징 처리를 진.. 더보기
.attr() vs .prop() 비교 - 셀렉트박스,라디오박스 $("input:radio[name='test_name'][value='type2']").attr('checked',true); $("input:radio[name='test_name'][value='type2']").prop('checked',true); 필자는 Jquery에서 attr 을 많이 사용 합니다. 라디오 박스를 제어하는데 있어서 attr속성을 이용하는데 최초 한번에 동작만 실행되고 라디오 박스에 대한 액션이 실행되지않았습니다. prop로 해결하게 되었는데, 원인에 대한 궁금증을 해소하고자 구글링을 해봤습니다. 참고 .attr() vs .prop() 우선, 취급하는 정보가 다릅니다. attr() 은 HTML 의 Attribute 를 , prop() 는 JavaScript 의 Property .. 더보기
ngDraggable -앵글러 모듈을 활용한 드래그앤 드랍 순서 정렬 그간 밀려드는 프로젝트를 처리하느라 포스팅에 소흘했습니다... :ㅇ오랫만에 포스팅을 해봅니다.!오늘 소개해 드릴 모듈은 Angular 에서 Draggable 한 Ordering 을 구현하는 모듈 입니다.설치 방법과 사용방법은 무척이나 간단합니다.bower install ngDraggable설치후 실행될 컨트롤러가 있는 index.html(기본) 안에 ngDraggable.js 스크립트 파일을 추가시켜줘야 합니다.이때 Angular.js 가 먼저 로드 되어야 하기때문에Angular.js 보다 아래 라인에 스크립트 파일을 추가합니다. 그리고 , 의존성을 추가 해줘야 합니다.var app = angular.module('eventApp', [ 'ngRoute', 'angularFileUpload', 'ui.b.. 더보기
MariaSQL Upgrading v0.1.x to v0.2.x 오랫동안 0.1.x 버전을 사용해 왔습니다. 0.1.x 버전을 고집하는데는 관습적인 이유가 주된 이유였지만 지난 squel.js 소개 포스팅글에 언급했듯이 요즘 사내에서는 성능 향상이 주된 사항입니다. 마리아sql 모듈같은경우 노드버전에 영향을 받게되는데 노드 최신버전의 경우 마리아sql 0.1.x 버전대 설치가 불안정 합니다. 그래서 비젼관리 모듈인 NVM-WIN 을 사용하여 버젼을 스왑하는방식으로 필요에 따라 노드버전을 조절해왔지만 향후 프로젝트는 노드 최신버전에 맞게 마리아sql도 최신버전으로 가는것이 옳다는 결정이 내려졌습니다. 해당내용에 대해 모듈 개발자가 올려놓은 글이 있습니다. https://github.com/mscdex/node-mariasql/wiki/Upgrading-v0.1.x-to.. 더보기
squel.js (SQL query string builder) : ) 프로젝트에서는 재사용성을 높이기위해 query.js 파일에 SQL query 문을 관리하고 exports 한 String 형태의 쿼리문을 require 하는식으로 쿼리문 관리를 해오고 있었습니다. 요즘 사내에서는 성능 튜닝이 큰이슈로 자리매김하고있습니다. 자바를 경험해본 저로서는 String , StringBuilder , StringBuffer 의 차이를 알고있기때문에. 프로젝트에 맞는 StringBuilder 모듈을 찾아보게되었습니다. - ( 차이점 :https://slipp.net/questions/271) 오늘 간략하게 포스팅할 squel.js 입니다. https://hiddentao.github.io/squel/ 레퍼런스 가이드가 너무나도 잘되어 있습니다. 바로 개인 프로젝트에 적용시켜 보았습니.. 더보기
Angular 에서 Primitive 타입 대신 오브젝트 사용 요즘.. 블로그를 할시간을 내기가 힘들다.. 그래도 해당 내용은 중요한것같아서 포스팅 해놓고자한다. 한빛에서 나온 Angular 책을 보다보면 예제에 정의된 데이터 모델의 형태가 궁금했다. 왜 Primitive 타입이 아닌 객체방식을 사용하는지 ? 데이터 모델은 프리미티브가 아닌 오브젝트를 사용해야 하는데.. 지시어는 객체를 사용할때 복사가 아닌 참조 방식을 이용해서 모델 속성 값을 받을 수 있는 $scope 자식 오브젝트를 포함하며 프리미티브 타입의 값을 사용할 경우 찾기 어려운 에러를 유발할 수도 있다. 자세한 내용은 해당 주소 참고 바란다! https://github.com/angular/angular.js/wiki/Understanding-Scopes 더보기
Phantom 모듈을 활용한 web scraping 1. 준비 사항 Node.js 환경에서 Scraping 을 진행하려면 phantom 모듈이 필요 합니다. https://www.npmjs.com/package/phantom 이와 함께 서버 단 에서 제이쿼리 문법을 사용하여 DOM 을 제어 해야 함으로 Jquerygo 모듈도 같이 설치 합니다. https://www.npmjs.com/package/jquerygo 2가지 모듈은 모두 해당 프로젝트에 local install 되어야 하며, 설치가 완료되었다면 Scraping 을 위한 준비 가 끝났습니다. 2. Phantom 모듈을 활용한 Scraping Scraping에 사용한 프로젝트의 구조는 Express 와 angular 기반 구조로 작성 되었습니다. web Scraping 할 대상 페이지 입니다. h.. 더보기
Webstorm Environment Setting ( Encodings ) 신입때 겪는 가장큰 고민중 하나는 한글이 깨지는 문제일것입니다.그래서 개발을 하기전에 각자 자신에 맞는 코딩타입을 설정하는것이 중요합니다.오늘은 제가 사용하는 웹스톰 10.0.4 버전으로 코딩타입을 설정하는 부분에 대해 짤막하게 포스팅하고자 합니다.setting 은 현재 열려있는 해당 프로젝트 설정을 하게 되는곳이고default setting 은 웹스톰에 생성될 전체 프로젝트에 대한 기본값을 설정해주는곳입니다.default setting 에 들어가서 Editor > File Encodings 에 박스친곳에 설정을 UTF-8 로 변경해주고 Transparent native-to-ascii conversion 에도 같이 체크를 해줍니다.적용과 확인.EUC-KR 보다는 UTF-8을 권장드리고 싶습니다. 그이유.. 더보기

티스토리툴바