以下のイベントに行ってきました。
SCRIPTY#1 〜フロントエンド紳士・淑女のための勉強会〜
http://scripty.connpass.com/event/8340/
紳士かどうかはわからんですが、Yahooで使われているフロントエンドまわりの技術についての勉強会です。以下、セッション毎の感想、まとめ。
「本当にあった怖いCSS 〜BEMのすすめ〜」
「backbone.js 光と闇」
「Angular.jsとThree.jsを一緒に使った時の話」
「コードデザインの解剖 Polymer 編」
- Polymer.jsの話。Web Componentsが使えないブラウザ向けのライブラリ。例によってGoogle先生謹製。最近、名前はよく聞くなあ。
- 先生が提唱しているマテリアルデザインとも密に関係している。マテリアルデザインを実現するコンポーネントをPolymerで提供する事でみんなGoogle先生が目指す世界に近づけるよ!みたいな。
- ただ、まあまだ不安定なのでYahooは思想だけ参考にしたライブラリを作ったよ
- ビジュアルデザインのコード化という思想。雰囲気見た目を揃えましょうみたいなガイドラインではなく、コードベースでデザインを統一化する。これも素敵。
- Polymerは名前こそ結構浸透してるものの実際取り入れているところは少ない印象。でもカスタムコンポーネント作ってそれを組み合わせるだけでページが作れたら素敵。先行投資として今から勉強しといた方がいいすな。
マイナーブラウザとのつき合い方
- ログ見て自分のサイトにあった対応を考えな!で終わると寂しいので考え方の話。
- 全てのブラウザに同じ機能・見た目を提供するのは無理。以下の2パターンでアプローチするといいが、これからは2の方で進めるべき
1. プログレッシブ・エンハンスメント(一般的環境を基準にし、進んだ環境には+@で進んだものを提供)
2. グレースフル・デグラデーション(最近の環境を基準にし、古い環境にはレベルを落とす)
「突撃!隣のgruntfile!」
「ライブコーディングのすゝめ」
- Node.jsのライブコーディング。20分くらいでcanvas使って書かれた画像をサーバー側に保存するサイト作ってた。
- コーディングしてる人がパーフェクトJavaScript書いた人で思わぬところで神に遭遇する。
- まあEmacsなんすよ。。。
- Atomは注目してるよ!とは言われた。
簡単な感想
Yahooのフロントで実際に使われている技術の一端を知る事ができたのはよかったです。フロント周りは進化が早いので追っかけて行くのは大変だけど大事なことだなーと再認識。自分の仕事で色々取り入れて行きたいけど、そもそもフロント周りのトレンドに興味がある人が少なそうなので難しい。。。前は一人でgrunt入れようとしたりSassで書き換えようとしたりしたけど、結局自分だけの書けるようになっても意味ないので周りの巻き込み方が難しいすなあ。色々課題。
ちなみにステッカー作ってたけど第2回、3回とか続くのかな?