プログラムメモ

KUSANAGI で php-fpm を pm = ondemand にして空きメモリを増やす

Wed, 08 Jul 2026 17:49:08 +0900

``` vi /etc/opt/kusanagi/php-fpm.d/www.conf ``` 次のように修正します。 ``` pm = dynamic ``` 　↓ ``` pm = ondemand ``` ``` /opt/kusanagi/php/sbin/php-fpm -t ``` ``` sudo reboot ```

正規表現の先読みと後読み

Tue, 07 Jul 2026 10:37:34 +0900

https://techracho.bpsinc.jp/hachi8833/2021_04_08/63564

MacBookをできるだけスリープさせないようにするコマンド caffeinate

Mon, 06 Jul 2026 19:28:55 +0900

`caffeinate` は、**Macをスリープさせないためのコマンド**です # ● MacBookをできるだけスリープさせないようにするコマンド ```bash caffeinate -dimsu ``` このコマンドは**ほぼすべてのスリープを防ぐ**設定になっています。各オプションを説明すると次のようになります。 | オプション | 意味 | | ----- | ------------------------------------ | | `-d` | ディスプレイのスリープを防ぐ | | `-i` | システムのアイドルスリープを防ぐ | | `-m` | ディスクのスリープを防ぐ...

Cloud Flare 設定しておくと良いWAF

Mon, 06 Jul 2026 11:52:14 +0900

### 1. DDoS Protection（最優先・自動有効） ``` ・大量アクセスによる攻撃を自動検知して緩和・L3/L4（TCP/UDP）および L7（HTTP）攻撃を保護 ``` ### 2. Bot Fight Mode ``` ・既知の悪質ボットを検出・計算コストの高いチャレンジを課す・クローラーやスクレイパーを減らす ``` ### 3. Super Bot Fight Mode（Pro 以上なら強く推奨） **Pro / Business / EnterpriseBot Fight Mode の上位版です** 有料プランなら、まず Bot Fight Mode ではなくこちらを使うのがおすすめです。 ### 4. WAF Managed Rules（非常に重要）プラン: Pro 以上これが本格的な Web...

tmux の AI対応進化版 herdr

Fri, 03 Jul 2026 12:03:08 +0900

# ● herdrのインストール ``` curl -fsSL https://herdr.dev/install.sh | sh ``` # ● herderの設定をする ``` code ~/.config/herdr/config.toml ```

Gmail以外の既存メールアドレスでGoogleアカウントを作成する

Wed, 01 Jul 2026 08:48:10 +0900

# ● Gmail以外の既存メールアドレスでGoogleアカウントを作成する Gmail以外の既存メールアドレスでもGoogleアカウントは作成できます（accounts.google.com の「アカウントを作成」→「自分用」→既存のメールアドレスを入力）。これでsupport@mobilefv.comがGoogleアカウントになります。その後、Google Cloud ConsoleでこのGoogleアカウントを今回のGCPプロジェクトのオーナーまたは編集者として招待（IAMで追加）すれば、OAuth同意画面の「ユーザーサポートメール」のドロップダウンに表示されるようになります。

playwright の parallel 実行について整理する。

Tue, 30 Jun 2026 17:54:16 +0900

Playwrightの並列実行には以下の4つのレベルがあります。 [1](#3-0) --- ## 並列実行の種類 ### 1. ファイル間の並列実行（デフォルト） **デフォルトの動作**: 異なるテストファイルが異なるワーカープロセスで並列実行されます。 - 単一ファイル内のテストは順次実行されます - 複数のファイルが同時に実行されます ### 2. プロジェクト間の並列実行 **複数プロジェクトの並列実行**: 異なるプロジェクト（ブラウザ設定）が並列実行されます。 ...

pnpm の無駄なファイルを削除する

Tue, 30 Jun 2026 16:43:40 +0900

まずはストアの容量を確認する。 1. まず pnpm のストアの場所を確認 ``` pnpm store path ``` 例えば ``` /Users/yourname/Library/pnpm/store/v10 ``` ここのディレクトリに移動して、ncduなどで容量を確認します。 ``` cd /Users/yourname/Library/pnpm/store ncdu ``` バージョンごとに容量が表示されるはずです。この時、使っていないバージョンのストアがあれば削除してOKです。

Cloud Flare の Amazon AWS S3互換のあるオブジェクトストレージ「Cloudflare R2」

Mon, 29 Jun 2026 14:27:26 +0900

# ● Cloudflare R2 https://www.cloudflare.com/ja-jp/developer-platform/products/r2/ 例えばLaravelのようなフレームワークで使う場合は、設定を S3 から R2 に変えるだけで、いとも簡単に使えてしまいます。

Claude Code のサブエージェント

Fri, 12 Jun 2026 14:20:18 +0900

# ● Claude Code のサブエージェント Claude Code には組み込みサブエージェントが3種類あり、役割が分かれています： - Explore：コードベースの検索と分析に最適化された高速な読み取り専用エージェント。調査専門でコードは書けません。（モデルは Haiku） - Plan：プランモード中にプランを提示する前のコンテキスト収集に使われる研究エージェント。こちらも読み取り専用。 - general-purpose：探索と実行の両方を必要とする複雑なマルチステップタスク向けのエージェント。モデルはメイン会話から継承し、すべてのツールにアクセスできます。

TypeScriptのパフォーマンスを上げる

Thu, 11 Jun 2026 13:03:48 +0900

# TypeScript Performance ガイド https://github.com/microsoft/TypeScript/wiki/Performance # 概要このページは、**TypeScript のコンパイル速度や VS Code の型チェック速度が遅い場合の改善方法**をまとめた公式ドキュメントです。 Microsoft が最初に強調しているのは、 > 「まずはコードや設定を改善するだけで大きく高速化できる」という点です。また現在は TypeScript 本体を Go に移植した **TypeScript 7.0（TypeScript Go）** の開発も進んでおり、ケースによっては最大 10 倍程度高速になると説明されています。 # まず押さえるべき重要ポイント ## 1. interface を優先し、巨大な...

Promise.all の最大数をワーカープールで制限する

Wed, 10 Jun 2026 15:27:29 +0900

``` npm install p-limit ``` ```ts import pLimit from 'p-limit'; const limit = pLimit(4); const tasks = urls.map((url) => limit(async () => { return fetch(url).then((r) => r.json()); }), ); const results = await Promise.all(tasks); ```

Goenv の代わりに mise で Go のバージョンを管理する。

Tue, 09 Jun 2026 10:34:08 +0900

一旦もともと入っている Go 言語を削除します。 ## ・HomebrewでインストールしたGoの削除 Homebrew経由でインストールされている複数のGoバージョンをすべて強制削除します。 ``` brew uninstall --force go ``` ## ・直接インストールしたGo（公式パッケージ版）の削除公式のインストーラーで入れたGoの実体と、システムがPATHを通すために作成したファイルを削除します。 **Goの実体ディレクトリを削除**...

Goのジェネリクス

Tue, 09 Jun 2026 09:28:42 +0900

#Go の interface{} → any Go 1.18 でジェネリックス（Generics）が導入され、それに合わせて `any` が追加された。 `any` は新しい型ではなく、`interface{}` のエイリアスである。 ```go type any = interface{} ``` そのため、以下は完全に同じ意味になる。 ```go map[string]interface{} ``` ```go map[string]any ``` 現在は Go の公式コードやコミュニティでも `any` が推奨されることが多く、モダンな Go コードでは `interface{}` より `any` がよく使われるので、覚えておきましょう。

SSHで接続した先のサーバーのグローバルIPアドレスを、IPv4とIPv6で取得する。

Tue, 02 Jun 2026 10:27:11 +0900

# ● サーバーのグローバルIPアドレスを、IPv4で取得する。 ``` curl -4 ifconfig.io ``` # ● サーバーのグローバルIPアドレスを、IPv6で取得する。 ``` curl -6 ifconfig.io ```

git 現在のブランチ名を調査する

Wed, 20 May 2026 15:26:26 +0900

現在のローカルブランチが追跡しているリモートブランチを調べる ``` git rev-parse --abbrev-ref @{u} ``` 現在ローカルでチェックアウトしているブランチ名を表示する ``` git symbolic-ref --short HEAD ``` このリポジトリのメインのブランチ名を master または main で返す。2つ存在する場合はエラーを返す。 ```sh git branch --format '%(refname:short)' | grep -E '^(main|master)$' | { branches=$(cat); count=$(echo "$branches" | wc -l | tr -d ' '); [ "$count" -gt 1 ] && echo "Error: main と master...

biome より高速、設定が楽、oxlint , oxfmt

Wed, 24 Jun 2026 11:54:17 +0900

# ● oxlint ### ・oxlsintのインストール ``` npm i -D oxlint ``` ### ・oxlintを実行する ``` # ソースコードチェックのみ npx oxlint . # 自動修正 oxlint --fix . ``` **対象となるファイルが0件の時でもエラーとしない** ``` oxlint --fix --no-error-on-unmatched-pattern . ``` > --no-error-on-unmatched-pattern は、対象となるファイルが選択されなかった（マッチしなかった）場合に > oxlint がエラー終了（終了コード > 0）するのを防ぐCLIオプションです package.json にコマンドを記述しておきます。 ``` "scripts": { "lint":...

pnpm で [ERR_PNPM_MISSING_TIME] The metadata of XXXXX is missing the "time" field エラーが出る場合の対応

Thu, 14 May 2026 09:19:57 +0900

キャッシュが問題であることが多い。一旦キャッシュを削除しましょう。 ```sh # 削除前にストア全体のサイズを調べる du -sh "$(pnpm store path)" # 未使用のハードリンクを削除 pnpm store prune # 再度、ストア全体のサイズを調べて、差分を見る。 du -sh "$(pnpm store path)" ```

Next.js DevTools MCP

Tue, 28 Apr 2026 16:03:10 +0900

# ● Next.js 16 の DevTools MCP Next.js DevTools MCP（パッケージ名：next-devtools-mcp）は、Next.js開発を効率化するbridge MCPサーバーです。 Next.js 16のビルトインMCPエンドポイント（/_next/mcp）と、Cursor/ClaudeなどのMCPクライアントを繋ぎ、ランタイム診断（エラー/ログ取得）、アップグレード支援、ブラウザ自動化を提供します。 # ● Next.js DevTools MCPの設定 Next.js DevTools MCPの設定は、プロジェクトルートに.mcp.jsonを作成するだけです。 ``` { "mcpServers": { "next-devtools": { "command": "npx",...

Cloud Flare で nextjs server actions を全て遮断する

Thu, 23 Apr 2026 19:08:13 +0900

# ● Cloud Flare で nextjs server actions を全て遮断する ###・WAFを設定する ``` Security → Security Rules から Create Rules → Custom Rule ``` ルールの設定内容 ``` ・Rule name : Block Next.js Server Actions ・設定 Field: Header Operator: exists Value: next-action ・Choose Action : Block ```

Cloud Flare で botを全て遮断する Bot fight mode をオンにする

Thu, 23 Apr 2026 18:36:41 +0900

# ● Cloud Flare で botを全て遮断する Bot fight mode をオンにするこちらのメニューから Bot Fight Mode をオンにします。 ``` Security → Settings → Bot fight mode ``` 注意点 : OGP 画像などを出力している場合は、Twitterなどのアクセスも遮断することになるので、うまくOGPが取得されなくなってしまうようです。その場合は、こちらの対策をすると良いようです。 ↓ 参考 : https://zenn.dev/ausssxi/articles/62aa7324d189c3

EC2 の next.js サーバを CloudWatch !!!

Wed, 22 Apr 2026 16:47:28 +0900

## EC2のNext.jsサーバーをCloudWatchで監視する方法 ### 1. 設定方法 #### Step 1: すでにEC2インスタンスに付いているロールを探して、そのロールに追加でアタッチします。 ``` 1. ロールに移動して「許可を追加」ボタンをクリックします。 2 .「CloudWatchAgentServerPolicy」を検索して追加します。 ``` #### Step 2: CloudWatch Agentのインストール（Amazon Linux 2 / AL2023） ```bash sudo yum install -y amazon-cloudwatch-agent ``` ↑ エラーが出る時はこちらのコマンドでインストールできます： ```sh wget...

KUSANAGI の WAF

Wed, 22 Apr 2026 12:05:29 +0900

KUSANAGI CLIで簡単に制御可能です # ● KUSANAGI 9 で WAF の設定を確認する / on , off する ``` # 状態確認 kusanagi status # 有効化： kusanagi waf on # 無効化 kusanagi waf off ``` # ● KUSANAGI 8 で WAF の設定を確認する / on , off する ``` # 状態確認 kusanagi waf status # 有効化： kusanagi waf on # 無効化 kusanagi waf off ```

Gitのマージコンフリクトを事前に知る git merge-tree

Tue, 14 Apr 2026 13:15:34 +0900

# git merge-tree でマージコンフリクトを事前に検知する ## git merge-tree とは `git merge-tree` は、**ワーキングツリーやインデックスを一切変更せずに、マージ結果をシミュレートするコマンド**です。通常、マージコンフリクトを確認するには実際に `git merge` を実行する必要がありますが、`git merge-tree` を使えばブランチを切り替えることなく、コンフリクトの有無だけを確認できます。 ```bash git merge-tree --write-tree <マージ先ブランチ> <マージ元ブランチ> ``` > `--write-tree` オプションは Git 2.38（2022年10月）以降で利用可能です。 --- ## 出力の読み方 ### コンフリクトなし...

claude code 便利コマンド

Thu, 23 Apr 2026 17:16:59 +0900

# ● claude code 便利コマンド ### claude code のバーの色を赤色にする「/color」 ``` /color red ``` ### claude code ののセッションに適した名前を自動的につけてもらう「/rename」 ``` /rename ``` なお、バーの色やセッション名などは、再度次のコマンドで読み直したときにも反映されているので、タスクの種類ごとに分けておくといいと思います。 ### claude code ののセッションに適した名前を自動的につけてもらう「/resume」「起動時に claude -r」 ``` /resume ``` その他、関連コマンドとしては以下のようなものもあります： - /history — 現在のセッション内のメッセージ履歴を表示 - /clear —...

サプライチェーンから守るための npm , pnpm 設定

Thu, 21 May 2026 09:05:54 +0900

# ● 1 . npm設定自身のホームフォルダ以下の .npmrc ファイルに、以下の設定を行います。 ``` vi ~/.npmrc ``` ``` # 7日経過したnpmパッケージしかインストールさせない。 min-release-age=7 ``` # ● 2 . 自分自身のプロジェクト内の .npmrc に以下を設定します。 ``` cd <プロジェクトフォルダ> vi .npmrc ``` ``` # 7日経過したnpmパッケージしかインストールさせない。 min-release-age=7 # ^1.2.3 のような範囲指定バージョンを使わず1.2.3 のように正確なバージョンで保存 save-exact=true # postinstall など、スクリプトを実行させない ignore-scripts=true ``` #### pnpmでの設定...

nvm で nodejs のバージョンを管理する

Thu, 09 Jul 2026 10:33:36 +0900

### 1. nvm をインストールするまず nvm をインストールします（sudo なしでユーザー領域にインストールするのが推奨） ```bash # 必要な依存をインストール（最小構成） sudo yum install -y git bash curl # nvm の install.sh を実行 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash ``` コマンド実行後、`nvm` コマンドが使えるようにシェルを再読み込みします。 ```bash source ~/.bashrc ``` 確認： ```bash nvm --version ``` ### 2. 必要な Node.js バージョンをインストール ```sh nvm...

unixのシェル( bash )の便利な設定(1文字ショートカットとヒストリ)。gitブランチ表示

Mon, 30 Mar 2026 16:40:13 +0900

#● lsコマンドを短縮する unixシェルで一番よく使うコマンドの代表格といえば ``` ls -la ``` だと思います。これを短縮して ``` l [Enter] ``` で実行できると便利なので以下のようにbash のエイリアスを設定します。ホームディレクトリ内の .bash_profile または .bashrc に記述 ``` # alias alias ll='ls -la' alias l='ls -laF' alias c='cd' alias h='history' alias gr='grep' alias hg='history | grep ' alias g='git' alias d='docker' alias dc='docker-compose' alias tf='terraform' alias r='rsub '...

XSERVER VPS 運用

Mon, 30 Mar 2026 15:47:54 +0900

# ● apt の upgrade ``` sudo apt update sudo apt full-upgrade sudo apt autoremove -y ```

Claude ベストプラクティス

Wed, 25 Mar 2026 18:48:20 +0900

# ● /model opusplan ``` /model opusplan ``` プランモードの時だけ Opus を使ってくれる # ● settings.json の sandbox **settings.json** ``` "sandbox": { "enabled": true, "allowUnsandboxedCommands": false }, ``` # ● Plan のフォルダーを相対パスにする **settings.json** ``` "plansDirectory": "./plans", ``` # ● settings.json の autoモード #### A. 起動時に指定する場合 ``` claude —permission-mode auto ``` .bash_profile や...

AIに細かく質問してもらう skill

Wed, 25 Mar 2026 08:57:44 +0900

https://www.aihero.dev/my-grill-me-skill-has-gone-viral **.claude/skills/grill-me/SKILL.md** ``` --- name: grill-me description: Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me". --- Interview me relentlessly...

Github の Self-hosted Runner

Mon, 23 Mar 2026 17:14:58 +0900

# ● Github の Self-hosted Runner の仕組み - 自分で用意したマシン上で GitHub Actions のジョブを実行するためのエージェントバイナリ（runsvc.sh / run.sh など）を常駐させておく。 - ランナーは GitHub へのアウトバウンド HTTPS（基本 443）で接続し、ポーリングで「ジョブはあるか？」を定期的に問い合わせる。 - ジョブ実行中は、GitHub-hosted と同様に、ステップごとのログやステータスを GitHub に送信する。 # ● Github の Self-hosted Runner を設定する」 #### 1. リポジトリ単位で設定する場合 ``` リポジトリの Settings → Actions → Runners → New self‑hosted runner（または...

CLAUDE.md と AGENTS.md　どっちを使う？

Mon, 23 Mar 2026 12:13:37 +0900

# ● 結論 → どちらか一つだけで良い例えば CLAUDE.mdからAGENTS.mdへシンボリックリンクを貼っておくだけで良いです。あるいは、以下のようにしてもOKです。 **CLAUDE.md** ``` @AGENTS.md ``` # ● 1. CLAUDE.md と AGENTS.md の両方を読める AIエージェント | AIエージェント | 読み取り優先順・挙動 | | ----------------------- | -------------------------------------------------- | | Claude Code (Anthropic) | CLAUDE.md を優先、存在しなければ...

無料のウイルス/マルウェア対策 ImunifyAV

Mon, 16 Mar 2026 16:06:25 +0900

# ● ImunifyAVのインストール ``` wget https://repo.imunify360.cloudlinux.com/defence360/imav-deploy.sh bash imav-deploy.sh ``` 以下のような運用にすると良いでしょう： ``` 1. ImunifyAV無料版をインストール 2. cronで週1回 `sclp scan` を実行 3. 通知メールで結果確認→手動対応 ```

LaravelでCSRFエラーの時に再読み込みし、エラー画面を表示させずに再読み込みさせる。

Wed, 11 Mar 2026 08:43:27 +0900

# ● LaravelでCSRFの時にカスタム例外ハンドラでCSRFエラーをキャッチしてリダイレクトする #### 方針 `TokenMismatchException` を検知 → 元のURLへリダイレクト → フラッシュメッセージで通知 ## 実装 **`app/Exceptions/Handler.php`** ```php use Illuminate\Session\TokenMismatchException; public function register(): void { $this->renderable(function (TokenMismatchException $e, $request) { return redirect() ->back()...

爆速 oxfmtをインストールする / VS Codeで利用できるようにする

Thu, 30 Apr 2026 13:00:34 +0900

# ● oxfmtのインストール ```sh npm install -D oxfmt ``` ##### ● oxfmt の設定ファイルをPrettierの設定ファイルから移植する。 ```sh npx oxfmt --migrate prettier ``` ##### ● oxfmt のコマンドをpackage.json に追加する ```sh "format": "oxfmt --check", "format:fix": "oxfmt", ``` # ● oxfmtの実行 ``` npm run format ``` ``` npm run format:fix ``` # ● oxfmt を VS Codeで利用できるようにするこちらをインストールします...

Claude CodeによるGitHubへの操作が判別される仕組み

Mon, 09 Mar 2026 17:27:27 +0900

# Claude CodeによるGitHubへの操作が判別される仕組み ## 仕組み Claude Code がコミットを作成すると、コミットメッセージの末尾に `Co-Authored-By` トレーラーが自動付与されます。 ``` Co-Authored-By: Claude Sonnet 4.6 ``` GitHub はプッシュされたコミットを解析してこのトレーラーを検出し、メールアドレスに紐づく Anthropic のアカウントをコントリビューターとして表示する。 `Co-Authored-By` は GitHub が公式サポートする仕様であり、ペアプログラミングや共同作業の貢献者を記録する目的で使われています。 ## オフにする方法...

現在のブランチのリモート（アップストリーム）を確認する。

Fri, 27 Feb 2026 09:12:37 +0900

# ● 自分が今いるブランチのアップストリームを確認する： ``` git branch -vv | grep "^\*" ``` # ● 全てのブランチのアップストリームを確認する ``` git branch -vv ``` # ● git upstream コマンドとして登録しておくと便利です。 **~/.gitconfig** ``` [alias] upstream = branch -vv | grep "^\\*" ```

Claude Codeに対して、確認を一切せずにタスクを実行してほしい時の起動コマンド

Fri, 20 Feb 2026 12:00:00 +0900

``` claude --dangerously-skip-permissions ```

AWS SAM CLIでローカルでテストを行う

Tue, 17 Feb 2026 18:08:59 +0900

AWS SAM CLIのインストール ```sh brew tap aws/tap brew install aws-sam-cli ``` バージョンを確認する ```sh sam --version ``` aws cli で該当ユーザーでアカウント情報が返ることを確認する ``` aws sts get-caller-identity ``` SAMのビルド ``` sam build ```

claude codeに使用トークン量とモデル名などを常時表示させる

Tue, 17 Feb 2026 16:39:29 +0900

引用: https://zenn.dev/little_hand_s/articles/dbd5fc27f5a2f0 ###・ statusline.jsを作成する ```sh code ~/.claude/statusline.js ``` ###・以下の内容で保存する。 ``` #!/usr/bin/env node const fs = require('fs'); const path = require('path'); const readline = require('readline'); const { execSync } = require('child_process'); // Constants const COMPACTION_THRESHOLD = 200000 // Read JSON from stdin let input =...

OpenClawの始め方

Mon, 16 Feb 2026 12:42:10 +0900

# ● OpenClaw インストール ```sh curl -fsSL https://openclaw.ai/install.sh | bash ``` インストール後に簡単な質問が出るので答えていきます。また、AIモデルも選択します。 Claude の自分自身のサブスクリプション内で使う場合は、次のコマンドでトークンを発行します。 ``` claude setup-token ``` （発行されたトークンを貼り付けます） # ● Slack App を作る ## アプリ作成手順 1. **Slack APIサイトにアクセス**: ブラウザで https://api.slack.com/apps を開きます（Slackアカウントでログイン必須）。 2. **Create New Appボタンを探す**: ページ上部に「Create New...

next.js の並列ルート（Parallel Routes）

Sat, 14 Feb 2026 10:15:14 +0900

## 並列ルート（Parallel Routes） ### 通常のJSX配置 ```tsx export default function Layout({ children }) { return ( <> {children} ) } ``` ### Parallel Routes での配置 ```tsx export default function Layout({ children, sidebar, modal }) { return ( <> {sidebar} {children} {modal} ) } ``` 後者では `app/@sidebar/page.tsx` や...

Cursor CLI でコマンドラインでCursorを使う

Tue, 10 Feb 2026 13:20:15 +0900

#### cursor CLI にログインする ``` cursor agent login ``` #### cursor CLIで使用可能なモデル一覧を表示させる。 ``` cursor agent --list-models ``` # ● cursor CLI を起動する ``` cursor agent ``` （以降、Cursor CLI Agent内での操作です） #### モデルを選択する ``` /model ``` #### モードを（ノーマル → Auto run → Plan → Ask と変更する。） ``` 「Shift」+「Tab」 ``` あとは Claude Code ほとんど同じです。

Claude Code で、エージェントチームを自動的に作らせるように設定する。

Mon, 09 Feb 2026 09:58:24 +0900

# ● Claude Code で、エージェントチームを自動的に作らせるように設定する。 ### 1 . Cloud Code の設定を変更する。 **~/.claude/settings.json** に次の設定値を追加する。 ``` "env": { "CLAUDE_CODE_EXPERIMENTAL_AGENT_TEAMS": "1" }, ``` ### 2 . tmuxをインストールして起動する。 ``` # tmuxをインストールする brew install tmux # tmuxを起動する tmux ``` ### 3 . Claude Code を起動して、チームが作れるかどうか聞いてみる。 ``` claude ❯ チームを作れるような設定になっていますか？? ```...

next.js でビルド中を判別する

Fri, 06 Feb 2026 10:53:33 +0900

# ● next.js でビルド中を判別する ``` if ( process.env.NEXT_PHASE === 'phase-production-build' ){ console.log( '● ビルド中です！' ); } ``` https://github.com/vercel/next.js/blob/633e2749/packages/next/src/shared/lib/constants.ts#L70-L86

next.js で hydration error が起きる可能性があるものを調べる。

Tue, 03 Feb 2026 14:20:01 +0900

Next.jsのHydration Errorが起きる可能性があるものを包括的にリストアップします。 ## 1. **ブラウザAPI関連** ### Window/Document オブジェクト - `window.innerWidth` / `window.innerHeight` - `window.outerWidth` / `window.outerHeight` - `window.scrollX` / `window.scrollY` - `window.pageXOffset` / `window.pageYOffset` - `window.screen.width` / `window.screen.height` - `window.screen.availWidth` / `window.screen.availHeight` -...

何か外部の値（例えばwindow size）を取得する、useSyncExternalStore

Mon, 02 Feb 2026 13:42:13 +0900

# ● useSyncExternalStore の使い方 ``` useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot?) ``` 説明 ``` useSyncExternalStore( 1. subscribe関数, 2. クライアントコンポーネント時のsnapshot関数, 3. SSR時のsnapshot関数 ) ``` ### ● SSR時 ``` getServerSnapshot() 関数を実行して終了。 ``` ### ● クライアントコンポーネント時 #### 1. マウント時 ``` 1. コンポーネントがレンダリングされる 2. useSyncExternalStore が呼ばれる 3. getSnapshot() を呼び出して現在の値を取得...

Claude Codeで「Shift + Enter」で改行コードを入力する。

Mon, 02 Feb 2026 12:46:53 +0900

Karabiner-Elements で、以下のように設定します。 ``` { "description": "【Claude Code】Shift+Enterを'バックスラッシュ+enter'に変換", "manipulators": [ { "conditions": [ { "bundle_identifiers": [ "com.apple.Terminal" ], "type": "frontmost_application_if" }, {...

react19 の useRef

Wed, 28 Jan 2026 10:29:35 +0900

``` useRef には便宜上のオーバーロードがまだ存在し、useRef(null) は自動的に RefObject を返すようになっています。useRef の引数必須化に対する移行を容易にするために、useRef(undefined) に対する実用的なオーバーロードが追加され、自動的に RefObject 型を返すようになります ``` ``` import { useRef, useEffect } from 'react'; function InputFocus() { // inputRef は RefObjectになる const inputRef = useRef(null); useEffect(()...