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

Posted by in Research

6to5 공식 홈페이지 리뉴얼

ES6의 코드를 ES5로 변환하는 도구인 6to5의 공식 홈페이지가 리뉴얼됐습니다. 또한, ES6의 코드를 변환하는 도구인 esnext의 팀이 6to5에 합류할 것으로 보입니다. 때마침 ES6로 작성한 라이브러리를 6to5를 사용해 공개하는 과정에 관한 “라이브러리를 ES6로 작성해 공개하는 것부터 시작하자(일본어)”라는 아티클도 작성했으므로 참고하여 6to5를 사용해 보면 좋을 것 같습니다.

JavaScript in 2015 – Glen Maddern: Internet Pro

JavaScript in 2015 – Glen Maddern: Internet Pro라는 기사에는 jspm 패키지 관리 도구에 관해 소개하고있습니다. jspm은 npm이나 Github에서 라이브러리를 설치하는 커맨드라인 도구와 SystemJS를 사용한 모듈 로더로 구성돼 있습니다.

위 동영상에는 jspm을 이용해 reddit에서 gif를 추출해 출력하는 과정을 적절한 속도로 시연하고 있습니다. 개발 중일때는 RquireJS 처럼 동적으로 ES6 modules이나 CommonJS, AMD 등을 읽어 들이고 마지막엔 Production Workflows에서 소개하고 있듯이 하나의 파일로 번들하는 과정을 소개하고 있습니다.

덧붙여, 현재 모듈을 위한 많은 도구는 HTTP/1의 전송 방식을 고려하여 하나의 파일로 결합하지만 HTTP/2에서는 모듈적인 데이터 통신의 효율이 좋아지기 때문에 모듈을 결합하지 않고 그대로 전송했을 때 어떻게 처리 되는지 jspm의 제작자인 @guybedford가 이야기하기도 했습니다.

The Refactoring Tales

The Refactoring Tales라는 전자 서적에는 자바스크립트의 리팩토링에 관해 작성돼 있습니다. 아직 미완성인 서적이지만테스트가 어려운 jQuery로 작성된 기존 코드를 어떻게 수정해 나갈 수 있는지 설명합니다. 이 서적에 관한 간단한 개요를 “The Refactoring Tales – JavaScript 리팩토링 책을 읽다(일본어)”에서 소개하고있습니다.

릴리즈 소식

읽을거리

  • A Technical Comparison of the Shift and SpiderMonkey AST Formats : Shify AST와 SpiderMonkey AST의 차이점에 관해 정리돼 있습니다. 개선점 및 확장된 점, 아직 논의 중인 점에 대해서 이야기합니다.
  • A Good Front-End Architecture : 프론트엔드(HTML, JavaScript, CSS, Resource)의 디렉터리 구조에 관해 정리돼 있습니다.
  • Modularizing Underscore.js : 소규모 모듈을 여러가지 조합하여 공개할 경우 마주하는 문제에 대해 이야기합니다. Amp.js라는 작은 모듈을 조합해 Underscore 같은 것을 만들며, 각각의 모듈이 어떤 구조로 돼 있는지 설명합니다.
  • What’s New in QUnit 1.16 : QUnit 1.16에 관해 정리돼 있습니다. 2.0을 위한 변경, 새로운 비동기 테스트 방법 추가, Promise 지원, QUnit.skip() 등에 대해 이야기합니다.
  • Cross-tab Communication : localStorage를 사용한 탭 간 데이터 교환 방법에 대해 정리돼 있습니다. 또한 그 작업을 더 간단히 해결할 수 있도록하는 local-storage 라이브러리에 대해서도 이야기합니다.
  • Essential JavaScript Links : 자바스크립트에 관한 리소스 링크를 모아 제공하고 있습니다.
  • Internet Explorer 버전 별 HTML/CSS/JS 대응 기능 목록(일본어) : Internet Explorer 버전 별 HTML/CSS/JS 대응 기능을 정리하여 제공하고 있습니다.

라이브러리

  •  azu/espower-6to5 : power-assert + 6to5, ES6 환경에서 power-assert로 테스트를 작성할 때 사용할 수 있는 라이브러리입니다.(사용 예)
  • conceptsandtraining/modernie_selenium : modern.ie를 사용한 Selenium 설정 도구입니다. 자동으로 필요한 것을 설치하고 Windows의 불필요한 설정을 비활성화 해줍니다.
  • es-shims/es7-shim : ES7의 polyfill 라이브러리입니다.
  • bevacqua/local-storage : localStorage의 API를 단순화한 라이브러리입니다. 탭 간 데이터 공유에 사용할 수 있는 감시 기능도 있습니다.
  • Zhouzi/TheaterJS : 타자기로 타이핑하는 듯한 문자 출력 효과를 구현할 수 있는 라이브러리입니다.
  • mirek/node-unused-deps : 사용하지 않는 Node.js 모듈이 있는지 검사할 수 있는 커멘드 라인 도구입니다.
  • tejasmanohar/npm-algos : 컴퓨터 과학, 알고리즘을 구현한 라이브러리가 정리돼 이습니다.
  • Headless Browser Testing With Xvfb : 헤드리스 브라우저에서 동작하는 Xvfb가 필요한 앱을 xvfb-run firefox라는 방식으로 Firefox, Chrome 등 일반 브라우저에서도 실행할 수 있도록 하는 커멘드 라인 도구입니다.
  • Amp.js : Underscore.js와 비슷한 유틸리티 함수의 컬렉션 라이브러리입니다. 각각의 기능을 개별의 npm 모듈로써 설치 가능합니다.

도서

  • Node.js Design Patterns : Node.js의 디자인 패턴에 관한 도서입니다.
  • The Refactoring Tales : 웹에서 공개되고 있는 자바스크립트 리팩터링에 관한 도서입니다. 아직 집필 중입니다. 1, 2장은 jQuery 작성 방식의 리팩토링, 3장은 불필요한 복잡성을 분리하는 방법, 4장은 디자인 패턴, 5장은 Fat Controller에 관해 작성하고 있습니다.

JSer.info를 번역하여 공유드리고 있습니다.

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

감사합니다.