Fork me on GitHub

2014-08-25のJS: Autoprefixer 3.0、JavaScriptのオブジェクト、Next Component

Edit on GitHub 編集履歴を見る

JSer.info #189 - CSSファイルに対してvendor prefixを付加できるAutoprefixer 3.0がリリースされました。

Sass等がプリプロセスと呼ばれるのに対して、プリプロセスされた後のCSSに対して処理をするのでPostCSSとか言われるジャンルのツールです。
(ポストプロセスという用語が適切なのかという話もありますが)

Autoprefixer 3.0では、CoffeeScriptで書かれていたものがES6ベースに書きなおされました。またそれに伴ってコードから使う場合のAPIも変わっています。


Advanced objects in JavaScript という記事ではJavaScriptのオブジェクトについて幅広く解説されています。

単純なprototypeから、getter/setter、また同じgetter/setterでもdefinePropertyを使った方法とPropertyDescriptorについて順を追ってサンプルコードと共に解説されていて読みやすいと思います。

そこからalternative newとしてのObject.create、valueOfとtoStringについてまで触れられていて、最新のES6のProxyとSymbol(ここが本題っぽいですが)について書かれています。

幅広い内容なのでちょっと長いですがコード例も多いので読みやすいため、全体的に見て知らない部分を別途詳しく調べる等してみるといいかもしれません。


Duo というcomponentの後継となるパッケージ管理ツールが公開されています。
(component/componentにもDuoが後継であることが明記されている)

まだ出たばかりであるため、動作の安定性、ドキュメント不足など評価するフェーズではない気がします。

新たに追加された機能として、Go言語のようにrequire('matthewmueller/uid');と指定する事で直接GitHubリポジトリからパッケージを取得する機能等が追加されています。
(component.jsonによるcomponentはそのまま使えます。)

また、Duoとは違いこちらはComponentに対して後方互換性はありませんが、normalize.ioというパッケージ管理もβ公開されているのでコンセプトとして面白いので見てみるといいかもしれません。


お知らせ

アイコンが欲しい · Issue #4 · jser/jser.info というIssueがかなり曖昧でしたが、もう少しイメージを出してみたので興味ある方是非。


ヘッドライン


Release 3.0 “Liberté, Égalité, Fraternité” · postcss/autoprefixer

github.com/postcss/autoprefixer/releases/tag/3.0.0

CSS node.js Tools

Autoprefixer 3.0リリース。

autoprefixer()のAPIの変更、coreは分離、CoffeeからES6で書き直し、リポジトリがpostcssに移動した


Node v0.10.31 (Stable)

blog.nodejs.org/2014/08/19/node-v0-10-31-stable/

node.js ReleaseNote

Node v0.10.31 リリース。


アーティクル


Sass 3.4 is Out!

www.sitepoint.com/sass-3-4-is-out/

Sass

Sass3.4の更新内容について。

parent selector 、selector function、 @error ディレクティブなどについて


Advanced objects in JavaScript

bjorn.tipling.com/advanced-objects-in-javascript

JavaScript ECMAScript tutorial

JSのオブジェクトについて幅広く解説されてる。

getter/setter、definePropertyとPropertyDescriptor、Object.create、valueOfとtoString、ES6のProxyとSymbolについて


ストリーム表現とその変換 - ✘╹◡╹✘

r7kamura.hatenablog.com/entry/2014/08/21/113654

JavaScript library

リアクティブプログラミングにおけるストリームの実装ライブラリと、ストリームについての解説。

ストリームの作成、ストリームを変換するmap、filter、scanについて


WebStorm+Spy-jsの使い方 - Qiita

qiita.com/laco0416/items/985044f0019ebef6cb2c

WebStorm Tools

WebStormから使えるspy-jsの機能や使い方について


WebRTC で動く Chord DHT の実装 webrtc-chord を公開しました - tsujio’s blog

ntsujio.hatenablog.com/entry/2014/07/03/221023

JavaScript WebRTC

WebRTCを使った分散ハッシュテーブル (DHT: Distributed Hash Table) の実装


サイト、サービス


bevacqua/js

github.com/bevacqua/js/

JavaScript

"JavaScript Quality Guide"

JavaScriptコーディングスタイルガイド。


ECMAScript 6 support in Mozilla - JavaScript | MDN

developer.mozilla.org/en-US/docs/Web/JavaScript/NewinJavaScript/ECMAScript6supportinMozilla

firefox ECMAScript まとめ

FirefoxのES6サポート状況についてまとまってるページ


5 Minutes of JavaScript - The latest news in the JavaScript community

five-js.envylabs.com/episodes/42-episode-41-august-21st-2014

podcast JavaScript

週間JavaScriptなPodcast


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


slap-editor/slap

github.com/slap-editor/slap

node.js console editor

node.js製のターミナル上で動くテキストエディタ。

SublimeText的なファイルリスト、マウス対応、キーバインドの対応などデフォルトでもそのまま使えるような感じで面白い


Duo

duojs.org/

JavaScript Tools GoLang browserify

Componentライクなパッケージ管理ツール。component.jsonでまとめられたコンポーネントからビルドしたjsやcssを生成出来る。またGo言語のようにrequireに直接GitHubのレポジトリを指定して使うことも出来る


normalize.io - an ES6 module, Web Component, and SPDY/HTTP2 Push frontend development worfklow

normalize.github.io/

node.js CSS JavaScript Tools

ES6 moudle/HTML Import/CSS importで書いてimportしたものをビルド出来るパッケージ管理ツール。

npm、URL、components等に対応してて、パッケージをURLで指定するという原則を持ってる


Ment.io examples

jeff-collins.github.io/ment.io/#/

JavaScript library AngularJS

Content Editableとかテキストエリアにおいて、GitHubのような@によるmentionの補完が出来るライブラリ


styledown/styledown · GitHub

github.com/styledown/styledown

CSS Markdown document

CSSスタイルガイド生成ツール。

コメントにmarkdownで書いてスタイルガイドを生成する事が出来る。


hail2u/node-csswring

github.com/hail2u/node-csswring/

CSS Tools

CSSから余分な記述を取り除いたり、書き換える事で圧縮するツール。

SourceMapに対応してる


soliton4/nodeMirror

github.com/soliton4/nodeMirror

node.js editor JavaScript library

node.js + CodeMirrorなブラウザで動くIDE。

ローカルサーバを立ち上げて、ブラウザで使う。hexエディタ、ターミナル、HTMLの表示などが出来る


joyent/node-vstream

github.com/joyent/node-vstream

node.js stream library

node streamをラップして、データのダンプやチェック機能等を付けられるモジュール。


browserify-loader 介绍 - 寸志 - SegmentFault

blog.segmentfault.com/zhicun/1190000000640242

browserify AMD CommonJS library

https://github.com/island205/browserify-loader についての紹介記事。

requrejsのようにmain属性で読み込むものを指定して使うローダーライブラリ


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