なつねこメモ

主にプログラミング関連のメモ帳 ♪(✿╹ヮ╹)ノ 書いてあるコードは自己責任でご自由にどうぞ。記事本文の無断転載は禁止です。

Contentful に Rich Text データを API 経由で登録したい

海外の大手 CMS に Contentful があるんですが、 API ドキュメントがびみょーに分かりにくいのでメモ。 例えば、ある Entry に対してデータを作成したい場合、こんな感じでリクエストを投げてね、とあります。 import { createClient, Environment } from "c…

React で子コンポーネントのテキストのみを取り出したい

React で children で渡ってきた子コンポーネントのうち、テキスト部分だけ取り出したいこと、ありますよね? そういうときに便利なのが React Children Utilities です。 こんな感じで使えます。 import Children from "react-children-utilities"; type Pr…

Cloudflare Pages に PNPM + Astro なウェブサイトをデプロイしたい

Cloudflare Pages の Web UI から、 PNPM + Astro なウェブサイトをデプロイするぞ! ということで、やり方のメモ。 やり方は、リポジトリを接続した後、以下のように設定すれば良い。 ビルドコマンド: # pnpm のインストールと、依存のインストール&ビル…

Mobile Safari がクラッシュした理由をもうちょっとだけ詳しく記録したい

iOS で WebView を使っている場合、何らかの理由で WebView のプロセスが死んだ場合は webViewWebContentProcessDidTerminate が呼ばれるんですが、原因が分からず、なんとも困った感じになります。 ということで、頑張ってなんでクラッシュしたのかの大まか…

Contentful JavaScript SDK を TypeScript で使いたい

いまさら JavaScript なんて書けるか!ということで、 Contentful JavaScript SDK を TypeScript で使います。 まずはライブラリのインストール: $ pnpm add contentful いれたあと、以下のようにライブラリを定義すると良い。 import contentful from "con…

Wasabi から Cloudflare R2 へ移行する

このたびアップロードよりダウンロードのほうが多いであろうファイルについて、 Cloudflare R2 へ移行したので、その方法のメモ。 ただし、 S3 を使っているなら公式のマイグレーションツールを使った方がおそらく良いので、そちらを使うべし。 まずは、 Was…

Visual Studio Code のわたしが使っている便利な拡張機能

たまにはちょっと気分転換として、わたしの開発環境の紹介でも書いてみようかな、という気分だったので、 普段わたしが使っているテキストエディターである、 Visual Studio Code に入れている拡張機能について紹介しようと思います。 Programming Language …

うさみみハリケーンで特定のメモリパターンを検索したい

わたしは趣味で Blender のアドオンを作っているのですが、そのときにうさみみハリケーンでメモリの状態を確認して、そこからアドオンを作る、ということをやっています。 そこで、特定のバイト列が存在するかどうかを調べたいことがあるのですが、ちょっと…

macaron で Media Query を使いたい

最近ゼロランタイム CSS-in-JS を触っていることがあるのですが、今回はラクスさんのブログで紹介していた macaron についての記事です。 macaron は、 styled-components などの CSS-in-JS とは異なり、ビルド時に静的な CSS を吐き出すいわゆるゼロランタ…

Vue3 でも React でいう useImperativeHandle をしたい

React で、子コンポーネントの関数を何らかの理由で呼び出したい場合、 useImperativeHandle を使います。 import React, { useImperativeHandle } from "react"; const SomeComponent = React.forwardRef((props, ref) => { useImperativeHandle(ref, () =>…

Vue3 の setup 構文でも named export をしたい

公式ドキュメントにちらっと書いてはいるけど、 script setup を使っていても、 named export したい! ということでやり方。 <script lang="ts" setup> type Colors = (typeof COLORS)[number]; type Props = { color: Colors; }; defineProps<Props>(); </script> <script lang="ts"> const COLORS = ["red", "…

pybind11 で C++ から Python クラスのインスタンスを作成したい

pybind11 は C++ と Python とで良い感じにやり取りができる C++ ライブラリです。 少し前の記事の記事でも紹介したとおり、わりと使いやすいライブラリです。 ただ、絶妙にドキュメントが足りなかったりして困るケースがあるので、今回はそれの補完用のメモ…

macOS で 1Password 経由で SSH したい

macOS で 1Password 経由で SSH 接続したかったのですが、うまく行かなかったのでメモ。 基本的なやり方は、公式ドキュメントを参照: SSH agent | 1Password Developer 設定後、 ssh -T git@github.com とするが、一向に繋がらない。 エラーとしては以下の…

Cloudflare Tunnels の再設定を行いたい

だいぶ前に Cloudflare Tunnels でやっていたのをプレビュー用に Localhost のサーバーをインターネットに公開する手順を書いたのですが、 その後再設定するときの手順。 ただし、その後 Cloudflare Tunnels の設定方法が変わってマイグレーションする必要が…

Google の PageSpeed Insights で全スコア100点を取る

趣味で取りました。 サイト構成としては以下の通り: Next.js TailwindCSS Vercel 基本キャッシュは Vercel がうまいことやってくれているので、 Next.js だけパフォーマンスなり変えていく感じになります。 で、やったこととしては以下の通り。 lang=ja の…

CMakeLists.txt で Visual Studio の PostEventBuild を指定したい

最近 Visual Studio 以外でも C++ プロジェクト触れると便利よねーということで、 CMakeLists.txt から C++ プロジェクトを生成していることが多いです。 ただ、そのとき、おそらく Visual Studio に依存していると思う Post Build Event についてどうすれば…

JavaScript で value が undefined な key を取り除いたオブジェクトがほしい

JavaScript で、例えば以下のようなオブジェクトがあったとして、 const obj = { a: false, b: undefined, c: 0, d: "", }; value が undefined なキー、つまりは今回の場合は b を除いた、以下のようなオブジェクトが欲しいケースがある。 const obj = { a:…

Lefthook の pre-push イベントでブランチ名を受け取る

Git

Lefthook という Git Hook をうまいこと管理してくれる Golang 製ツールがあります。 メリットとしては、 Node.js に依存しない、つまりはランタイムが必要ないことがあげられ、また設定も lefthook.yml を記述するだけなので、簡単に使えるという特徴があり…

PNPM で Unsupported environment (bad pnpm and/or Node.js version) と言われるのでなんとかしたい

最近 PNPM を使っているんですが、 node -v が v18.12.1 とかを返しているにもかかわらず、 Node 14 には対応してないよ!って言われる。 それの解決方法。 基本的には、このコメントにあるとおりの作業をすれば治る。 NPM is (still?) not correctly identi…

ASP.NET Core で SPA の Static File も認証で保護したい

C#

ASP.NET Core で UseSpa とかで SPA アプリケーションをホストできるんですが、例えば Staging 環境だったり、何らかの理由で特定ディレクトリ以下のアクセスを拒否したいケースがあります。 その場合、 Authorize 属性を通過しないので、自前で認証のチャレ…

Windows で Git のテストを実行する

なんとなく git/git をソースからビルドしてデバッグすることになりました。 そして PR (最終的にはメーリングリストになげる) を投げつけたのですが、 CI が落ちてつらい。ドキュメントに無かったぞ。 ということで、 Windows で git のテストを実行する方…

Windows で Git をソースコードからビルドしてデバッグする

なんとなく git/git をソースからビルドしてデバッグすることになりました。 README や Wiki が古かったりして、結構詰まったので、やり方。 まず、 Visual Studio 2022 (or 2019) で、 git/git をクローンした場所をフォルダーとして開きます。 開くと、「C…

ts-node で実行時に baseUrl と paths も考慮して欲しい

Next.js とか使ってると、 tsconfig.json を良い感じに設定してくれてて、実質ルートディレクトリからの相対パスでモジュールをインポートできて便利です。 ただ、 ts-node で実行しようとするとコケるので、コケないようにするやり方。 といっても方法は簡…

.env を 1Password で運用したい

.env みたいなのをいっぱい作りたくなかったり、良い感じにしたいので、 1Password に管理を任せてしまおう、という記事。 1Password には、開発者向けのツールとして、 1Password CLI が提供されています。 その CLI の機能に、環境変数を定義した .env を…

ts-node で ESM Native な感じに実行したい

TypeScript を直接実行できる ts-node 便利ですよね。 ところで、最近 (ってほどでもないですが) Node.js 界隈 ESM へ移行する流れがあります。 Node.js 界隈で多くの OSS をリリースしておられる Sindre さんのパッケージも、多くが ESM Native になってお…

Git でとあるディレクトリ以下の履歴を引き継いだ状態で新しいリポジトリに切り出したい

Git

例えば、何らかの理由でリポジトリのこのディレクトリ以下の部分だけ別リポジトリで管理したいな~!って場合のやり方。 履歴を引き継がなくてもいい場合はそのまま新しいリポジトリがある場所にコピーすれば良いんだけど、履歴も引き継ぎたい場合。 やり方…

GitHub Actions で自前の LFS サーバーに向いているアセットもチェックアウトしたい

年末に何してるんっていう話なんですが、わたしは過去の記事にもあるように、 Git LFS サーバーを自前運用しています。 そこで困るのが、 GitHub Actions で with.lfs: true とした場合の挙動です。 通常の GitHub にすべてを任せているときと同じ感じでやる…

Blender アドオンで C++ で記述した DLL をロード・アンロードしたい

Blender アドオン作るときの小ネタ。 例えば、 Python では性能上厳しかったり、何らかの理由で Python から触れない何かを触りたい場合、 C++ で Blender のアドオンを書きたいケースがあります。 そういったことをやりたいときの方法をメモしておきます。 …

Blender アドオンの Operator に定義したメソッドを、プロパティを設定して呼び出したい

Blender アドオン作るときの小ネタ。 Blender アドオンを作っていて、何らかの処理をさせたい場合、通常は Operator を使用します。 import bpy from bpy.types import Context, Event, Operator from bpy.props import StringProperty class SomeOperator(O…

DirectX のテクスチャーを Bitmap として取り出したい

いつもは Unity みたいな高レイヤーですが、今回は比較的低レイヤーのお話です。 基本的に、最近の場合は DirectX を直に触るケースは少なくなってて、例えば Unity や Unreal Engine 等のような、ゲームエンジンを触ることがほとんどだと思います。 ただ、…