2018-11-06のJS: Node.js 10.13.0(LTS)、React Hooks、Vueコンポーネントのテスト
2018-11-06のJS: Node.js 10.13.0(LTS)、React Hooks、Vueコンポーネントのテスト:
JSer.info #408 - Node.js 10.13.0がリリースされました。
このリリースでNode.js 10.xがLong Term Support (LTS)となりました。
Node.js 10.xは2021年4月までサポートされます。
これを受けてApp Engineでは、Node.js 10をサポートしています。
Making Sense of React Hooks – Dan Abramov – Mediumという記事では、React v16.7.0-alphaで導入された"Hooks"のProposalについて書かれています。
Hooksが解決したい問題として巨大コンポーネント、重複ロジック、HOCなどの複雜なパターンをあげている。あわせてHooksの動作原理などについて書かれています。
また、Hooksはまだ試験的なものであるため、RFCのIssueなどでフィードバックを求めています。
1年間単体テストを書き続けた現場から送る Vue Component のテスト / Vue Component Test - Speaker DeckのスライドではVueコンポーネントのテストについて書かれています。
ライフサイクル、Props/Vuex State、User Interactionの3種類に分けてテストの方法について紹介されている。
React Tools ReleaseNote
create-react-app 2.1.0リリース。
Babelを使ったTypeScriptサポート。
video JavaScript library ReleaseNote
video.js 7.3リリース。
Fill Modeをplayer modeに格上げ、
node.js ReleaseNote
Node.js 11.1.0リリース。
ICUのアップデート、REPLでトップレベル
JavaScript library
ファイルサイズの小さなテンプレートエンジン。Handlebarsのようなカスタムヘルパー、delimiterの指定、フィルター、プリコンパイル、HTML以外への出力などに対応している
node.js ReleaseNote
Node.js 10.13.0リリース。 Node.js 10.xがLong Term Support (LTS)となり、2021年4月までメンテンスされる。
V8 ReleaseNote
V8 v7.1リリース。
パフォーマンスの最適化、Wasmで
React article opinion proposal
React v16.7.0-alphaで導入された"Hooks"のProposalについて。
Hooksが解決したい問題として巨大コンポーネント、重複ロジック、HOCなどの複雜なパターンをあげている。あわせてHooksの動作原理などについて書かれている。
また、Hooksはまだ試験的なものであるためフィードバックなどを求めている。
JavaScript security article
Prototype pollution攻撃への対応方法について。
Mapや
tutorial React article
ReactとMaterial UIを使ってトラベルウェブアプリを作る連載。
スクレイピングしての候補データの取得、Pixabayを使っての画像取得、WikiVoyageを使ってので情報取得。
それらの情報を表示するウェブアプリを作成するチュートリアル。
React redux article 設計 opinion
Reactを使ったチーム開発において認識を合わせてておくとスムーズな概念について。
SFC、Flux/Redux、Context API、Renderパターン、SuspenseとHooksなどのトピックごとに解説とどのような方針をもって進めたかについて書かれている。
Vue console Tools slide
Vue CLIについてのスライド。
Vue CLIは"Ease of Access"のために様々な機能をもっている。
ビルドツールチェイン、
Vue slide testing
Vueコンポーネントのテストについてのスライド。
ライフサイクル、Props/Vuex State、User Interactionのテスト方法などについて
performance slide browser
ウェブパフォーマンスについてのスライドを文字起こししたもの。
JavaScript、CSS、HTTP、Images、Fonts、Toolsについてそれぞれパフォーマンスの最適化についてのトピックが紹介されている。
JavaScript browser library
Cookie、IndexedDB、LocalStorageなどを重複して保存できるKey Valueストアライブラリ。
Evercookieのように複数のストレージに保存することで、どれが消えても他のデータから復元できるようにしている。
JavaScript Promises チートシート
Async/Await、Promiseについてのチートシート
WebComponents library TypeScript jsx
Web Componentsフレームワークとコンパイラー。フレームワークに則ったコンポーネント
を書きWeb Components(Custom Elements)へコンパイルするツール。
TypeScriptやJSXをサポートし、ランタイムでコンポーネントのライフサイクル、非同期レンダリングなどをサポートしている。
node.js グラフ library
ターミナルにグラフを描画できるライブラリ。
Bar, Pie, Bullet, Donut, Gauge, Scatterなどのグラフを描画できる
Chrome Electron library node.js
ユーザー環境にインストール済みのChromeとPuppeteer経由で通信してNodeとBrowserを連携できる開発ツール。
ElectronのようなChromeをWebViewとしたアプリ開発ができる。Nodeからデータを送るといったことができ、Node向けのGUIフレームワークとして利用できる。
JSer.info #408 - Node.js 10.13.0がリリースされました。
このリリースでNode.js 10.xがLong Term Support (LTS)となりました。
Node.js 10.xは2021年4月までサポートされます。
これを受けてApp Engineでは、Node.js 10をサポートしています。
Making Sense of React Hooks – Dan Abramov – Mediumという記事では、React v16.7.0-alphaで導入された"Hooks"のProposalについて書かれています。
Hooksが解決したい問題として巨大コンポーネント、重複ロジック、HOCなどの複雜なパターンをあげている。あわせてHooksの動作原理などについて書かれています。
また、Hooksはまだ試験的なものであるため、RFCのIssueなどでフィードバックを求めています。
1年間単体テストを書き続けた現場から送る Vue Component のテスト / Vue Component Test - Speaker DeckのスライドではVueコンポーネントのテストについて書かれています。
ライフサイクル、Props/Vuex State、User Interactionの3種類に分けてテストの方法について紹介されている。
ヘッドライン
Release v2.1.0 · facebook/create-react-app
github.com/facebook/create-react-app/releases/tag/v2.1.0React Tools ReleaseNote
create-react-app 2.1.0リリース。
Babelを使ったTypeScriptサポート。
create-react-app my-app --typescript
でTypeScriptプロジェクトとして作成できるようになった。Video.js 7.3: Responsive Layout, Fill Mode, createLogger | Video.js Blog
blog.videojs.com/video-js-7-3-responsive-layout-fill-mode-createlogger/video JavaScript library ReleaseNote
video.js 7.3リリース。
Fill Modeをplayer modeに格上げ、
createLogger
メソッドの追加などNode v11.1.0 (Current) | Node.js
nodejs.org/en/blog/release/v11.1.0/node.js ReleaseNote
Node.js 11.1.0リリース。
ICUのアップデート、REPLでトップレベル
await
のサポートなどRead Me - Squirrelly
squirrelly.js.org/JavaScript library
ファイルサイズの小さなテンプレートエンジン。Handlebarsのようなカスタムヘルパー、delimiterの指定、フィルター、プリコンパイル、HTML以外への出力などに対応している
Node v10.13.0 (LTS) | Node.js
nodejs.org/en/blog/release/v10.13.0/node.js ReleaseNote
Node.js 10.13.0リリース。 Node.js 10.xがLong Term Support (LTS)となり、2021年4月までメンテンスされる。
V8 release v7.1 · V8
v8.dev/blog/v8-release-71V8 ReleaseNote
V8 v7.1リリース。
パフォーマンスの最適化、Wasmで
postMessage
をサポート。Intl.RelativeTimeFormat
のサポート、globalThis
Proposalをサポートなどアーティクル
Making Sense of React Hooks – Dan Abramov – Medium
medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889React article opinion proposal
React v16.7.0-alphaで導入された"Hooks"のProposalについて。
Hooksが解決したい問題として巨大コンポーネント、重複ロジック、HOCなどの複雜なパターンをあげている。あわせてHooksの動作原理などについて書かれている。
また、Hooksはまだ試験的なものであるためフィードバックなどを求めている。
- Introducing Hooks – React
- RFC: React Hooks by sebmarkbage · Pull Request #68 · reactjs/rfcs
- Array destructuring for multi-value returns (in light of React hooks) - Google ドキュメント
- React Conf 2018のKeynoteで発表されたHooks、Concurrent Reactのまとめ - Cybozu Inside Out | サイボウズエンジニアのブログ
Node.jsにおけるprototype汚染攻撃への対策 - SSTエンジニアブログ
techblog.securesky-tech.com/entry/2018/10/31/JavaScript security article
Prototype pollution攻撃への対応方法について。
Mapや
Object.create(null)
で__proto__
の上書きを防ぐ方法、ネイティブの実装を上書きしてしまう方法などについてBuild a Bucket List Travel App with React and Material-UI (part 0) | appendTo
appendto.com/2018/10/build-a-bucket-listing-travel-app-with-react-and-material-ui/tutorial React article
ReactとMaterial UIを使ってトラベルウェブアプリを作る連載。
スクレイピングしての候補データの取得、Pixabayを使っての画像取得、WikiVoyageを使ってので情報取得。
それらの情報を表示するウェブアプリを作成するチュートリアル。
Reactで開発するチームが共通認識しておきたい重要な概念 - KitchHike Tech Blog
tech.kitchhike.com/entry/2018/10/31/233000React redux article 設計 opinion
Reactを使ったチーム開発において認識を合わせてておくとスムーズな概念について。
SFC、Flux/Redux、Context API、Renderパターン、SuspenseとHooksなどのトピックごとに解説とどのような方針をもって進めたかについて書かれている。
スライド、動画関係
[JAPANESE] Why vue-cli needed a UI and what you can do with it
slides.com/akryum/vue-cli-18-3-jp#/Vue console Tools slide
Vue CLIについてのスライド。
Vue CLIは"Ease of Access"のために様々な機能をもっている。
ビルドツールチェイン、
vue ui
、プラグインシステムについて。1年間単体テストを書き続けた現場から送る Vue Component のテスト / Vue Component Test - Speaker Deck
speakerdeck.com/tsuchikazu/vue-component-testVue slide testing
Vueコンポーネントのテストについてのスライド。
ライフサイクル、Props/Vuex State、User Interactionのテスト方法などについて
サイト、サービス、ドキュメント
Web Performance 101: JS, CSS, HTTP, images & fonts | PerfPerfPerf
3perf.com/talks/web-perf-101/performance slide browser
ウェブパフォーマンスについてのスライドを文字起こししたもの。
JavaScript、CSS、HTTP、Images、Fonts、Toolsについてそれぞれパフォーマンスの最適化についてのトピックが紹介されている。
ソフトウェア、ツール、ライブラリ関係
gruns/irondb: A relentless key-value store for the browser.
github.com/gruns/irondbJavaScript browser library
Cookie、IndexedDB、LocalStorageなどを重複して保存できるKey Valueストアライブラリ。
Evercookieのように複数のストレージに保存することで、どれが消えても他のデータから復元できるようにしている。
frontarm/async-javascript-cheatsheet: Cheatsheet for promises and async/await
github.com/frontarm/async-javascript-cheatsheetJavaScript Promises チートシート
Async/Await、Promiseについてのチートシート
Stencil
stenciljs.com/WebComponents library TypeScript jsx
Web Componentsフレームワークとコンパイラー。フレームワークに則ったコンポーネント
を書きWeb Components(Custom Elements)へコンパイルするツール。
TypeScriptやJSXをサポートし、ランタイムでコンポーネントのライフサイクル、非同期レンダリングなどをサポートしている。
chunqiuyiyu/ervy: Bring charts to terminal.
github.com/chunqiuyiyu/ervynode.js グラフ library
ターミナルにグラフを描画できるライブラリ。
Bar, Pie, Bullet, Donut, Gauge, Scatterなどのグラフを描画できる
GoogleChromeLabs/carlo: Web rendering surface for Node applications
github.com/GoogleChromeLabs/carloChrome Electron library node.js
ユーザー環境にインストール済みのChromeとPuppeteer経由で通信してNodeとBrowserを連携できる開発ツール。
ElectronのようなChromeをWebViewとしたアプリ開発ができる。Nodeからデータを送るといったことができ、Node向けのGUIフレームワークとして利用できる。
コメント
コメントを投稿