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

勉強会メモ

Nodeにコントリビュートし始めて一ヶ月でコラボレーターになった

きっかけ

  • OSS contribution guide
  • Node学園祭code and learn
    • コラボレーターとやる
    • できそうなissue集めておいてくれる
    • 世界各国でやってる
  • CoreとかTSCとかCTCとかいろいろある

内容

  • 最初のPR
    • functionをアロー関数に
  • ちょいネタは飽きたContributeみを感じたい
    • PRの数ばっか増えてもしかたない
    • 難しいのもやりたい
  • v8(C++)のコードを直した
  • テストのカバレッジを上げる
  • streamをさわるPRも出した

コラボレータになる

  • コントリビューターの候補をあげるissue
    • 自分も候補にあげてもらった
  • READMEに自分を加えてPRだしてレビューしてmasterに反映

コラボレータになって

  • レビュー英語で大変
  • コード理解してないとこもまだ多い

その後

  • nodeの中身わかってると実案件でも役立ってる − nodeの中読めばいいやって思える

コラボレータになりたい人へ

  • 英語は伝えようとする気持ち
    • 英語できなくてもPR出せる
  • ネタはたくさんある
    • 超簡単からC++まで
  • 1Contributeしたら2,3と続けてみましょう

headless chromeでクローラを作った話

ヘッドレスChrome

  • ヘッドレスChrome
    • Chromeをヘッドレスで起動できる
    • 主な用途はテスト自動化と動的クローラ
    • phantomJSよりはやい 
      - 開発終了

静的クローラ

動的クローラ

  • ヘッドレスChrome
  • SPAでもクロールできる

問題もまだ山積み

  • API低レベル
  • 仕様不安定
  • セキュリティブロック
  • バグ踏む

GoogleChrime/puppeteer

  • puppeteer
    • 1.0.0リリースされたばかり
    • ヘッドレスchromeをラップしたもの

実用的な記事が少ない

作り方

ミニマムで作る
  • クローリング
    • htmlのリンクを見つける
  • スクレイピング
    • htmlから必要なものを見つける
  • jQueryでいいじゃん
    • jQuery無理やり埋め込んで要素取得
イライラしないクローラ
  • 静的クローラに慣れてると遅く感じる
  • Redisを使う
  • 複数のサーバでRedisを共有

分散環境を簡単に作りたい

  • 10並列くらいはないと実用的でない
  • ServerlessFW

ECMAScriptの使い方

ECMAScriptとは

  • EcmaInternationalという団体によって標準化されている
  • 2015からは毎年リリース
  • 2015以前は全ての合意されてから一括リリース
  • 2016以降は合意の取れたものからリリース

プロポーザルステージ

  • 4までは未完成
  • 4になるにはテストが必要

ECMAScriptを学ぶ

  • 仕様を学ぶ
  • 正しい使い方か調べる

アロー関数

  • thisをバインドするは仕様上正しくない
  • thisを持たないから一個上のスコープのthisを使う

Dynamic import あれこれ

imoprt

  • グローバルスコープでimportしないといけない
  • 実行時に全部imoportが確定していないといけない
  • 動的importの需要がある

DynamicImport

  • ES2017の新機能
  • 関数呼び出しスタイル
  • Promiseを返す
  • 名前付きだけdefaultはない

課題

  • moduleを差し替えたりするとnode再起動時にエラーでるタイミングがある

まとめ

  • クライアント側だと厳しいかも
  • サーバ側なら要件次第でいける

npm prepublish の現状と今後どう変わっていくかを調べてみた

npm script

  • preとかpostとかつけると実行前に動いてくれてリとか

npm republish

  • publishの前に実行するよと
  • prepublishがpublishする前だけに動くはずなのにそうじゃないときも動く
    • localでnpm installするとなぜか動く
  • 直に修正される

rxjs v6 について

  • berlysiaさん

v5からv6への変更点

  • ファイルサイズを小さくしたいという方針に変わった

pipeable operator

  • lodashのflow関数みたいなやつ

構造が変わった

  • deep imoprtできなくなった

まとめ

  • 仕様変わりまくってるから注視しておかないと

introduction to JAMStack

  • sotayamashitaさん(Locki)

JAMStack

  • 2016年くらいから海外ではやってきた？
  • 再利用可能なAPI及び事前にビルドされたマークアップで構成される最新のWeb開発アーキテクチャ
  • JAM
    • JS
    • API
    • Markup
  • git push -> CD -> CDNへデプロイ
  • より速い、高セキュリティ、スケーラブル、低コスト

背景

  • git
  • microservices
  • ES2015

構造

  • ブラウザ <=> クライアント & Micro Services <=> ビルドツール
  • CDN <=> Continuous Delivery <=> Git

事例

なぜ今JAMStack?

  • ネットワーク環境が整ってない国
  • 海外でマイナンバー的なやつのハックが起きているからセキュリティ重要視

まとめ

  • JAMStackとは
    • ブラウザからのリクエストとブラウザへのレスポンスは全てJS で行う
    • DB のクエリを叩くのではなくそれらを抽象化して API を叩くようにする
    • view はサーバのランタイムではなく、デプロイ前にビルドしておいて表示する際はただ表示するだけ
  • JAMStackのベストプラクティス
    • 静的ファイルは CDN にばらまく->ロード時間短縮
    • 動的部分は API で対応。
    • 必要なサービスのドメインで特化しているサービスがあればそこに責任を移譲する->セキュリティー強化