Разработка на ES6 для браузеров

Website developmentJavaScriptBrowsers
Доброго времени суток.



Поддержка нового стандарта EcmaScript 6 в браузерах все ближе и ближе, и тем кому не терпится начать разрабатывать с использованием новых возможностей ES6 предлагаю взглянуть на шаблонный проект для этой цели.

Представляю вашему вниманию github.com/DavidKlassen/es6-browser-boilerplate.

В основу шаблона лег github.com/babel/babel-library-boilerplate, но gulpfile.js был основательно почищен и упрощен. Многие зависимости я убрал и оставил возможности, которые необходимы для разработки приложений для браузеров.

Основные цели, которые я преследовал:


  • Шаблон должен быть хорошей стартовой точкой для разработки SPA и third party SDK.
  • Минималистичность и расширяемость.
  • Весь код, то есть и само приложение и тесты можно писать на ES6.


Рабочее окружение


Требования к рабочему окружению достаточно стандартные и скорее всего, если вы разрабатываете на JavaScript у вас уже все установлено. Вам потребуется NodeJS либо io.js, NPM, Gulp, Bower и Java 7+ (java нужна, т. к. для минификации используется Google Closure Compiler) см. UPD2.

Возможности шаблона


  • Для поддержки синтаксиса ES6 используется компилятор Babel.
  • Проверка качества кода обеспечивается двумя утилитами, ESLint и JSCS.
  • За сборку проекта отвечает browserify и babelify.
  • Минификацию кода делает Google Closure Compiler UglifyJS2.
  • Unit тесты используют mocha, chai и sinon.
  • Отчет о покрытии кода тестами генерируется с помощью istanbul и isparta.
  • Integration тесты запускаются в karma.
  • В качестве таск раннера используется Gulp.


Как использовать



Скачать и подготовить проект к работе очень просто:
$ git clone git@github.com:DavidKlassen/es6-browser-boilerplate.git
$ cd es6-browser-boilerplate
$ npm run setup

После этого можно удалить .git и начинать кодить.

Список доступных задач gulp:
  • gulp lint — запускает проверку качества кода с помощью ESLint и JSCS.
  • gulp test:unit — запускает unit тесты.
  • gulp coverage — запускае unit тесты и генерирует отчет о покрытии кода тестами.
  • gulp test:integration — запускает интеграционные тесты в браузере с помощью karma.
  • gulp test — запускает все тесты.
  • gulp browserify — собирает скрипт готовый для использования в браузере.
  • gulp compile — собирает минифицированную версию скрипта.
  • gulp build — собирает обе версии скрипта.
  • gulp — дефолтная задача, запускает проверку кода, тесты и сборку проекта.


Вещи которые хотелось бы улучшить


Помимо всяческих мелочей типа подключения test-frameworks глобально для всех файлов с тестами и мелких улучшений в gulpfile, хотелось бы подключить возможность использования Google Closure Compiler в режиме ADVANCED_OPTIMIZATIONS и статический анализ типов на основе аннотаций gcc.

Ну и конечно же я жду отзывов, пожеланий и пулреквестов. Спасибо за внимание! :)

UPD: В коментариях возник спор о распространенности Java на машинах разработчиков, так что добавляю голосовалку. Если не уверены есть ли java на вашей машине или нет, запускаем: java -version
UPD2: По просьбам трудящихся заменил google closure compliler на uglifyjs.
Only registered users can participate in poll. Log in, please.
Установлена ли у вас Java
70.85% Да 350
29.15% Нет 144
494 users voted. 75 users abstained.
Tags:javascriptes6es5harmonyweb-разработкабраузеры
Hubs: Website development JavaScript Browsers
+16
22.7k 153
Comments 41
Javascript разработчик
from 130,000 to 180,000 ₽ArtezioНижний Новгород
WEB разработчик (JavaScript)
from 90,000 to 150,000 ₽GehtsoftОмскRemote job
JavaScript Developer
from 120,000 to 180,000 ₽JuicyScoreМоскваRemote job
Javascript разработчик
from 160,000 to 220,000 ₽ArtezioМосква
JavaScript разработчик
from 150,000 to 200,000 ₽SportrecsМоскваRemote job