#js
Firebase Functions呼び出し時に Error: function terminated. が発生した場合
firebase functions:logで詳細を確認できる
jsで数値を0埋め(ゼロパディング)して表示する
padStartを使った
Next.jsでログイン必須ページにアクセスした際にブラウザバックで前のページに戻れない
router.replace('/login')を使うようにした
Next.jsで「使用していないJavaScriptの削除」に別pageのjsが含まれている場合
next/Linkのprefetch設定を確認
react-hook-formとReact Datepickerを組み合わせる
Hook FormのControllerを使う
Cloud FunctionsのNode.jsバージョンを更新する
package.jsonとcloudbuild.yamlを更新
dayjsで秒数を時間表記に変換する
duration pluginを使う
ESLintでimport文を自動で並べ替える
eslint-plugin-simple-import-sortを使う
マネージメントコンソール上のエディタでLambdaのコードを書く際にnpmライブラリを追加したい
ローカルでライブラリをインストールしてからインポートする必要があった
Firebase Local Emulatorでfunctions:config:setによる環境変数を利用したい場合
.runtimeconfig.jsonを使用する
JestでFirestoreセキュリティルールのテストを書く
Github ActionsでCIを回せるようになった
CDKで作ったLambda@Edgeのコードに環境変数を渡せるようにする
esbuild defineを使う
「Unit testing security rules with the Firebase Emulator Suite」でセキュリティルールのtestを学ぶ
ローカルでセキュリティルールのtestができるようになったのはありがたい
Contentfulで管理しているブログ記事を一括更新する
Content Management APIを使う
Firebase Auth Googleログイン時のリダイレクトドメインを変更する
CNAME追加とHostingの「カスタムドメインを追加」を行う
jsで配列からランダムにn件取得する
lodashのsampleSizeを使った
jsで連番の配列を作成する
Array.from(Array(n).keys())
VercelのPreview環境に固定のサブドメインを割り当てる
X-Robots-Tagは付与されないので注意
Firebase FunctionsでPuppeteerを動かす
特別な設定なしで動かせた
Next.jsで動的にsitemap.xmlを生成する
getServerSideProps内でxmlを生成した
React Testing Libraryを使ってNext.jsアプリのテストを書く
可能な限りgetByRoleを使うようにする
Next.jsアプリの権限管理にCASLを使う
jsで柔軟な権限管理を行う場合はCASLが便利だった
Next.jsプロジェクトにGoogle Analyticsを導入する
公式サンプルを参考にしつつ、Typescript用に一部調整する必要があったので対応
Value for argument "dataOrField" is not a valid Firestore value. Cannot use "undefined" as a Firestore value
デフォルト設定だとundefinedをFirestoreに保存しようとするとエラーが発生する
Next.js + Prism.jsでコードのSyntax Highlightをする
highlight.jsから軽量のPrism.jsに移行
Cloud Functions for FirebaseでStripeのWebhook Endpointを作る
onRequestでHTTP requestを受け取れるようにする
spawnSync /bin/sh ENOBUFS
第二引数に{ stdio: 'ignore' }を追加しログ出力を無効化した
Contentfulの記事をAlgoliaのインデックスに登録する
Contetful Webhookの変換Helperが便利
Next.jsで作っていたAPIをFastifyに移行
VercelからDBにアクセスするとToo Many Connectionsエラーになったため
Next.js + react-toastifyでページ遷移時にもトースト表示を維持する
ToastContainerをCustom Appに配置する
npm trends
ライブラリ選定に役立つ
fastifyのLifecycle
公式ドキュメントを読もう