くらげになりたい。

くらげのようにふわふわ生きたい日曜プログラマなブログ。趣味の備忘録です。

GitHub CLIでIssueのラベルをクローンする

新しいリポジトリを作ったときに、Issueのラベルを設定するのが、 めんどくさいなと思ったら便利なのがあったので、 その時の備忘録。 GitHubのCLIツールがあるらしい(*´ω`*) cli/cli: GitHub’s official command line tool list: 一覧表示 まずは一覧表示…

Cloudflareとキャッシュ

キャッシュ機能を実装するときに、いろいろ調べたので、 その時の備忘録。 Cache-Controlのディレクティブ 標準的なディレクティブは以下の通り。MDNから引用。 ・Cache-Control - HTTP | MDN リクエスト レスポンス max-age max-age max-stale - min-fresh …

個人開発報告: 月例振り返り&開発予定 (2022年6月)

6月の振り返り、今月の開発予定です(*´ω`*) 前回はこちら(*´ω`*) www.memory-lovers.blog やったこと 今月はたくさんアップデートできた(*´ω`*) \6月のアップデートまとめ/6月のアップデート内容はこちら✅読み込み開始位置が変更可能に✅空文字で絞り込…

リングフィットをはじめたら、10キロやせた

在宅の仕事なので、慢性的に運動不足だったけど、 リングフィットはじめたら、10キロくらいやせたので、 なにしてたかをまとめてみました(*´ω`*) これまでの筋肉への課金額は、64,237円です(*´ω`*) まとめ 3ヶ月で生活がガラッと変わった(*´ω`*) 今の生活…

CDNのパージとかを調べてみたまとめ(Cloudflare/Cloud CDN/Fastly)

CDNを使ってキャッシュを活用したいなと思い、 いろいろ調べたときの備忘録。 調べたのは、Cloudflare/Cloud CDN/Fastlyの3種類。 まとめ Cloudflare 無料でも利用できる 単一URLのパージのみ 柔軟なパージはEnterpriseプランのみ Cloud CDN 価格が安く、前…

gcloudのconfigurationsで設定を保存する

gcloudのアカウントとかプロジェクトとか設定変更がめんどうだな。。 と思っていたら、設定に名前をつけて保存できる機能があった(*´ω`*) いつものやりかた # 現在の設定 $ gcloud info # ログイン済みアカウントの一覧 $ gcloud auth list # プロジェクト…

Cloud Build+Cloud Runでできた不要なContainer Registryを自動削除する(gcr-cleaner)

前回の続き。Cloud Build+Cloud Runで作られた不要なイメージを削除してくれる gcr-cleanerを試してみたときの備忘録。 github.com とりあえず、gcloudをアップデート。 $ gcloud components update 設定の流れ READMEに書いてある流れ。 Google APIの有効化…

複数のアカウントでFirebase CLIを使えるようにする(firebase-toolsのv9.9.0〜)

以前、firebase-multiを使った記事を書いたけど、 いつのまにかFirebase CLIの標準機能に入っていた(*´ω`*) Release v9.9.0 · firebase/firebase-tools こっちのドキュメントには書いてないけど、 ・Firebase CLI reference | Firebase Documentation GitHu…

TypeScriptのPromiseでretryしたい(async-retry/node-retry)

TypeScriptのPromiseでretryしたいなと思って、 いろいろ調べたときの備忘録。 vercelが公開してるasync-retryがよさそう。 ・vercel/async-retry: Retrying made simple, easy and async 中身は60行ほどで、node-retryを使っている感じ。 ・tim-kos/node-re…

Cloud Functions for FirebaseとContainer RegistryとCloud Storage

Cloud Functions for FirebaseとContainer RegistryとCloud Storage ストレージの使用量がやたら多いので色々調べてみたときの備忘録。 Container Registryをきれいにしたらかなり下がった(*´ω`*) 各バケットの用途 見てみると、色んなバケットが利用されて…

Firestoreのセキュリティルールでuid以外を利用する(email/email_verified/etc..)

Firestoreのセキュリティルールで、 emailなどのUID以外を利用したいと思ったときに、 調べたときの備忘録。 request.auth.token.*を使えばOKっぽい。 使い方 こんな感じ。 service cloud.firestore { match /databases/{database}/documents { function isE…

Nuxt3/Vue3: Composition APIでのテンプレート参照(`$refs`)

Nuxt3で$refsを使うと思ったら、うまくいかなかった。。 Composition APIで$refsは使えないらしい。。 Composition APIでのテンプレート参照したいときは、 refと同じ変数をRefを使って用意すればよいらしい。 テンプレート参照 | Vue.js <script setup> const myCoolDiv =</script>…

Nuxt3でvue pluginを適用する

Nuxt3になってvueのプラグインを使う形もちょっと変わった。 ドキュメントだとこのあたり。 Nuxt 3 - Plugins directory 使い方 公式ドキュメントのサンプルより。 yarn add --dev vue-gtag-next // plugins/vue-gtag.client.js import VueGtag from 'vue-gt…

Nuxt3のComposablesとuseStateと状態管理

Nuxt3をいろいろ試していたときの備忘録。 Vuexが含まれなくなり、ComposablesやuseStateの登場で、 大きく変わっている印象。 composablesディレクトリとは? auto-importしてくれるディレクトリのひとつ Nuxt 3 - Composables directory Composablesな関数…

Nuxt3でSFCのsetup(Reactivity API/Composition API)

Vue3で登場したComposition APIがNuxt3のデフォルトっぽい。 ただだいぶ書き方が変わったのでそのあたりを調べたときの備忘録。 なぜComposition APIなのか? | Vue.js Vue2からある書き方は、Options API。 <script setup>構文 新しく増えた<script setup>はこんな感じ。 SFC内でComposi…

個人開発報告: 月例振り返り&開発予定 (2022年5月)

5月の振り返り、今月の開発予定です(*´ω`*) 前回はこちら(*´ω`*) www.memory-lovers.blog やったこと 今月はたくさんアップデートできた(*´ω`*) ■SSSAPI - 自動更新の更新の改善 - 一括更新機能 - Webhook通知機能 - 年払いのプランの追加 ・お知らせ We…

Nuxt3でaxiosはなくなり、Fetch APIをつかうらしい

Nuxt3でAPIを呼び出したいなと思ったら、axiosを使わなくなったらしい。 Nuxt 2 to Nuxt 3: Component Options 今後はFetch APIか、unjs/ohmyfetchの$fetchを使う形になる。 axiosの場合、開発中などでCORS問題があったりして、 axios-proxyが必要だったけど…

Markdownで書いたメール本文をSendGridで送信する

SendGridを使ってメールを送ってるけど、 Dynamic Templateで、長文を送るのがめんどくさい。。 本文はMarkdownでかければなーと思い、 いろいろ調べたときの備忘録。 まとめ 流れとしてはこんな感じ。 Dynamic Templateでベース部分を作成 Markdownで書いた…

TypeScriptのESMでハマる

markdownからhtmlに変換したいなーと思い、 micromarkを使おうとしたら、 ES Modulesでかなりハマったので、その時の備忘録。 はじまり 今まで使っていたらちょっとしたツールのプロジェクトに、 micromarkをインストールしたら、こんなエラーが。。 $ npx t…

Nuxt3 x Tailwindでの立ち上げを楽にする(daisyUI/Headless UI)

いままでNuxt x Buefy(Bulma)で開発をしていたけど、 いろんなつらみが出てきた。。 なので、Nuxt3 x Tailwindでいい感じにできないか、 調査してみたときの備忘録。 いろんなつらみ 用意されているもの以外のカスタマイズがつらい Bulmaとnuxt/contentsなど…

bashにgitのブランチ名を表示する

bashのプロンプトにgitのブランチ名を表示したいな と思って、調べたときの備忘録。 昔調べた気がするけど、下記忘れてた。。 環境はMBP。 やりかた こんな感じで、PS1の環境絵変数を設定する。 # ~/.bashrc source /Library/Developer/CommandLineTools/usr…

Firestoreの読み込み回数をCloud Loggingから計測する

Firestoreの読み込み回数が予想よりも多かったので、 どこでそんなに呼ばれてるのかな?といろいろ調べてみたときの備忘録。 呼び出し箇所は、以下の3種類 Webブラウザのクライアントライブラリ サーバのFirebase Admin SDK Cloud Functions内のAdmin SDK Fi…

Flutterで通信状況の情報を取得する(connectivity_plus/network_info_plus)

Flutterでネットワーク周りの情報を取得したいなと思ったときに、 いろいろ調べたときの備忘録。 取得したい情報によってパッケージが違うっぽい。 インターネットへの接続状況 ... connectivity_plus Wifiなどの情報 ... network_info_plus connectivity_pl…

nanoidでランダムな文字列を生成する

IDやパスワードなど、ランダムな文字列を生成したいなと思ったので、 いろいろ調べてみたときの備忘録。 nanoidが便利そうだった(*´ω`*) 型定義もあるので、TypeScriptでも使いやすい インストール $ npm i nanoid 使い方 import { customAlphabet } from '…

Flutterで日付をフォーマットする(intl)

Flutterで日付をフォーマットしたいなと思ったら、 パッケージが必要だった...ので、いろいろ調べたときの備忘録。 intl | Dart Package インストール $ flutter pub add intl $ flutter pub get 使い方 import 'package:intl/intl.dart'; DateTime now = Da…

Flutterでパッケージ情報取得(package_info_plus)

Flutterでの開発メモ。 バージョンなどの情報はpackage_info_plusを使うと良いらしい。 ・package_info_plus | Flutter Package インストール $ flutter pub add package_info_plus $ flutter pub get 使い方 公式ドキュメントから引用。 import 'package:pa…

FlutterでSharedPreferences(shared_preferences)

Flutterの備忘録。SharedPreferencesを使いたいときは、 shared_preferencesを使うらしい。 ・ shared_preferences | Flutter Package インストール $ flutter pub add shared_preferences $ flutter pub get 使い方 // instanceの取得 final prefs = await …

GitHub ActionsをAPIで起動する(repository_dispatch)

開発しているWebサービスでGitHub Actions連携したいな と思ったときに、いろいろ調べたときの備忘録。 GitHubの公式ドキュメントだとこのあたり。 repository_dispatch | ワークフローをトリガーするイベント - GitHub Docs Create a repository dispatch e…

Google Drive APIで隠し制限のsubscriptionRateLimitExceededエラーがでた

開発しているWebサービスで、Google Drive APIの 変更通知機能を使っていたら、 POST https://www.googleapis.com/drive/v3/files/fileId/watch { "error": { "errors": [ { "domain": "global", "reason": "subscriptionRateLimitExceeded", "message": "Ra…

ピンタレストっぽいレイアウトをCSS Gridで実装する

css

ピンタレストっぽい、高さが違う要素をきれいに並べる方法を探してたら、 GridLayoutで簡易的できるっぽかったので、いろいろ調べたときの備忘録。 このサンプルがわかりやすかった(*´ω`*) ・Masonry style layout with CSS Grid | by Andy Barefoot | Medi…