JSer.info #251 - Vue.js 1.0.0가 릴리즈됐습니다.
0.12.16 부터 1.0.0 까지의 변경 사항은 릴리즈 노트에 자세히 작성 돼 있습니다. 간단히 설명 드리자면 템플릿과 관련된 문법이나 기능이 개선됐으며 비추천하는 API를 삭제하는 등 인터페이스 정리도 이뤄지고 있습니다.
동시에 Vue.js를 다시 소개하는 형식으로 해당 라이브러리의 개발자가 관련 글을 작성했으니 함께 보면 좋을것 같습니다.
JavaScript 변환 도구인 Babel 6가 릴리즈됐습니다.
NOTE: Not all integrations have been updated yet. This is a very disruptive major so please bear with us as we smooth out the edges.
위 노트 글을 보면 알 수 있듯이 대대적으로 변경됐습니다. 몇 가지 변경 사항을 간단히 소개하겠습니다.
babel이 아니라babel-cli또는babel-core를 사용하도록 변경- 기본적(별 다른 설정 없이)으로 아무것도 변환하지 않도록 변경
.babelrc나--presets등으로 변환 방법을 필수로 설정해야 함- ES6의 코드를 변경 하고싶은 경우엔 babel-preset-es2015를, React 라면babel-preset-react를, CommonJS의 모듈을 다루는 경우엔 babel-plugin-transform-es2015-modules-commonjs를 플러그인을 각각 설정해 줘야 함
- 설정이나 의존하는 패키지를 체크하는 Babel Doctor라는 도구도 공개
조금 더 자세한 내용을 알고 싶다면 아래 문서를 참고하세요.
- Setting up Babel 6 · Babel
- Update babel-core to version 6.0.2 🚀 by greenkeeperio-bot · Pull Request #30 · jbhannah/jbhannah.net
- Quick guide: how to update Babel 5.x -> 6.x — Medium
지금까지의 Babel은 기본적으로 몇가지 변환 도구(ES2015, CommonJS, React 등)를 포함하고 있었지만 Babel6 부터는 각각의 변환 도구를 개별 모듈로 나눠 운용합니다.
이 모듈화에 의해 불필요한 변환 하지 않도록 하고, 필요한 변환만 실행하도록 하는 설정이 가능해 졌습니다.
지금까지는 whitelist나 blacklist 등의 설정이 있었지만, 이번 버전 부터는 삭제됐습니다.
또 Babel6에서는 플러그인을 이용해 변환하도록 구조가 변경됐으며 커뮤니티에 의해 개발되고 있는 플러그인은 대부분 이 구조 변경을 반영하고 있지 않은 실정입니다.
Babel의 공식 문서도 아직 갱신되지 않았고, 회귀적(regression) 버그도 아직 있으므로 좀 더 안정화 됐을 때 Babel 6.x로 전환해도 괜찮지 않을까 생각합니다.
Node.js v5.0.0이 릴리즈 됐습니다.
fs.readFile이 file descriptor를 지원하도록 변경 됐고, npm 3.x 버전을 기본 npm 버전으로 변경 하는 등의 다양한 변경이 이뤄져 있습니다.
Node.js v4.2.1부터 시작된 LTS에 관해서는 What You Should Know about Node.js v5 and More | Node.js에서 소개하고 있으니 참고바랍니다.
헤드라인
Vue.js 1.0.0 Released - vue.js
vuejs.org/2015/10/26/1.0.0-release/
Vue.js 1.0.0이 릴리즈 됐습니다.
템플릿 관련 기능이 개선됐고 비추천하는 API가 삭제됐습니다. 그리고 초기 렌더링 속도도 보다 빠르게 개선됐습니다.
6.0.0 Released · Babel
babeljs.io/blog/2015/10/29/6.0.0
Babel 6.0.0이 릴리즈됐습니다.
아직 관련 플러그인이 변경한 구조를 반영하고 있지 않으므로 사용에 주의하시길 바랍니다.
Babel의 내부에서 사용하고 있던 모듈을 각각 패키지로써 이용할 수 있도록 변경 됐습니다.
플러그인이 옵트-인 됐고, 동시에 플러그인 프리셋이 준비돼 있습니다.
또 변환 속도 개선이나 플러그인 API 변경이 이루어지고 있습니다.
Node v5.0.0 (Stable) | Node.js
nodejs.org/en/blog/release/v5.0.0/
Node.js 5.0.0이 릴리즈됐습니다.
fs.readFile이 file descriptor를 지원하도록 변경 됐고, npm 3.x 버전을 기본 npm 버전으로 변경됐습니다. 또, util.inherits를 ES6 Classes에서도 사용할 수 있도록 변경 됐습니다.
New in bluebird 3.0 | bluebird
bluebirdjs.com/docs/new-in-bluebird-3.html
Promise 라이브러리인 bluebird 3.0이 릴리즈 됐습니다.
Cancellation API의 디자인이 변경 됐고, Promisification의 동작 방식이 변경됐습니다. Promise.config에서 경고에 관한 설정을 할 수 있도록 변경 되는 등 다양한 변경이 이뤄져 있습니다.
Dev.Opera — Opera 33 released
Opera 33이 릴리즈 됐습니다.
<link rel=preconnect>, ES6 new.target, spread operator, DOMException, CSS.escape, HTTP Client Hints 등을 지원합니다.
Release 1.20.0 · jquery/qunit
github.com/jquery/qunit/releases/tag/1.20.0
QUnit 1.20.0이 릴리즈 됐습니다.
assert.raises()가 추가 됐고, Symbol의 비교를 지원합니다. QUnit.module의 중첩을 대응하는 등 다양한 변경이 이뤄져 있습니다.
node-browserify/changelog.markdown at master · substack/node-browserify
github.com/substack/node-browserify/blob/master/changelog.markdown#1200
Browserify 12.0.0이 릴리즈됐습니다.
Node.js 4.x이 지원 대상이 됐고 0.8은 지원 버전에서 제외됐습니다.
Source Map에서 일본어 등이 깨지지 않도록 수정됐고, 심볼릭 링크된 모듈과 관련된 문제가 해결 됐습니다.
ESLint v1.8.0 released - ESLint - Pluggable JavaScript linter
eslint.org/blog/2015/10/eslint-v1.8.0-released/
ESLint v1.8.0이 릴리즈 됐습니다.
--cache 인자를 사용해 캐쉬할 파일과 디렉터리를 지정할 수 있도록 변경 됐습니다.
아티클
Vue.js: a (re)introduction
blog.evanyou.me/2015/10/25/vuejs-re-introduction/
Vue.js 1.0.0를 릴리즈 하면서 Vue.js에 관해 다시금 소개하는 글입니다.
express 실천 입문(일본어)
gist.github.com/mitsuruog/fc48397a8e80f051a145
express 입문자를 위한 소개 글이 작성돼 있습니다.
기본적인 사용 방법, 미들웨어, 프로젝트 구조, 템플릿, 에러 핸들링, 로그의 취득 방법 등에 관해 이야기합니다.
Bitovi.com | DoneJS Release
blog.bitovi.com/donejs-release/
JavaScriptMVC의 후계자 격인 DoneJS가 릴리즈 됐습니다.
DoneJS의 특징은 아래 소개글을 참고해주세요.
Firebug & DevTools Integration ★ Mozilla Hacks – the Web developer blog
hacks.mozilla.org/2015/10/firebug-devtools-integration/
Firebug와 Firefox 개발자 도구에 관해 작성도 있습니다.
Firebug 3부터는 Firefox 개발자 도구 위에서 동작합니다.
HAR export와 Server 측에서 console API를 이용할 수 있도록 됐고, Chrome Logger의 프로토콜에 대응하는 등 다양한 변경 사항이 자세히 작성돼 있습니다.
React+Flux can do in just 137 lines what jQuery can do in 10 | A geek with a hat
swizec.com/blog/reactflux-can-do-in-just-137-lines-what-jquery-can-do-in-10/swizec/6740
메일을 보내는 기능을 만드는데 jQuery를 사용하면 10 줄, React + Flux를 사용하면 137 줄이 필요했다고 합니다.
줄 수만 따져 본다면 낭비로 보이지만,
Flux는 패턴이기 때문에 협업 개발자가 볼 때 이해가 쉽고, 새로운 기능을 추가하는 것도 쉽다고 이야기 하면서 두 구현의 차이점에 대해 설명합니다.
ES7: Async await
async/await에 관해 설명하는 스크린캐스트 입니다.
Promise로 Github API를 다루는 것을 작성하고, 그것을 async/await로 작성해 가는 과정을 소개합니다.
Easier Concurrent Programming in JavaScript with Async Functions
amasad.me/2015/10/31/javascript-async-functions-for-easier-concurrent-programming/
자동판매기와 비슷한 예제로 프로그래밍을 소개하면서 비동기 처리와 경쟁상태에 관해 설명합니다.
스테이트 머신 기반, Promise 큐, async/await를 사용했을 때를 각각 살펴보며 이야기합니다.
슬라이드, 영상
Vue.js 입문(일본어)
www.slideshare.net/nazone/vuejs-54412741
Vue.js에 관한 슬라이드입니다.
1.0에서의 변경 사항이나 사용 방법에 관해 작성돼 있습니다.
사이트, 서비스, 문서
React Cheat Sheet
React의 API를 간단하게 소개하는 사이트입니다.
소프트웨어, 도구, 라이브러리
codemix/fast.js
Array나 String 등의 네이티브 메서드와 비슷한 처리를하는 메서드를 조금 더 빠르게 구현한 라이브러리입니다.
100%의 호환성을 지키는 것이 아니라, edge case에 대한 처리는 빼는 방식으로 속도를 높이고 있습니다.
samccone/drool
ChromeDriver(via selenium)을 사용해 메모리-릭이 발생 했는지 자동 체크하는 도구입니다.
도서
Why Isomorphic JavaScript? - O'Reilly Media
www.oreilly.com/web-platform/free/why-isomorphic-javascript.csp
Isomorphic에 관해 작성된 가벼운 전자 서적입니다.
Learning JavaScript, 3rd Edition - O'Reilly Media
shop.oreilly.com/product/0636920035534.do
2016년 1월에 출판되는 Learning JavaScript 제 3 판입니다.
