[JSer.info#번역] 2014-10-27 자바스크립트 주요 소식

WebStorm 9 릴리즈

WebStorm 9가 릴리즈 됐습니다. Meteor, React, Polymer, gulp 등을 새롭게 지원합니다. 또, 파일의 종류에 따라 탭/스페이스의 사이즈를 지정할 수 있게 됐으며 EditorConfig나 ESLint, JSCS 등도 지원합니다.

• Meteor, React/JSX, Polymer 지원
• ESLint, JSCS, EditorConfig 지원
• PhoneGap, Gulp 통합
• spy-js 및 LiveEdit, Node.js 애플리케이션 대응

그 외에도 여러가지 기능이 추가됐습니다. 자세한 내용은 아래 문서를 참고해주세요.

• WebStorm 9 released: Meteor support, React and JSX, Gulp integration, and more
• What’s new in WebStorm 9

ESLint 0.9.0 릴리즈

플러그인 메커니즘을 기반으로하여 규칙을 확장할 수 있는 ESLint 0.9.0이 릴리즈 됐습니다. 플러그인의 사양을 안정화(stable) 했으며 Governance Model나 Contributors를 위한 Contributing 문서가 정리돼 있습니다. 이 문서에는 CLA에 대한 사인, 커밋메시지의 서식 등 Pull Request 시 지켜야 할 규칙이 작성돼 있습니다.
 

ng-europe

아직 AngularJS 2.0이 공개되진 않았습니다만, ng-europe에서 AngularJS 2.0에 대한 여러가지 발표가 있었습니다.

• AngularJS 컨퍼런스(ng-europe 2014)의 슬라이드 모음(일본어)
• ng-europe 유투브 목록

2014년 3월에 2.0의 구상에 대해 작성한 AngularJS : AngularJS 2.0에도 작성돼 있지만, AngularJS 2.0에서는 ES6에 Annotations을 더하여 만든 AtScript(구 ES6 +A)를 사용한다고 Keynode: AtScript에서 말하고 있습니다. 이 AtScript(ES6 + Annotaions)는 traceur-compiler 입문(일본어)에 작성돼 있는 것 처럼 Traceur에 의해 transpiler 하도록 되어 있습니다. 아직 소스가 공개되지 않았기 때문에 좀 더 깊게 연구할 순 없지만, 다행스럽게 ES6+캐주얼 톡(일본어)에서 이와 관련된 내용을 발표한적 있으므로 참고하면 되겠습니다.

• http://azu.github.io/slide/es6talks/(일본어)
• slide/es7.md at gh-pages(일본어)

릴리즈 소식

• Release Custom Driver Support · mozilla/localForage : localForage 1.1.1이 릴리즈됐습니다. defineDriver() 메서드가 추가 되어, 임의의 Cutom Driver를 작성하여 사용할 수 있게 됐습니다. 임의의 스토리지를 백엔드로 구현 가능합니다.
• mocha/History.md at 2.0.0 · mochajs/mocha : mocha 2.0.0이 릴리즈 됐습니다. 저장소 계정이 mochajs로 변경됐습니다. Node.js 0.4와 0.6의 지원을 종료했습니다.
• Node v0.10.33 (Stable) : Node v0.10.33 Stable이 릴리즈 됐습니다. POODLE 취약점에 대한 대책이 마련됐습니다.
• CodeMirror release 4.7.0 – Google그룹스 : CodeMirror 4.7.0이 릴리즈 됐습니다. CoffeeScript, Scala, PHP 등의 모드를 개선했으며 Textile를 지원하고, 로고의 디자인이 변경됐습니다.

블로그 & 아티클

• TypeScript and the Road to 2.0 : TypeScript 2.0 로드맵 입니다. 1.4에서 union types의 지원하고, 1.5 부터 ES6와의 호환성 향상을 목표로 합니다. 또 AtScript(Facebook의 Flow, AngularJS 2.0에서 사용)의 팀과 함께 Type Annotaions를 ECMAScript에 제안할 방침입니다.
• Community Round-up #23 | React : Flux 아키텍처의 샘플과 해설 그리고 라이브러리 등을 이야기합니다.
• 사진 서비스의 기능을 브라우저 내에서 구현(일본어[구글번역]) : iOS 6 ~ Android 4.x에서 사진을 다룰때 발생하는 문제와 대처 방법에 대해서 이야기합니다. iOS 6의 파일 사이즈 문제, Android의 toDataURL이 JPEG를 지원 하지 않는 문제, 필터링 처리나 리사이즈에 대한 문제 등을 깊게 다루고 있습니다.
• 모바일 웹 프런트엔드 최적화(일본어[구글번역]) : 모바일 용 일부 페이지를 싱글 페이지 애플리케이션으로 만들기에 적합한 조건이나 장점에 대해서 작성돼 있습니다. 클라이언트 사이트에서 사진을 리사이즈 하거나 업로드 하는 것, 그리고 Touch 이벤트 대응에 대해서 이야기합니다.
• ECMAScript 6 returns JavaScript to original intent : ES6/7에 대해 Jafar Husain(TC39 committee, Async Generator)의 인터뷰 기사입니다. 왜 ES6/7을 동시에 진행하고 있는지, Async function과 Async Generator에 대한 질문, 대규모 애플리케이션에서 형(타입)이 필요한 이유에 대해서 이야기합니다.
• AurelioDeRosa/HTML5-API-demos : Battery Status API, Device Orientation API 등 폭넓게 HTML5 API에 대한 사양과 샘플 그리고 기사를 정리한 저장소입니다.

슬라이드 & 동영상

• AtScript Primer : AngularJS 2.0에서 사용하는 ES6에서 형(타입) 정의를 확장한 AtScript에 대한 슬라이드입니다. assert.js를 사용해 ES6 유효성 검사를 하며, Traceur를 사용해 변환 가능합니다. 또 DI를 이용할 수 있는 Metadata Annotations가 있습니다. AtScript도 ECMAScript 표준을 제안할 방침이라고 합니다.
• ES6 & Traceur : ES6의 기능에 대한 슬라이드입니다. 기능 별로 어떤 상황에서 사용해야하는지도 작성돼 있습니다. 또 Traceur가 어떻게 동작하는지와 AtScript의 확장에 대해서도 이야기합니다.
• In the DOM, no one will hear you scream : DOM Based XSS와 jQuery의 XSS에 대한 슬라이드입니다. DOM Level 문자열에서 코드로서 실행 하는 메소드 표, DOM Clobbering에 의한 파괴, DOMPurify의 방어에 대해서 이야기합니다.
  • cure53/DOMPurify
  • cure53/jPurify
• christianalfoni WebApp Enthusiast : Backone.js/AngularJS/Flux+React을 각각 구현의 차이를 보면서, Flux 아키텍처의 특징에 대해서 소개합니다. Ractive.js와 vue.js 그리고 Flux 아키텍처를 사용해 유사한 샘플을 만듭니다.
  • azu/Flux-Checkbox-Example

도구

• JS Compatibility Checker : 호환성이 있는 코드인지 체크하는 도구입니다. ECMAScript5 API, caniuse의 데이터를 사용합니다.
• Content Security Policy Playground : CSP에 대해서 임의의 설정을 하여 실제로 시험해 볼 수 있는 사이트입니다. CSP Policy의 유효성 검증과 관련 리소스에 대해서도 정리하고 있습니다.

라이브러리

• wooorm/mdast : 자바스크립트의 Markdown 파서 라이브러리입니다. 파서한 결과를 JSON 적인 AST로 출력합니다. gfm, pandoc 식의 해석도 대응하고 있으며 Parser API 같은 문서도 있습니다.
• Khan/structuredjs : 템플릿과 비슷한 구조를 작성해 놓고, 입력한 코드가 미리 작성한 형식과 일치하는지를 점검할 수 있는 라이브러리입니다. 불일치 경우의 에러 정보 등도 정의할 수 있고, 학습 사이트 개발시 사용할 수 있을것 같습니다.
• dameleon/paw.js : TouchEvent, PointerEvent를 핸들링하고 심플하게 다룰 수 있도록 하는 커스텀 이벤트를 제공하는 라이브러리입니다. tap, press 이벤트 등을 제공합니다.
• hughsk/district : 지정한 디렉토리를 node_modules 이하로 Alias를 붙이는 도구입니다. 모듈을 특정 디렉터리에 네임스페이스 적으로 정리할 수 있습니다.

 
JSer.info를 번역하여 공유드리고 있습니다.
JSer.info는 JavaScript Weekly, Badass JavaScript, JsMag, A Minute With Brendan, The Changelog를 참고,  자바스크립트의 주요 소식을 공유하는 사이트입니다.
감사합니다.