TOAST UI
APPLICATIONS
Chart
Editor
Grid
Calendar
Image-editor
COMPONENTS
App Loader
Auto Complete
Color Picker
Context Menu
Date Picker
Pagination
Rolling
Select Box
Time Picker
Tree
TOOLS
TOAST UI Doc
ESLint Config
Release Note
FE GUIDE
POSTS
Applications
Chart
Editor
Grid
Calendar
Image-editor
Components
App Loader
Auto Complete
Color Picker
Context Menu
Date Picker
Pagination
Rolling
Select Box
Time Picker
Tree
Tools
TOAST UI Doc
ESLint Config
Release Note
FE Guide
Posts
Posts
#All
301
#toastui
79
#angular
4
#architecture
9
#babel
4
#browser
61
#bundler
10
#css
7
#design pattern
4
#devtool
15
#ecmascript
65
#es6
31
#etc
31
#framework
15
#html5
8
#ionic
1
#monthly
27
#node.js
8
#opensource
20
#performance
30
#react
38
#react native
2
#redux
7
#refactoring
1
#svelte
2
#testing
17
#typescript
12
#vue.js
13
#webassembly
9
less
async 함수 - 친근한 프로미스 만들기
async 함수는 크롬55 버전부터 사용할 수 있다. 이 함수는 프로미스 기반의 코드들을 메인 스레드의 블로킹 없이 동기화 형식으로 사용할 수 있게 한다. 비동기 코드를 "덜 영리하게"하고 읽기 쉽게 만들어준다.
#es6
2016.12.26 - 9 min read
자바스크립트의 화살표 함수 도입
ES6는 화살표 함수를 도입했다. 화살표 함수는 3가지 장점이 있는데 첫째로, 간결한 문법을 가졌다. 둘째, 명시적인 반환을 하며 한 줄로 멋지게 작성할 수 있게 해준다. 셋째, 다른 함수 내부에서 화살표 함수를 사용할 때 this를 재차 바인드 하지 않는다. 세 번째 장점은 클릭 핸들러와 비슷한 여러 가지의 구현을 정말 편리하게 해준다.
#ecmascript
#es6
2016.09.12 - 4 min read
Generator in Practice - [2부] 실무 예제
토스트 드라이브 프로젝트에서 실제 구현해야 했던 명세 중 Generator 적용 효율이 제일 높았던 명세를 조금 수정했다. 파일 또는 폴더를 선택한 후 다른 폴더로 이동할 때의 명세다. 다음은 웹 기반 파일 시스템 구현 프로젝트의 일부 기능이다. 파일 목록에서 선택한 다수의 파일 및 폴더를 다른 폴더로 이동할 수 있다. 이때, 이동 대상 폴더에 이름이 같은 파일 및 폴더가 이미 존재할 경우 모든 건에 대해서 사용자에게 확인한다.
#ecmascript
#es6
2016.08.05 - 8 min read
Generator in Practice - [1부] 기본 속성과 Runner
근래에 자바스크립트 프로그래밍의 패러다임에 큰 변화를 준 명세는 바로 Generator 명세다. 올해 2월 미국 샌프란시스코에서 열렸던 FORWARDJS4 콘퍼런스에서 유명 패널들이 무대에서 ES6와 ES7에 대한 이야기를 주고받는 시간이 있었다. (https://javascriptair.com/episodes/2016-02-10/) 이야기 중간에 패널들이 자신이 가장 좋아하는 명세가 무엇인지 이야기 했는데 이때 자바스크립트 강사로 유명한 Kyle Simpson은 Generator를 가장 좋아하는 명세로 선택했다. 비동기 프로그래밍의 패러다임을 바꾸었다는 이유였다. 다른 패널에 비해 강한 확신과 함께 길게 설명했는데 그때는 그저 ‘그 정도인가?’ 하고 말았다.
#ecmascript
#es6
2016.07.29 - 7 min read
지금 바로 시작하는 ES6
매일 쏟아져 나오는 ES6에 대한 글을 보면 그저 한낱 먼 미래의 이야기라는 생각이 든다. 서비스를 ES6 로 개발하기에 버전 별 브라우저 사용률이 발목을 잡고 있기 때문이다. b2c는 그나마 좀 낫다. b2b는 여러 제약 때문에 windows xp를 사용하는 고객도 있고 (우리의 xp는 IE8 까지만 사용 가능하다) 심지어 최신 브라우저를 쓰면서도 '호환성 보기 모드' (IE8 시뮬레이션 모드)를 설정해놓고 사용하는 경우도 있다.
#ecmascript
#es6
2016.05.06 - 12 min read
ES6 Symbols - Drumroll Please!
심볼(Symbols)은 ES6에서 소개된 새롭고 유일한 원시(primitive) 타입이다. 이들은 자바스크립트 이전 버전에서 작성된 코드와 역방향 호환성을 유지하면서, 객체의 기능을 확장하는 문제를 해결하기 위해 언어에 추가됐다. 그들은 부가적으로 개발자들이 새롭고 흥미로운 방법으로 언어 동작에 영향을 미칠 수 있는 기능을 제공한다. 이 아티클에서는 심볼의 개념 소개와 목적에 대한 설명, 그리고 현재 심볼을 사용할 수 있는 가장 일반적인 방법을 연결 지어 보여주겠다.
#es6
2016.05.02 - 6 min read
ES6의 제너레이터를 사용한 비동기 프로그래밍
자바스크립트가 다른 언어들과 구분되는 큰 특징 중의 하나는 바로 싱글스레드를 기반으로 하는 비동기 방식의 언어라는 점이다. 이런 특징에 힘입어 Non-blocking IO을 사용하는 Node.js의 언어로 사용되면서 최근에는 서버사이드에서도 큰 인기를 얻고 있다. 하지만 이런 구조적 특징에서 오는 단점도 적지 않은데, 대표적인 것이 바로 연속적 전달 방식(CPS)으로 인한 콜백 지옥이다 (굳이 설명 안 해도 알 거라 믿는다. 밑에서 지옥을 한번 소환할 예정이니 혹시 몰라도 일단 넘어가자).
#ecmascript
#es6
2016.04.08 - 17 min read
Javascript의 Iterator와 Generator
ECMAScript 2015(a.k.a. ES6)에서 새롭고 많은 기능들이 추가되었다. 대부분은 이해하기 쉽지만, Iterator와 Generator를 이해하기 위해선 조금 더 노력이 필요하다. 이 글은 여러분이 Iterator와 Generator를 활용할 수 있도록 가이드(base line)를 제공한다.
#es6
2015.10.21 - 5 min read
Javascript Promise Basic
Prmoise/A+ 사양에 기반을 둔 ECMAScript6 비동기 프로그래밍을 위한 또 다른 패턴 - Promise 전통적인 콜백 패턴이 가진 단점을 일부 보완하며 비동기 처리 시점을 명확하게 표현하도록 한다.
#ecmascript
#es6
2015.09.04 - 10 min read
Map / Reduce에서부터 자바스크립트 함수형 개발까지
ECMASript 5.1버전 이후로 Array.prototype.map과 Array.prototype.reduce는 주요 브라우저에서 도입하게 되었다. 이 두 함수는 개발자가 계산을 더 명확하게 설명하게 하는 것 뿐만 아니라 배열 탐색을 위한 반복문 작성을 단순화 시키는 역할을 한다.
#es6
2015.08.17 - 7 min read
1
2
3
4
Applications
Chart
Editor
Grid
Calendar
Image-editor
Components
App Loader
Auto Complete
Color Picker
Context Menu
Date Picker
Pagination
Rolling
Select Box
Time Picker
Tree
Tools
TOAST UI Doc
ESLint Config
Release Note
FE Guide
Posts
© NHN Cloud Corp.