Fork me on GitHub

2017-07-11のJS: npm 5.2.0(npx)、lerna 2.0.0、WebRTC

Edit on GitHub 編集履歴を見る

JSer.info #340 - npm 5.2.0がリリースされました。

npm 5.2.0ではnpxというnpmのCLIパッケージの実行サポートをするコマンドが同梱されています。
今までは、npmで配布されているツールはnpm installしてから$(npm bin)/some-bin./node_modules/.bin/some-binやnpm run-scriptsに書いて実行していました。
npxでは、npx create-react-app my-cool-new-appのようなコマンドを実行するだけで、インストールから実行までを行えます。ローカルに既にインストールされている場合はそちらのコマンドが利用されます。

また、-pオプションでは指定したパッケージを$PATHへ追加してから実行します。
これを利用して、特定Node.jsのバージョンをパッケージとしてインストールし、そのNode.jsを使ってコマンドを実行できます(node-binは*nixプラットフォームのみ対応)

npx -p node-bin@<version> node -v

詳細は次の記事で解説されています。


monorepo管理ツールのLerna 2.0.0がリリースされました。

長いRC(というよりはβ)の期間があったので、1.xからの変更は多いです。
Conventional Commitsに対応したバージョンの自動決定/CHANGELOGの生成、--canaryの対応、--hoistの追加など色々追加されています。

また、2.0.0では--use-workspacesで現在yarnに実装中のyarn workspaceを利用したbootstrapが行えるようになっています。yarn workspaceはyarn自体に実装中のlernaのようなプロジェクト管理のための仕組みです。


A Closer Look Into WebRTC | WebKitという記事ではSafari 11(またはSafari Technology Preview)に実装されているWebRTCの機能について紹介されています。

WebRTCを使ってどのようなことができるのかを簡単に紹介されているので、見てみるといいかもしれません。


ヘッドライン


Release v5.2.0 (2017-07-05) · npm/npm

github.com/npm/npm/releases/tag/v5.2.0

npm Tools ReleaseNote

npm 5.2.0リリース
npxコマンドが同梱されるようになった。npxはnpm registryやgistに登録されているCLIツールのパッケージをコマンド一つでダウンロードから実行までを行えるツール。
また-pオプションで特定バージョンのNode.jsでnpm scriptsなども実行できる。

npx -p node-bin@6 npm test

Release v5.1.0 · npm/npm

github.com/npm/npm/releases/tag/v5.1.0

npm ReleaseNote

npm v5.1.0リリース。
package-lock.jsonrequiresフィールドを追加、preferGlobalオプションを非推奨にし警告は出さないように、npm buildを間違えて呼び出した場合に警告するように、バグ修正など


ESLint v4.2.0 released - ESLint - Pluggable JavaScript linter

eslint.org/blog/2017/07/eslint-v4.2.0-released

ESLint ReleaseNote

ESLint v4.2.0リリース。
linter.verifyAndFixが関数を受け付けるように、getter-returnルールの追加など


Release v2.0.0 · lerna/lerna

github.com/lerna/lerna/releases/tag/v2.0.0

JavaScript Tools ReleaseNote

monorepo管理ツールのlerna v2.0.0リリース。
yarn workspaceのサポート、--canaryオプションの改善など。


Release v3.1.0 · webpack/webpack

github.com/webpack/webpack/releases/tag/v3.1.0

ReleaseNote webpack

webpack 3.1.0リリース。 cacheWithContextオプションが追加され(デフォルトオフ)パフォーマンスの改善、設定を関数の配列として書けるようになるなど


Release v1.6.0 · babel/babel-preset-env

github.com/babel/babel-preset-env/releases/tag/v1.6.0

babel plugin ReleaseNote

babel-preset-env v1.6.0リリース。
Node.js 8に対応したcompat-tableへ更新、targetschromeandroidに対応など


Release JSDoc 3.5.0 · jsdoc3/jsdoc

github.com/jsdoc3/jsdoc/releases/tag/3.5.0

JSDoc ReleaseNote

JSDoc 3.5.0 リリース。
semverではないので破壊的変更も含まれる。
JSDocのパースにBabylonを利用するようになり、JSXなどもサポート。
Node.js 4.2.0未満のサポート終了など


アーティクル


これからのレイアウトはGrid Layoutで決まり?特徴で使い分けたいCSSレイアウト手法 - ICS MEDIA

ics.media/entry/15921

CSS

float、flexbox、grid layoutの使い分けについて


The WHATWG Blog — Progressing Streams

blog.whatwg.org/progressing-streams

WHATWG stream

WHATWG Streamについて。


A Closer Look Into WebRTC | WebKit

webkit.org/blog/7763/a-closer-look-into-webrtc/

safari WebRTC

Safari 11でサポートされる予定のWebRTCについての解説。
開発者向けの設定、後方互換性とadapter.js、audio-videoの送信例、Media Captureについてなど


Experimenting with the background fetch API | Phil Nash

philna.sh/blog/2017/07/04/experimenting-with-the-background-fetch-api/

ServiceWorker JavaScript WebPlatformAPI

ServiceWorkerのbackground-fetching APIについて。
バックグラウンドでダウンロードやファイルのアップロードを行うことを目的としたAPI


Getting started with PreactJS — A Step By Step Guide

blog.codeinfuse.com/getting-started-with-preactjs-a-step-by-step-guide-f3197f871753

React tutorial JavaScript article

preact-cliを使ったpreact入門記事。
Reactとの違いや互換性についてや、preact-cliを使ったビルドやそのファイルサイズなどについて


Node.js FoundationとNode.jsについて - 技術探し

abouthiroppy.hatenablog.jp/entry/2017/07/05/090952

node.js 組織

Node.js Foundationを構成するワーキンググループや技術委員会についての解説。
どのようなワーキンググループがあり、どのように議論が行われているかについて


Upcoming Regular Expression Features | Web | Google Developers

developers.google.com/web/updates/2017/07/upcoming-regexp-features

ECMAScript JavaScript V8 正規表現

現在Stage 3である正規表現の拡張Proposalの紹介記事。
Named Captures、/./s dotAll、Unicode Property Escapes、Lookbehind Assertionsについて


スライド、動画関係


VueConf EU - YouTube

www.youtube.com/watch?v=lG0Ys-2d4MA

Vue イベント video

VueConf EUの動画


Capability of React Fiber // Speaker Deck

speakerdeck.com/koba04/capability-of-react-fiber

React slide

React Fiberについてのスライド。
Filberにおけるスタック、スケジューリング、カスタムレンダラーについてなど


Faao - ドメイン駆動設計で作るGitHub Issue Client -

azu.github.io/slide/2017/teppeis-sushi/client-side-ddd-on-github.html

DDD JavaScript TypeScript slide testing document

クライアントサイドDDDとLiving Documentationについてのスライド。
遠回りのモデリング、妥協あり/なしのRepositoryでの永続化、ユースケース図、ドキュメントのコード化、デバッグについてなど


サイト、サービス、ドキュメント


siddharthkp/bundlesize: Keep your bundle size in check

github.com/siddharthkp/bundlesize

webservice CI node.js github

CIからGitHubのステータスにbundleしたファイルサイズを通知、一定サイズを超えたらエラーとすることができるツール/GitHub App


ソフトウェア、ツール、ライブラリ関係


sverweij/dependency-cruiser: Validate and visualize dependencies. With your rules. JavaScript, TypeScript, CoffeeScript. ES6, CommonJS, AMD.

github.com/sverweij/dependency-cruiser

JavaScript testing Tools

JavaScriptコード間の依存関係グラフを元に、指定したパスから指定したパスへの参照を禁止するルールなどを設定することができる。
また循環参照や存在しないモジュールの参照などもチェックできる


kentcdodds/babel-plugin-preval: Pre-evaluate code at build-time

github.com/kentcdodds/babel-plugin-preval

babel plugin

Babelでコンパイル時に評価して評価結果を埋め込むことができるプラグイン


書籍関係


Amazon.com: Mastering Immutable.js eBook: Adam Boduch: Kindle Store

www.amazon.com/Mastering-Immutable-js-Adam-Boduch-ebook/dp/B073RMMCL9

JavaScript book library

2018年2月6日発売
immutable.jsについての書籍


この記事へ修正リクエストをする
記事を紹介する