チームスピリットデベロッパーブログ

チームスピリット開発者のブログ

フロントエンドとごはんをいただく、まかないてっく#一杯目を開催しました

f:id:ts-yokouchi:20170731093835j:plain 私のLTより私の作った唐揚げ丼に集中する皆さま

こんにちは、腹筋ローラーの力を信じろ(id:ts-yokouchi)です。

弊社では先日、まかないてっく〜フロントエンドを語ろう〜というイベントを開催させていただきました。

teamspirit.connpass.com

弊社ではお昼にエンジニアが集まり、ご飯を食べながら技術談義を行う「Tech Lunch」という活動があります。

週の技術トピックをあげて適当に喋ったり、1時間半ほど設計相談が続いたり、いきなりLTがはじまったり、おもむろに出汁から作った明太子茶漬けが振舞われたりします。予定も内容も決めないゆる〜く技術について花を咲かせる会です。

今回は社外公開版Tech Lunch、「まかないてっく」テーマは「フロントエンドを語ろう」ということで開催させていただきました。

簡単にですがレポ or 感想をまとめていきます。 ちなみに当日お出しした唐揚げ丼についてはおもわず長文になってしまったので別記事としてまとめています。

LT

当日は私を含めて4人がLT枠で発表を行いました。

ES2018 AsyncIteratorでキメる / brn0227 さん

speakerdeck.com

Iteratorから非同期までざっとお話いただいたあとに、proposalsの一つであるAsyncIterator / for-await-ofをつかった自作のライブラリをご紹介いただきました。
github.com

Aysnc Iterationはstage3まで進んでおり、仕様としては固まっていてbabelでも利用することが可能です。
勉強が足らずに「なるほどいっぱい便利なのがでてきたな、面白そう!」みたいな感想しかでてきませんでした。

後日ネットサーフィンしたところ、似たような非同期データを扱う仕様としてObservable/Streamもあるらしく、それぞれどういった用途があるのかを理解するのは今後の課題です。

キーボード操作 (カチャカチャカチャ…ッターン!) するために / masuP9 さん

masup.net

アクセシビリティおじさんさんの発表です。なんと40枚ものスライドをご準備いただき、アクセシビリティのさわりからReactでの実装例まで一気に駆け抜けるような内容でした。 後半ネイティブでないUIをアクセシブルにする例をご紹介いただきましたが、こういった事例が実業務では多々あると思います。

そんな時に参考になるのがWAI-ARIA Authoring Practices 1.1、流し見しただけですが具体的な実装指針が乗っているようです。

8月は定員が埋まってしまったそうなのですがWCAGもくもく会という勉強会があるそうです。アクセシビリティに興味を持たれた方は是非参加してはいかがでしょう。

ca11y.connpass.com

Reactでつくる動的レンダリング / aloerina_ さん

speakerdeck.com

Reactの動的レンダリングをGofのFactory Patternを使って柔軟に実装するというお話でした。コンポーネントの描画切り替えを行う分岐をFactoryクラスに移譲することでContainerコンポーネントがスッキリかけるそうです。

実際描画されるコンポーネントはインターフェースを合わせる必要があるとのことで、TypeScriptやFlowなんかを合わせると効果を発揮しそうですし、HOCなんかで実装しても面白いのでは!と思いました。

CSSは死んだのか?/ 腹筋ローラーの力を信じろ

speakerdeck.com

自分の発表です。タイトルのインパクトが強いですが、要は世の中に溢れている設計やツールに頼りきらず、CSS(とその前段)を見直そう、というふんわりした話でした。

最後のほうで「デザインがあって、HTMLがあり…」といった内容のスライドを入れておいたのですが、HTMLが一番上にくるべきといった趣旨のまさかりをいただきました。Webというプラットフォームに乗っかる以上、デザインより先にWebがあるべきであるし、我々フロントエンドエンジニアとしてはチームを導いていかないといけないですね。

ディスカッション

後半はテーブル二つに分かれてディスカッションタイムを行いました。一時間 + 中締め後残っていた方はもう一時間近く続きました。

あらかじめ投稿していただいたネタを元に議論を行う予定でしたが、テーマからどんどん飛躍してとても濃い話ができたのではないかと思います。「フロントエンド」とテーマを決めてはいましたが、集まった面々はバックグラウンドや担当領域が異なり、いろんな側面からの意見がでて良かったです。

こういう参加型ディスカッションは実りになる内容がとても多いと感じており、いろんなところでやってみて欲しいなと勝手に思っています。

小ネタ

f:id:ts-yokouchi:20170731094608p:plain

今回は「まかない」がテーマだったこともありデザインの中心にしゃもじを据えてみました。「ゆるい」がテーマの一つだったのでいろいろと遊びましたw

f:id:ts-yokouchi:20170731094520j:plain 表情に定評のある同僚氏

写真はしゃもじを握ってる風に見えるマイクです。こういうくだらないことが大好きなんです。

LTでもみなさん、「まかない」ネタをちょくちょく挟んできてあって楽しかったですw

f:id:ts-yokouchi:20170731132329j:plain

これから

まかないてっくは「#一杯目」と打ち出しているように今後も継続していく予定です。 テーマもまかないも、毎回趣向を凝らして変えていこうと思いますので気になる方はconnpassのグループにご参加ください!

teamspirit.connpass.com