「Node学園 32時限目」に参加してきました

勉強会メモ
  • Node学園に参加してきました。

nodejs.connpass.com

  • 今回は、先日のReactConfから話題沸騰中のReact Hooksについてmizchiさんが解説してくれるということで、とても豪華なイベントでした。
  • 来月のNodeFest2018も楽しみです。
タイトル 登壇者
Node v11 and NodeFest introduction yosuke_furukawa
Node.jsで現実世界の”もの”を動かす話 9wick
React Hooks mizchi

Node v11 and NodeFest introduction

  • yosuke_furukawaさん

NodeFest2018

  • 11/23,24に開催

nodefest.jp

  • ロゴが変わった

Day1: Conference

注目のスピーカー
  • Anna
    • Workerを作った人
  • Rachel
    • Webの中のメディア系のところの話
    • WebGLとかWeb Audioとか
  • Daniel
    • TC39の中の人
    • Class Propertyとか
    • 一日一部屋貸し切り
      • 未知数枠
      • 大物たちが来てディスカッション？
  • Colin
    • libuvの中の人
  • 飯塚さん

Day2: Interactive Sessions

  • NodeとJSのディスカッション
    • 良いとこ悪いとこ改善点
    • 開発者と利用者でディスカッションできる
  • Code and Learn
    • nodeにコミットする
  • Handson
    • SPAとか
    • 海外から来る講師も(未知数)

Node.js v10/v11情報

  • v11はそんなにたいした変更はない
  • v10.0.0 ~ v10.12.0
    • http2
    • ESM
    • Worker追加
  • v11
    • v8のversion7対応
    • url moduleがdeprecated
    • TextEncoder/TextDecoderがglobalになった
    • queueMicrotask APIがexperimental
      • Promiseにタスクを積む

Stream/Promiseの親和性改善

  • for await ofでstreamを逐次処理
  • v10からStreamに追加されたfinished, pipeline APIがPromiseと親和性高い

for await of

for await (const k of readable) {
  data += k;
}

Stream finished API

  • エラー成功にかかわらず終了したらcallbackを呼べるようになった
  • callbackをPromiseにしてしまえばasync/awaitで扱える

Stream Pipeline API

  • before
rs.on('error', errorHandler).pipe(ws).on('error', errorHandler)
  • after
pipeline(rs, ws, (err) => {
  if(err) {
    // ...
  }
}

Node.jsで現実世界の”もの”を動かす話

  • 9wickさん

Nodeでできること広がってる

  • CLI: 一次元
  • Webサーバ: 二次元
  • ものを動かす: 三次元

ものを動かせると何ができるか

  • 現実に鑑賞できる
  • input
    • 音・温度・傾き・土壌・空気
  • output
    • 光・音・モーター・電光掲示板・ロボット

Nodeで動かせるデバイス

rasberry pi

  • 小さいPC
    • node動く
  • IO端子がついてる

arduino

  • PCでなくマイコン
    • node動かない
      • PCで操作する
  • 有線接続
  • IO端子

obniz

  • マイコン？
    • node動かない
      • サーバで操作する
      • インターネット経由で
  • 無線接続
  • IO端子

DEMO

  • clovaでラジコン?を動かす

React Hooks

React Hooks

  • SFCでstateを使う
    • Class使わなくても状態を持てる
  • Dan先生
    • Reduxの作者
    • Reactのコアチーム

reactjs.org

  • ライフサイクルメソッドも使える
    • 毎回走るからComponentDidMount相当のもの作るのは大変
  • Vueでも同じものを作ろうという動きが・・・？
  • recomposeもうメンテされなくなる？
    • 今後はhooksで

今後

  • HOCは推奨されなくなる
  • React.Component -> Function Component