2017-04-10のJavaScript

_i18n/ja/_posts/2017/2017-04-10-react-15.5.0-eslint-4.0.0a-glimmer.md

@@ -0,0 +1,317 @@
+---
+title: "2017-04-10のJS: React 15.5.0、ESLint 4.0.0α、Glimmer"
+author: "azu"
+layout: post
+date : 2017-04-10T12:54:13.922Z
+category: JSer
+tags:
+- React
+- ESLint
+- Ember
+- Glimmer
+
+---
+
+JSer.info #326 - React 15.5.0がリリースされました。
+
+- [React v15.5.0 - React Blog](https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html "React v15.5.0 - React Blog")
+
+minorリリースですが、16.0に向けて色々な機能に非推奨の警告が出るようになっています。
+
+- [React 15.5 and 16 Umbrella · Issue #8854 · facebook/react](https://github.com/facebook/react/issues/8854 "React 15.5 and 16 Umbrella · Issue #8854 · facebook/react")
+
+本体に同梱されていた`React.PropTypes`と`React.createClass`はそれぞれ[prop-types](https://github.com/reactjs/prop-types "prop-types")と[create-react-class](https://www.npmjs.com/package/create-react-class "create-react-class")のパッケージに分離されています。
+これらについては[react-codemod](https://github.com/reactjs/react-codemod "react-codemod")を使ったマイグレーションスクリプトが提供されています。
+
+- [React 15.5へのアップデート手順(prop-typesとReact.createClass) - Qiita](http://qiita.com/azu/items/9d1985bf0140576894aa "React 15.5へのアップデート手順(prop-typesとReact.createClass) - Qiita")
+
+また、React Addonsとして提供されていたパッケージのいくつかは、代替えの方法があるため公式でのサポートを終了するようです。
+
+----
+
+ESLint v4.0.0のα版がリリースされました。
+
+
+- [ESLint v4.0.0-alpha.0 released - ESLint - Pluggable JavaScript linter](http://eslint.org/blog/2017/04/eslint-v4.0.0-alpha.0-released)
+- [ESLint v4.0.0 の変更点まとめ - Qiita](http://qiita.com/mysticatea/items/3d01452d76ea6c943793)
+
+```
+npm install eslint@next --save-dev
+```
+
+でインストールすることができます。
+ビルトインの`eslint:recommended`のルールが変更、`indent`ルールの厳密化、`.eslintrc`のバリデーションを行うようになるなど色々な変更が予定されています。
+
+詳しい変更点(予定)は次のマイグレーションページにかかれています。
+
+- [Migrating to v4.0.0 - ESLint - Pluggable JavaScript linter](http://eslint.org/docs/4.0.0/user-guide/migrating-to-4.0.0 "Migrating to v4.0.0 - ESLint - Pluggable JavaScript linter")
+
+----
+
+EmberのView層でもあるレンダリング(テンプレート)エンジンの[Glimmer](https://glimmerjs.com/ "Glimmer")のサイトが公開されました。
+
+[Ember 2.10](https://emberjs.com/blog/2016/11/30/ember-2-10-released.html "Ember 2.10")でGlimmer 2が同梱されましたが、今回[Glimmer](https://glimmerjs.com/ "Glimmer")を単独のコンポーネントライブラリとして使う方法が提供されました。
+
+Glimmerについては、次の記事で詳しく解説されているので、あわせて読むと良さそうです。
+
+- [Ember.js - EmberConf 2017: State of the Union](https://emberjs.com/blog/2017/04/05/emberconf-2017-state-of-the-union.html)
+- [Why I’m excited about GlimmerJS – Hacker Noon](https://hackernoon.com/why-im-excited-about-glimmerjs-3631bd0c95c4)
+
+----
+
+<h1 class="site-genre">ヘッドライン</h1>
+
+----
+
+## Video.js 6.0 Release! | Video.js Blog
+[blog.videojs.com/Video-js-6-0-Release/](http://blog.videojs.com/Video-js-6-0-Release/ "Video.js 6.0 Release! | Video.js Blog")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">video</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Video.js 6.0リリース。
+Flashがコアから取り除かれた。
+middleware周りの変更、DOMメソッドを`videojs.dom`へ移動の予定など
+
+- [Video.js 6 Migration Guide · videojs/video.js Wiki](https://github.com/videojs/video.js/wiki/Video.js-6-Migration-Guide "Video.js 6 Migration Guide · videojs/video.js Wiki")
+
+----
+
+## release: [email protected] by zkat · Pull Request #16244 · npm/npm
+[github.com/npm/npm/pull/16244](https://github.com/npm/npm/pull/16244 "release: [email protected] by zkat · Pull Request #16244 · npm/npm")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">npm</span> <span class="jser-tag">issue</span> <span class="jser-tag">ReleaseNote</span></p>
+
+今後リリース予定のnpm 5.0.0βについて。
+相対パスを`npm install`がsymlinkを作るように(`file:`ではなく`link:`へ)、キャッシュシステムの改善、`--prefer-offline`と`--offline`の追加。
+`git://`でもsemverを指定できるように、`npm install`の結果がサマリで出るように
+
+
+----
+
+## Release 0.19.0 · avajs/ava
+[github.com/avajs/ava/releases/tag/v0.19.0](https://github.com/avajs/ava/releases/tag/v0.19.0 "Release 0.19.0 · avajs/ava")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">testing</span> <span class="jser-tag">ReleaseNote</span></p>
+
+AVA 0.19.0リリース。
+一つもassertionが実行されないテストはデフォルトで落ちるように、`t.throws()`での非同期対応の改善、非同期テストでハングしているものを検知するようになるなど
+
+
+----
+
+## Release v2.0.0-rc.0 · lerna/lerna
+[github.com/lerna/lerna/releases/tag/v2.0.0-rc.0](https://github.com/lerna/lerna/releases/tag/v2.0.0-rc.0 "Release v2.0.0-rc.0 · lerna/lerna")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">Tools</span> <span class="jser-tag">ReleaseNote</span></p>
+
+monorepo管理ツールのlerna 2.0.0RCリリース。
+`--conventional-commits`でconventional-commitsベースのCHANGELOGを作れるようになるなど
+
+- [v2.0.0 Milestone](https://github.com/lerna/lerna/milestone/1 "v2.0.0 Milestone")
+
+----
+
+## ESLint v4.0.0-alpha.0 released - ESLint - Pluggable JavaScript linter
+[eslint.org/blog/2017/04/eslint-v4.0.0-alpha.0-released](http://eslint.org/blog/2017/04/eslint-v4.0.0-alpha.0-released "ESLint v4.0.0-alpha.0 released - ESLint - Pluggable JavaScript linter")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">ESLint</span> <span class="jser-tag">ReleaseNote</span></p>
+
+ESLint 4.0.0 αリリース。
+`eslint:recommended`の更新、`indent`ルールの変更、ASTのコメント周りの扱いの変更、公開APIの変更など
+
+- [Migrating to v4.0.0 - ESLint - Pluggable JavaScript linter](http://eslint.org/docs/4.0.0/user-guide/migrating-to-4.0.0 "Migrating to v4.0.0 - ESLint - Pluggable JavaScript linter")
+- [ESLint v4.0.0 の変更点まとめ - Qiita](http://qiita.com/mysticatea/items/3d01452d76ea6c943793 "ESLint v4.0.0 の変更点まとめ - Qiita")
+
+----
+
+## Release v1.6.0 · karma-runner/karma
+[github.com/karma-runner/karma/releases/tag/v1.6.0](https://github.com/karma-runner/karma/releases/tag/v1.6.0 "Release v1.6.0 · karma-runner/karma")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">browser</span> <span class="jser-tag">testing</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Karma v1.6.0リリース。
+`browser_info`イベントの追加、`proxyRes`と`proxyReq`イベントをhookできるようになるなど
+
+
+----
+
+## React v15.5.0 - React Blog
+[facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html](https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html "React v15.5.0 - React Blog")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">ReleaseNote</span></p>
+
+React 15.5.0リリース。
+同梱されていた`React.PropTypes`と`React.createClass`が非推奨となり、それぞれ別パッケージに別れた。
+`react-codemod`を使うことでマイグレーションできる。
+
+- [React 15.5へのアップデート手順(prop-typesとReact.createClass) - Qiita](http://qiita.com/azu/items/9d1985bf0140576894aa "React 15.5へのアップデート手順(prop-typesとReact.createClass) - Qiita")
+- [All doc updates forv15.5 by flarnie · Pull Request #9359 · facebook/react](https://github.com/facebook/react/pull/9359 "All doc updates forv15.5 by flarnie · Pull Request #9359 · facebook/react")
+
+----
+
+## Release Notes for Safari Technology Preview 27 | WebKit
+[webkit.org/blog/7497/release-notes-for-safari-technology-preview-27/](https://webkit.org/blog/7497/release-notes-for-safari-technology-preview-27/ "Release Notes for Safari Technology Preview 27 | WebKit")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">safari</span> <span class="jser-tag">ReleaseNote</span> <span class="jser-tag">JavaScript</span></p>
+
+Safari Technology Preview Release 27リリース。
+Object spread/rest propertyの実装、`window.open`に`noopener`を実装、Web Inspectorの改善、Web Cryptography APIでSPKI/PKCS8に対応など
+
+- [ES proposal: Rest/Spread Properties](http://2ality.com/2016/10/rest-spread-properties.html "ES proposal: Rest/Spread Properties")
+
+----
+
+## Ember.js - EmberConf 2017: State of the Union
+[emberjs.com/blog/2017/04/05/emberconf-2017-state-of-the-union.html](https://emberjs.com/blog/2017/04/05/emberconf-2017-state-of-the-union.html "Ember.js - EmberConf 2017: State of the Union")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">歴史</span> <span class="jser-tag">library</span></p>
+
+Ember.jsの歴史とこれからについて。
+スタンドアローンで利用できるようになったコンポーネントレイヤーのGlimmerについてなど
+
+
+----
+
+## Glimmer
+[glimmerjs.com/](https://glimmerjs.com/ "Glimmer")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">DOM</span> <span class="jser-tag">library</span> <span class="jser-tag">WebComponents</span></p>
+
+Emberとは独立したコンポーネントとして利用できるようになったGlimmerのサイト
+
+- [Why I’m excited about GlimmerJS – Hacker Noon](https://hackernoon.com/why-im-excited-about-glimmerjs-3631bd0c95c4 "Why I’m excited about GlimmerJS – Hacker Noon")
+
+----
+
+## Release 8.0.0 · developit/preact
+[github.com/developit/preact/releases/tag/8.0.0](https://github.com/developit/preact/releases/tag/8.0.0 "Release 8.0.0 · developit/preact")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Preact 8.0.0(8.1.0)リリース
+Pure Functional Componentsの書き直し、`linkState`、`className`のオブジェクトオプションはそれぞれ外部モジュールへと機能を移譲など
+
+- [Important changes coming in Preact 8](https://gist.github.com/developit/89e0e6decb8fb5eb00def024b6fb7bd7 "Important changes coming in Preact 8")
+
+----
+
+## Release Version 3.0.0 · sweet-js/sweet.js
+[github.com/sweet-js/sweet.js/releases/tag/v3.0.0](https://github.com/sweet-js/sweet.js/releases/tag/v3.0.0 "Release Version 3.0.0 · sweet-js/sweet.js")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">Tools</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Hygienic Macrosを提供するsweet.js 3.0.0リリース。
+
+
+----
+<h1 class="site-genre">アーティクル</h1>
+
+----
+
+## How we built Twitter Lite | Twitter Blogs
+[blog.twitter.com/2017/how-we-built-twitter-lite](https://blog.twitter.com/2017/how-we-built-twitter-lite "How we built Twitter Lite | Twitter Blogs")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">twitter</span> <span class="jser-tag">mobile</span> <span class="jser-tag">React</span></p>
+
+Twitter Liteの技術スタックについて。
+React, Redux, Normalizr, Globalize, Babel, Webpack, Jest, WebdriverIOなどを使っている。
+パフォーマンスのためにPRPLパターンを使い、`requestAnimationFrame`や`requestIdleCallback`を使ってのレンダリングの調整などについて
+
+
+----
+
+## Introducing ReactXP - ReactXP Blog
+[microsoft.github.io/reactxp/blog/2017/04/06/introducing-reactxp.html](https://microsoft.github.io/reactxp/blog/2017/04/06/introducing-reactxp.html "Introducing ReactXP - ReactXP Blog")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">ReleaseNote</span> <span class="jser-tag">windows</span> <span class="jser-tag">ios</span> <span class="jser-tag">Android</span></p>
+
+React/React NativeベースのクロスプラットフォームなUIフレームワーク。
+クロスプラットフォームで共通したコンポーネントを利用できるようにするのが目的でMSのSkypeチームが作成している。
+
+- [Microsoft/reactxp: Library for cross-platform app development.](https://github.com/microsoft/reactxp "Microsoft/reactxp: Library for cross-platform app development.")
+
+----
+
+## GraphQL & React tutorial (part 1/6) – Chroma
+[blog.hichroma.com/graphql-react-tutorial-part-1-6-d0691af25858](https://blog.hichroma.com/graphql-react-tutorial-part-1-6-d0691af25858 "GraphQL & React tutorial (part 1/6) – Chroma")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">GraphQL</span> <span class="jser-tag">React</span> <span class="jser-tag">tutorial</span></p>
+
+GraphQLについての連載。
+コンポーネント駆動とスキーマファーストについて
+
+
+----
+
+## How to Create a Reddit Client Using Angular 4.0 - Progur!
+[progur.com/2017/03/how-to-create-reddit-client-with-angular-4.html](http://progur.com/2017/03/how-to-create-reddit-client-with-angular-4.html "How to Create a Reddit Client Using Angular 4.0 - Progur!")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">AngularJS</span> <span class="jser-tag">tutorial</span></p>
+
+Angular v4を使ってRedditのAPIを叩いて、リスト表示するチュートリアル
+
+
+----
+<h1 class="site-genre">スライド、動画関係</h1>
+
+----
+
+## The Quest For Immer Mutable State Management
+[immer-mutable-state.surge.sh/](https://immer-mutable-state.surge.sh/ "The Quest For Immer Mutable State Management")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">slide</span></p>
+
+MobXでのSnapshot + mutable state treeについてのスライド。
+Pull/Push-basedなcomputed property、Mutable StateでActionリプレイするために、どのような方法を取るのかについて
+
+- [Michel Weststrate: MobX: The Quest For Immer Mutable State Management - YouTube](https://www.youtube.com/watch?v&#x3D;ta8QKmNRXZM "Michel Weststrate: MobX: The Quest For Immer Mutable State Management - YouTube")
+- [mobxjs/serializr: Serialize and deserialize complex object graphs to JSON](https://github.com/mobxjs/serializr "mobxjs/serializr: Serialize and deserialize complex object graphs to JSON")
+
+----
+
+## ng-conf 2017 - YouTube
+[www.youtube.com/watch?v&#x3D;Nj9\_p4qvm5U](https://www.youtube.com/watch?v&#x3D;Nj9_p4qvm5U "ng-conf 2017 - YouTube")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">AngularJS</span> <span class="jser-tag">イベント</span> <span class="jser-tag">video</span></p>
+
+ng-conf 2017の動画まとめ
+
+- [ng-conf 2017 Summary - Day 1](https://auth0.com/blog/ngconf2017-summary-day1/ "ng-conf 2017 Summary - Day 1")
+- [ng-conf 2017 1日目 Keynoteメモ | &lt;output type=&#34;laco&#34;&gt;](https://blog.lacolaco.net/post/ng-conf-2017-day-1-note/ "ng-conf 2017 1日目 Keynoteメモ | &amp;lt;output type&#x3D;&amp;#34;laco&amp;#34;&amp;gt;")
+- [Long Term Support for Angular Announced at ng-conf 2017](https://www.infoq.com/news/2017/04/ng-conf-2017-keynote "Long Term Support for Angular Announced at ng-conf 2017")
+
+----
+
+## Publish JavaScript packages on npm - Course by @trevordmiller @eggheadio
+[egghead.io/courses/publish-javascript-packages-on-npm](https://egghead.io/courses/publish-javascript-packages-on-npm "Publish JavaScript packages on npm - Course by @trevordmiller @eggheadio")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">npm</span> <span class="jser-tag">video</span> <span class="jser-tag">tutorial</span></p>
+
+npmのパッケージやscriptについてのスクリーンキャスト
+
+
+----
+<h1 class="site-genre">ソフトウェア、ツール、ライブラリ関係</h1>
+
+----
+
+## Stylelint generator
+[maximgatilin.github.io/stylelint-config/](https://maximgatilin.github.io/stylelint-config/ "Stylelint generator")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">CSS</span> <span class="jser-tag">設定</span> <span class="jser-tag">Tools</span></p>
+
+Stylelintの設定ファイルを選択式で作れるジェネレーター
+
+
+----
+
+## mobxjs/serializr: Serialize and deserialize complex object graphs to JSON
+[github.com/mobxjs/serializr](https://github.com/mobxjs/serializr "mobxjs/serializr: Serialize and deserialize complex object graphs to JSON")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span></p>
+
+クラスのオブジェクトシリアライズ/デシリアライズライブラリ
+
+
+----
+<h1 class="site-genre">書籍関係</h1>
+
+----
+
+## MathJax CDN shutting down on April 30, 2017
+[www.mathjax.org/cdn-shutting-down/](http://www.mathjax.org/cdn-shutting-down/ "MathJax CDN shutting down on April 30, 2017")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span> <span class="jser-tag">news</span></p>
+
+MathJax CDNがシャットダウンされるため、ローカルにコピーするかcloudflareのものを利用するようにする必要がある
+
+
+----
+
+## ukyo/wasm-usui-book: webassemblyの薄い本
+[github.com/ukyo/wasm-usui-book](https://github.com/ukyo/wasm-usui-book "ukyo/wasm-usui-book: webassemblyの薄い本")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">WebAssembly</span> <span class="jser-tag">ebook</span></p>
+
+wasmについての電子書籍。
+wasmの概要、WABTを使っての開発、バイナリフォーマットやテキストフォーマットなどについて
+
+
+----