We Are JavaScripters!@14th まとめ
We Are JavaScripters!@14thに参加したので、その内容についてまとめました! プレゼント企画などもあって楽しかった!
イベント自体の詳細は、こちら!
LT1: node.jsでプレゼンツールつくったお話 @ykyk1218
資料
自己紹介
- ニワトリのアイコン
悩み
- 勉強会で質問しにくい
- 勉強会に登壇しても、反応がわかりにくい
SlideChat
- 作った
- pdfをアップロードし、スライド形式に変換
- プレゼン中にコメントできる
- なるほどボタンで、なるほど数を表示できる
スタック
- Meteor(node.js)
- Mongoとの相性がいい
- フロントエンド周りの環境を整えるのが楽
- webpackなどを別途用意する必要がない
- React.js
- PDF.js
- MongoDB
Qiitaスライドで使いたい!
- QiitaスライドをpdfにするChrome拡張作った
LT2: Nuxt.jsで始めるPWA @takanorip
資料
自己紹介
- 株式会社スマートドライブ
- Polymer-Japan翻訳チーム
Service Worker
- networkとcacheからいい感じにデータ取ってきてくれる
Nuxt.js
- ユニバーサルVue.jsアプリ
- SSR
- ルーティング便利
導入は簡単!
- pwa-moduleを使う
- ライブラリをNuxt用にモジュール化したもの
- nuxt.config.js
- 設定ファイル
- gitignoreにsw.*を追加
プッシュ通知
- One Signalを使う
- モバイルAppもWebPushも
- Uberも使っている
- nuxt.config.jsにonesignalモジュールを登録し、設定を追記
- デフォルトの通知設定ダイアログを出す前に、確認をはさまないとユーザービリティ的にだめ!
- OneSignalで、確認用の独自UIを出せる
まとめ
- Nuxt.jsでPWAの導入が簡単!
LT3: (スポンサー)アライドアーキテクツのサービスで使わているJavaScriptの話 @oremega
資料
自己紹介
- デザイナー
- 社内で1人なので、UI,UX,HTML,CSS,JSなんでもやる
アライドアーキテクツ
monipla
- 企業と人をつなぐ
- 全部jQuery!
Brand Touch Manager
- 企業が、自社とつながっている人を可視化
技術スタック
告知
- フロントエンドエンジニアとデザイナーを募集しています!
LT4: jquery? state管理? どっち使えばいいの? @fukaminmin
資料
www.slideshare.net
自己紹介
画面から友達を削除する
jQuery
state管理
- state側のデータを判別して、そっちをいじればいい
使用基準
- jquery
- LP
- 動きがないページ
- animation
- vue, knockout
- ポップアップやコメント一覧
- react, angular
- 1ページで色々したい
- フルSPA
デメリット
おすすめ
- 最初に始めるなら、Vue!
スポンサーセッション
LT5: facebookのフロントエンド開発 @boiyaaaaaa
資料
自己紹介
- Persol P&T
- フロントエンドエンジニア
- ITスペシャリストに昇格
Facebookでのフロントエンド開発
- StackShareによるスタック
- React, Flux, Relay
- Jest
- Phabricator
- Jenkins
- Nuclide(内製エディタ)
- Mercurialの単一リポジトリにぶち込んでいる
弟に訊いてみた
パッケージ管理
- 全社でYarnを使っている
- 必要なモジュールを全て内製している
Facebook製のものしか使えない?
- 強制ではない
- Nuclideが自社構成だと使いやすい
品質管理
- Flowで型チェック
- Jest
YarnやJestは書き換えた?
- 1週間でソースがほとんど変わることがある
バンドラは?
- 内製
Facebookの開発者になるためには?
LT6: SlackはどうやってBrowserViewに乗り換えたか @tipo159
資料
内容
- 以下の内容に沿って、Slackの実装上の変化を紹介
WebViewからBrowserViewへの乗り換え
- まだβ版
- webViewよりもChromeのタブに近い動作
- Electronで維持管理できる
複数Redux Storeの同期
- 前は必要だったが、不要になった
非同期Actionによる副作用
- redux-observableを使い、非同期Actionとユーザー操作に伴うActionを一元化
リファクタリング
- TypeScriptによる正確なリファクタリング
- Observableを使ったコード記述に、型が役に立つ
LT7: 関数の話 @chikoski
資料
function宣言とアロー関数式
- 書き方が色々
関数適用
- 関数を呼ぶ方法
add(1,2)
パイプライン演算子
- 最近議論されている仕様
value = 7 |> double |> addOne
関数適用は遅い
- 普通に演算子で書いた方が早い
- 関数呼び出し時にローカル変数を使ったりするので、メモリ操作が多い
- でも、関数で書いた方が読みやすい
末尾呼び出し
- ES6の仕様で、内部的に演算子で展開してくれる
- なかなか実装されなかった
関数
- 手続きの列に名前をつけたもの
関数はオブジェクト
- つまり、関数 = モノ
クロージャ
- 外の変数を使って定義できる
部分適用
- クロージャがあると、関数の一部分だけを固定した別の関数ができる
- utilityが簡単に作れる
ロジックのパラメータ化
- map, reduceなど、ロジックを引数で渡せる
- 部分適用と組み合わせるといい
シューティングゲームに使ってみる
- 当たり判定の計算をしてみる
- Enemyクラスに、ColliderとRendererのプロパティを設ける例
LT8: アウトプットしよう! @brn0227
自己紹介
- V8のコントリビュータになった!
新卒時代
- JS書けるだけで即戦力に
転職
- CAへ
- 上司に勉強会を勧められるが、嫌いだった
- 発表内容も大したことないし...
- 懇親会が苦手...
インプット
- ひたすらインプット
- babelよりも前にトランスパイラを作ったが、公表せずに殺した
世間から消える
- 社員数が多いと、知られていないことも多い
- フロントエンドテックリードになったが、自分を知っている人があまりいなかった
行き詰まり
- インプットだけを続けても、成長が見えなくなってきた
- OSSはPR送っていたが、遠い存在に感じていた
2017年
- 月に2〜4登壇を目標
- 23登壇した
- speaker deckが2ページになった
感じたこと
伝えたいこと
- 明日からでもアウトプットすべき
- 自分の価値を高めるのは、自分の責務
- 社会から受けた恩を返していこう
- 立ち止まっている間に、ベテラン達はさらに先に行ってしまう
伝えたいこと2
- インプットとアウトプットのバランスをとる
- アウトプットがあるから新鮮な情報に触れられる
- 自分の情報の鮮度を確認できる
- 「十分な目玉があれば、全てのバグは深刻ではない」
知見
- ありとあらゆる知見は、価値がある
- 自分にとって取るに足らない内容でも、他の人にとってはとても価値がある
方法
- 片っ端からLT枠に申し込む
- 申し込んでから内容を考える
- 喋る練習をする
- 懇親会で人と話す
- ブログ頑張る
まとめ
- 迷う必要はない!