Edited at

OctopusというFirebaseのRealtime Databaseで動くMarkdown WikiをDeployしてみた

4ohlZk5eTY.gif


背景

Firebaseで動くMakdownなWikiでTech的なアウトプットをする試みです。


お試しになりたい方向け


Octopusについて

以下RepositoryをCloneしてBuildしてDeployしてください。


Requirements


  1. npm

  2. node.js

  3. Googleアカウント & Firebase


基本的なHowto


  1. Firebaseプロジェクト作成(ググって)


    1. Authenticationから必要に応じた認証方法を設定しておく。(自分はGoogleだけ)

    2. DatabaseをRealtime Databaseとして作成しルールを設定しておく。(Realtime Database設定参照されたし)



  2. git clone git@github.com:livechat/octopus.git

  3. cp src/config/config.template.js src/config/config.js


  4. vim rc/config/config.js で1で作成したFirebaseのプロジェクトのconfig情報をコピペ


    1. image



  5. npm install --build-from-source

  6. npm run build


Firebase HostingにDeploy1


  1. firebase-toolsをインストールしてない人はインストール


    1. npm install -g firebase-tools


    2. firebase loginしてBrowser認証する

    3. cd /path/to/project




  2. firebase initしてhostingSpaceでチェックを入れてEnterする


    1. 対象ディレクトリはbuildにする(デフォルトはhome)




早速ハマったポイント


Mac OSXでDeployするとgRPC関連でnpm installが失敗する

対応方法 = Mac OSXじゃなくてLinuxでnpm install --build-from-sourceする。

ググったらこんなIssueが出てくる。Node.jsのv11.x固有の問題っぽい?

- gRPC sporadically doesn't build properly under node 11. · Issue #594 · grpc/grpc-node


Realtime Database設定

自分の場合はreadwrite共に自分のドメイン(G Suite)に限定しました。

{

"rules": {
".read": "auth.token.email.endsWith('@tokifu.jp')",
".write": "auth.token.email.endsWith('@tokifu.jp')"
}
}


まとめ

SFSG:smile:





  1. Netlify使うと良いよ的な事がREADMEに書いてあるんだけど、Firebase Hostingも速いらしいのでとりあえず試してみる。