JavaScript & TypeScript40 Handlebar를 사용하여 배포까지 (+grunt +gradle) 현재 담당하고 있는 프로젝트에 기능이 추가되면서 개인적으로 공부도 할겸해서 기록으로 남기는 중이다.기존 프로젝트에 이미 포함된 내용인데 내가 몰랐던 부분을 알게되면서 남긴거라 내가 이 기능을 사내 프로젝트에 넣었습니다!이런건 아님을 먼저 알리며..아래 내용의 모든 코드는 이미 Github에 올려져있다. 코드를 다 이미지로 찍어서 복붙으로 따라갈순 없으니 여기를 참고하자 사내에서 서비스하고 있는 프로젝트들은 IE 7,8을 공식 지원하고 있다.그래서 요즘 유행하는 angular, react는 서비스 프로젝트에서는 쓰지 못하고 내부시스템에서만 사용하는 중인데, js 프레임워크들을 못쓰면서 경험하는 제일 큰 답답함이 클라이언트 템플릿 문제이다. (다른게 더 답답할수도 있음..) 클라이언트 템플릿이란 용어에 생소.. 2016. 6. 17. 부분뷰 (ng-include) HTML, JSP같이 VIEW 영역에 대한 코드는 서버사이드처럼 코드를 분리해서 작성하지 않고, 화면의 한 페이지당 하나의 파일로 코드를 작성하는 경우가 많다. 이럴 경우 각 엘리먼트가 하는 일을 한눈에 알 수 없을 정도로 복잡해진다. 다행히 AngularJS에서는 마크업 파일을 분리, 호출 할수 있는 디렉티브를 제공하는데 이것이 바로 ng-include 이다. 아래 코드를 보자. 위 코드는 상품리스트를 나타내는 product.html 의 코드이다. 현재는 그리 코드가 많지 않지만, 점차 기능을 붙임에 따라 코드가 늘어날 것이므로 ng-include를 사용하여 코드를 분리시키겠다. product.html productList.html 메인 컨텐츠 부분만 별도로 분리하여 productList.html 을 .. 2016. 1. 4. Ajax ($http) 처리 AngularJS 에서는 $http 라는 서비스를 통해 Ajax 요청을 수행한다. Ajax는 비동기적 자바스크립트 및 XML의 약자인데 여기서 중요한 것이 바로 비동기적이다. 일반적으로 서버사이드에 요청을 하여 데이터를 수신하는 동작은 처리하는데 많은 시간이 필요하다.이전의 동기적 방식에서는 서버사이드에서 데이터가 올때까지 모든 동작을 멈추고 기다리는데,웹서비스에서 이런 상황은 사용자에게 굉장한 불편을 준다.이를 위해 서버사이드에 데이터를 요청하여 받는것이나, 가공된 데이터를 메일 혹은 SMS로 보내는 등 처리하는데 많은 시간이 필요하지만 UI에서 변화가 필요없는 동작의 경우 비동기로 처리를 한다.많은 시간이 필요한 처리는 요청만 해놓고 해당 결과가 올때까지 다른 일을 처리하다가,결과가 오면 다음 행위를.. 2016. 1. 3. prototype 이란? 우선 이 포스트는 http://insanehong.kr/post/javascript-prototype/#toc_291 를 읽고 나름 정리와 추가코드를 작성한 것임을 미리 밝히고 시작하겠습니다. 그래서 해당 블로그의 글을 읽고 오시면 더 도움이 되실것 같습니다. SF만화나 영화를 보면 프로토타입이란 단어가 간혹 들린다. 예를 들자면 어떤 사이보그들의 모체 혹은 처음 버전을 프로토타입이라고 얘기를 하는데, 자바스크립트에서의 프로토타입도 이와 크게 다르지 않다. 자바스크립트에서의 프로토타입은 객체생성의 모체가 되는 놈을 말한다. 여기까지는 대부분 아는데, 이 프로토타입에는 2가지 유형이 있다는 것을 대부분은 모르고 있다. 프로토타입에는 프로토타입 연결과 프로토타입 속성 2가지가 있다. 이때, 흔히 API나 책.. 2015. 3. 6. [읽기 좋은 자바스크립트 코딩 기법] 문장과 표현식(조건문과 반복문) 3 문장과 표현식 자바스크립트에서 if나 for같은 제어문을 사용하는 방법은 2가지가 있다. //나쁜 예 if(condition) doSomething(); //나쁜 예 if(condition) doSomething(); //좋은 예 if(condition){ doSomething(); } //나쁜 예 if(condition){ doSomething(); } 처음 2개의 예제는 중괄호 없이 if 문을 사용하고 있다. 크락포드의 코드 컨벤션과 jQuery 코어 스타일가이드 등 여러 가이드에서 이러한 방식을 금지하고 있다. 한줄에 입력하는 방식은 오해의 소지가 크기 때문이다. 이를테면 아래와 같은 코드는 어떤의미인가? if(condition) doSomething(); doSomethingElse(); co.. 2015. 2. 23. [자바스크립트 핵심가이드] 주석 자바스크립트에서는 자바와 마찬가지로 2가지의 주석방법이 존재한다 /* */ 와 // 이다. 보통은 연속된 여러줄의 경우에 /* */를 사용하고, 1줄의 주석을 사용할 경우에는 //를 사용하는 것으로 알고있다. 하지만 /* */의 경우에는 정규표현식 리터럴로 인해 의도치 않은 결과를 발생시킬 수 있다. 예를 들자면 /* var rm_a = /a*/.match(5); */ 위와 같은 경우 구문 오류가 발생한다. 그러므로 가능하면 /* */ 대신에 // 를 사용할 것을 궈한다. 2015. 2. 6. 이전 1 ··· 3 4 5 6 7 다음
