Dev/etc

Frontend Framework

NillK 2016. 1. 12. 19:34

webpack

  • module bundler
    • webpack 은 모듈 + dependencies를 가지고 static assets을 생성
  • application code를 가지고 정적 자원들과 개발 서버 생성해줌
  • 사용하지 않는 코드들 처리, hot module replacement 지원 (다른 빌드 툴에 비한 이점)
  • webpack의 진짜 강점은 loader들(loader들을 이요해 babel을 통해 JSX -> Javascript 변환 가능)
    • babel-loader는 ES2015와 JSX변환을 모두 지원
  • AMD, CommonJS등의 모듈 포맷 지원 (loader를 이용해) ES6도 지원
  • support package manager: Bower, npm
  • Loaders for non-code: CSS, templates...
  • On-demand loading
  • Built-in development server

babel

  • transform compiler
    • ES6에 대한 지원 여부 차이가 크므로 ES6로 작성하면 ES5로 트랜스파일해야 실제로 사용 가능
    • ECMAScript 6문법으로 작성된 파일을 변환-컴파일
    • 원래 6to5라는 이름으로 ES6 -> ES5 도구로 시작했는데, 인기가 좋아서 ES7이나 다른 트랜스파일도 지원하는 포괄적인 도구가 되기 위해 Babel로 이름 변경

gulp

  • node.js기반의 task runner
  • streaming build system
  • project를 development, production, testing등의 다른 빌드들로 빌드해줌
    • 예를 들어 production(운영)으로 build하면 뭐 JavaScript를 minify하고, Sass파일을 컴파일하고, 코드에 오류가 없는지 체크하고 싶겠지. 이걸 그냥 gulp task를 작성해서 하자!

mocha

  • simple, flexible, fun javascript test framework for node.js & the browser
  • support TDD, BDD
  • 엄밀히 말하면 Test framework라기보다는 Test framework를 담는 interface같은 형태를 띄고 있고 runner를 포함하고 있음
    • 이유는? Assertion을 포함하고 있지 않음. 대신 어떤 Assertion library라도 가져다가 사용할 수 있음

chai

  • DBB/TDD assertion library for node and the browser




'Dev > etc' 카테고리의 다른 글

React Diff Algorithm  (0) 2016.04.21
Zookeeper & Kafka cmd에서 실행 시  (0) 2016.04.21
Frontend Framework  (0) 2016.01.12
[Git Bash] 자주 쓰는 명령어  (0) 2016.01.12
IOS 개발시 참조하면 좋은 곳  (0) 2015.09.15
[Mac] Homebrew 이용해 scala 설치  (0) 2015.07.27