JSer.info #252 - フロントエンドに秩序を取り戻す方法 // Speaker Deckというスライドでは、はてなブログの編集画面をどのようにリファクタリングしていっているかという話が書かれています。
名前空間風のオブジェクトで管理されていたものを、CommonJSのモジュール管理に変えていくリファクタリングの流れ、Viewのライブラリ導入の議論、Lintやテストの方針などについて書かれています。
JavaScriptにモジュール的な概念が根付いたのはここ数年なので、このように一つの巨大な名前空間オブジェクトで管理されているものを移行していくケーススタディとして見てみると面白いかもしれません。
Developer Edition 44: New visual editing and memory management tools ★ Mozilla Hacks – the Web developer blog(翻訳)という記事ではFirefox 44での開発者ツールの機能について紹介されています。
アニメーションツール、 CSSフィルタツール、カラーインスペクタツールなどのビジュアル的なツールの追加がされており、これらの機能についてはDevTools Challengerというサイトで実際に使い方を試しながら学ぶ事ができます。
また、メモリのスナップショットやWebSocketのframeを確認するデバッグ機能などが追加されています。
ヘッドライン
Release v3.4.0 · npm/npm
github.com/npm/npm/releases/tag/v3.4.0
npm 3.4.0でnpm install && npm testを行うnpm install-testというコマンドが追加された。
--dry-runなどと組み合わせて、依存モジュールのアップデートテストに活用出来る
PEP 0.4.0 | Official jQuery Blog
blog.jquery.com/2015/11/05/pep-0-4-0/
Pointer Events Polyfill 0.4.0リリース
Release ES2016 Draft 2015-11-03 · tc39/ecma262
github.com/tc39/ecma262/releases/tag/es2016-draft-20151103
ES2016 Draft 2015-11-03リリース。
abstract operationであるReturnIfAbruptのシンタックスシュガーである?の導入。
仕様書のバグ修正や実在する実装に合わせて__proto__がstrict modeでも許可されるようになるなど
ESLint v1.9.0 released - ESLint - Pluggable JavaScript linter
eslint.org/blog/2015/11/eslint-v1.9.0-released/
ESLint v1.9.0リリース。
npm 3の対応改善など
アーティクル
7 Things You Should Know About WebAssembly
auth0.com/blog/2015/10/14/7-things-you-should-know-about-web-assembly/
WebAssemblyについてよくある疑問に対する分かりやすい解説
Javascript quiz. ES6 edition. — Perfection Kills
perfectionkills.com/javascript-quiz-es6/
ES6についてのJavaScriptクイズ
スライド、動画関係
フロントエンドに秩序を取り戻す方法 // Speaker Deck
speakerdeck.com/fand/hurontoendonizhi-xu-woqu-rili-sufang-fa
昔ながらの名前空間風で管理されconcatして扱うJavaScriptをどうやってモジュール管理出来るようにリファクタリングしていくかという話。
また、Reactなどのライブラリ導入における議論やリファクタリングとE2E/ユニットテストについて
Developer Edition 44: New visual editing and memory management tools ★ Mozilla Hacks – the Web developer blog
hacks.mozilla.org/2015/11/developer-edition-44-creative-tools-and-more/
Firefox 44での開発者ツールについて。
アニメーションパネル、 pixel rulers、メモリ消費量のスナップショット、WebSocketのデバッグ機能の追加など
What's new in Chrome DevTools? // Speaker Deck
speakerdeck.com/addyosmani/whats-new-in-chrome-devtools
Chrome開発者ツールの新しい機能についてのスライド
Javascript Unit Testing - Early Release - O'Reilly Media
shop.oreilly.com/product/0636920042594.do
ユニットテストについてのスクリーンキャスト
サイト、サービス、ドキュメント
npmcdn
npmにあるものをブラウザで読み込めるように配信するCDN的なサービス
DevTools Challenger
Firefoxの開発者ツールの使い方についてを学べるサイト。
アニメーション制御やカラーピッカーなどのFirefox 44で新しく追加された機能について扱ってる。
ソフトウェア、ツール、ライブラリ関係
lepture/vui · GitHub
Vue.jsベースのUIフレームワーク
neal-react - Declarative landing pages for react.js
Reactを使ったランディングページでよく使われるUIをまとめたComponent集
Scooter - Welcome to Scooter
DropboxのSassフレームワーク
書籍関係
Amazon: 確かな力が身につくJavaScript「超」入門 (Informatics & IDEA): 狩野 祐東
www.amazon.co.jp/dp/4797383585
プログラミング初心者向けのJavaScriptについての書籍
Selenium - O'Reilly Media
shop.oreilly.com/product/0636920042853.do
2016年1月発売
Seleniumについての書籍
