JavaScript를 필두로, 전반적인 Front-End 기술에 관심이 많습니다.

TypeScript: 함수(Function)

November 18, 2016 Dev

이전 글 - TypeScript: 인터페이스(Interface) 함수 타입 선언 전에 한 번 다룬대로, TypeScript는 함수에도 타입을 선언할 수 있다. 타입 지정 대상은 함수로 전달되는 매개변수와 최종 리턴 값이 될...

Deview 2016 1일차 정리

November 7, 2016 Offline

키노트 키노트에서는 네이버 랩스에서 진행하고 있는 신기술 개발 발표에 많은 시간을 할애했다. 크게 세 가지 기술이 소개됐다. WHALE 첫 번째는 네이버의 새로운 웹 브라우저 WHALE, 이전부터 네이버 정도면...

TypeScript: 인터페이스(Interface)

October 17, 2016 Dev

이전 글 - TypeScript: 클래스(Class) 클래스와 인터페이스 지금껏 JavaScript만을 다뤄본 개발자라면 인터페이스라는 개념은 익숙치 않을 것이다. 하지만 Java나 C# 등의 정적 타입 언어에서는 이미 많이 쓰이는 개념이다. 인터페이스는...

TypeScript: 클래스(Class)

October 17, 2016 Dev

이전 글 - TypeScript: Basic Type 클래스는 JavaScript 생태계 속에서도 TypeScript에만 있는 개념이 아니다. CoffeeScript나 ES2015를 사용해봤다면 이미 클래스를 몇 번 쯤은 사용해보았을 것이다. 이 글에서는 ES2015의 클래스를...

첫 번째 이직

October 15, 2016 Life

이직을 하게 됐다. 가만히 앉아있는데 무슨 오퍼가 와서 이직하게 된 건 아니고(일부 맞는 말이기는 한데..), 내가 원해서 새 직장을 찾게 되었다. 물론 이직을 하게 된 동기도 있지만.. 그건...

[번역] 반응형 프로그래밍과 RxJS 이해하기

October 9, 2016 Code

요약: RxJS는 이벤트 스트림과 데이터를 쉽게 만들고 다룰 수 있도록 도우는 라이브러리다. 복잡하지만 가독성이 좋은 비동기적 코드를 더 쉽게 작성할 수 있도록 도운다. 큰 규모의 비동기 어플리케이션을 작성하는...

TypeScript: Basic Type

October 2, 2016 Dev

이번 글에서는 TypeScript에서 제공하는 Basic Type들을 알아볼 것이다. 개인적으로 공부하고 정리한 글이니 퀄리티가 많이 낮을 수도 있다. Type annotation 먼저 TypeScript의 타입들을 알아보기 전에 Type annotation을 알아본다. 일반...

TypeScript: 소개

September 25, 2016 Dev

Introduction JavaScript that scales. TypeScript 캐치프레이즈 TypeScript는 Microsoft에서 개발하여 2012년에 발표한 JavaScript로 컴파일 되는 언어이다. JavaScript에 정적 타이핑과 ES2015를 기반으로 하는 객체지향적 문법이 추가된 것을 주요 특징으로 한다....

람다, 익명 함수, 클로저

September 17, 2016 Dev

람다에 대한 부끄러운 에피소드가 하나 있다. 어떤 분이 페이스북 그룹에 JavaScript 콜백과, 람다함수, 클로저에 대해 물어보는 글을 올렸다. 난 당시 콜백과 클로저에 대해서는 어느정도 알고 있었지만 람다에 대해서는...

JavaScript 클로저(Closure)

August 30, 2016 Dev

클로저란? MDN에서는 클로저를 다음과 같이 정의하고 있다. 클로저는 독립적인 (자유) 변수를 가리키는 함수이다. 또는, 클로저 안에 정의된 함수는 만들어진 환경을 ‘기억한다’. 흔히 함수 내에서 함수를 정의하고 사용하면 클로저라고...

JavaScript 프록시(Proxy)

August 17, 2016 Code

Proxy As a Design Pattern 프록시는 일반적으로 다른 어떤 클래스의 인터페이스로 동작하는 클래스이다. (중략) 요컨대, 프록시는 내부적으로 실제의 객체(real subject)에 접근할 때 호출되는 래퍼(wrapper) 혹은 대리 객체다. –...

[underscore] extend 올바르게 사용하기

July 31, 2016 Code

객체를 확장하는 extend()는 복사용도로도 쓸 수 있는 정말 편리한 메소드지만, 사용하면서 주의할 점이 하나 있는데, 바로 인자 순서이다. 예를 들어, 여러 명의 사람 정보를 저장한 배열에 똑같은 프로퍼티를...

Assert: Node.js 테스트 모듈

May 9, 2016 Code

요즘은 TDD니, BDD니 해서 테스트의 중요성이 더 없이 강조되고 있다. 워낙 많이 언급되다 보니 여지껏 테스트 코드를 작성할 일이 없었던 나도 조금은 공부해야겠다는 생각이 들었다. 방대한 라이브러리를 품고...

CoffeeScript와 ES2015에 대한 생각

May 1, 2016 Opinion

CoffeeScript의 추억 명시적인게 묵시적인 것보다 낫다. - The Zen of Python CoffeeScript는 회사 프로덕트에서 메인으로 쓰고 있는 언어다. 내가 입사한지가 약 10개월 좀 넘었고, 그동안 내내 CoffeeScript를 사용해왔으니...

[lodash/underscore] throttle과 debounce

April 24, 2016 Code

throttle 매 밀리세컨드마다 최대 한 번만 호출될 수 있도록 Throttle된 함수를 만듭니다. – throttle by lodash throttle - lodash throttle - underscore DOM API 중 onmousemove, onmouseover, onscroll...

[번역] AngularJS 스타일 가이드 소개

April 10, 2016 Dev

이 글은 Francesco Iovine의 An Introduction to AngularJS Style Guides를 한국어로 번역한 것입니다. 오역 제보나 더 나은 번역 제안은 언제나 감사합니다! 스타일 가이드란 무엇일까? AngularJS 프로젝트는 스타일 가이드를...

webpack 실전 가이드

April 3, 2016 Code

webpack은 모듈 번들러로, 의존성을 가진 모듈들을 다루고, 그 모듈로부터 정적인 asset을 생성한다. – webpack 페이지 공식 설명 모듈 로더, 모듈 번들러 Node.js는 CommonJS 표준이 구현되어 있으므로 별도의 라이브러리...

Sequelize.js 다루기

March 27, 2016 Code

이 문서에서 사용되는 코드는 ES2015의 문법을 다소 사용하고 있으므로 가급적 Node.js v4(LTS) 이상의 버전을 권장한다. Node.js는 대개 MongoDB + Mongoose 조합과 함께 사용하는 경우가 많지만 가끔 RDB의 필요성을...

JavaScript Promise

March 14, 2016 Code

솔직히, 나는 여지껏 Promise를 잘못 사용하고 있었다. 이를테면 다음과 같이 사용했다. User .findById(id) .then(function(user) { Project .findAll({ user: user.id }) .then(function(projects) { user .asyncSomething() .then(function(blah) { console.log('Done!'); });...

JavaScript this 정리

March 10, 2016 Code

JavaScript에서 this 키워드는 흔히 객체지향적으로 자바스크립트를 작성할 때 종종 사용되곤 한다. 하지만 학부생 수준에서 배우게 되는 다른 객체지향언어(C++ / Java)와는 여러가지 상이한 점이 존재한다. 다음은 평범한 this의 용례다....

JavaScript에서 객체 복사하기

February 8, 2016 Code

부끄럽게도 얼마 전에야 자바스크립트에서 =을 사용한 객체 복사는 Assign. 즉, 참조만 하는 것임을 알았다. 어찌보면 예상가능한 것임에도 불구하고 얕은/깊은 복사가 필요한 경우가 생각보다 많지 않았기 때문에 알지 못했던...

Angular.js Directive Scope Binding 전략

January 22, 2016 Code

Angular.js의 가장 기본적인 구성요소인 directive의 scope binding은 다루기가 의외로 까다롭다. 게다가 binding 종류와 그 사용법에 대해 종종 잊어먹어서 =만 사용하게 되기도 하고, 그래서 정리를 할 필요를 느꼈다. 먼저...

Angular.js에서 CJK break-word 구현하기

January 17, 2016 Code

얼마 전에 단어 단위로 줄바꿈이 되도록 구현해달라는 요청이 들어와서 해결한 기록을 남긴다. CSS의 break-word 속성은 안타깝게도 아시아권 문자(CJK)에 적용되지 않는다. 참고: word-break - CSS | MDN 따라서 해결하려면...