プログラムメモ

claude code 便利コマンド

Wed, 01 Apr 2026 14:07:48 +0900

# ● claude code 便利コマンド ### claude code のバーの色を赤色にする ``` /color red ``` ### claude code ののセッションに適した名前を自動的につけてもらう ``` /rename ``` なお、バーの色やセッション名などは、再度次のコマンドで読み直したときにも反映されているので、タスクの種類ごとに分けておくといいと思います。 ``` claude -r ```

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

Fri, 03 Apr 2026 15:36:56 +0900

# ● npm設定自身のホームフォルダ以下の .npmrc ファイルに、以下の設定を行います。 ``` vi ~/.npmrc ``` ``` # 7日経過したnpmパッケージしかインストールさせない。 min-release-age=7 # ^1.2.3 のような範囲指定バージョンを使わず1.2.3 のように正確なバージョンで保存 save-exact=true # postinstall など、スクリプトを実行させない ignore-scripts=true ``` npm では min-release-ageの単位は day です。 min-release-age は npm v11 以降の機能のようです https://docs.npmjs.com/cli/v11/using-npm/config#min-release-age...

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

Mon, 30 Mar 2026 17:12:31 +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

Tue, 10 Mar 2026 16:47:13 +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 ```

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(()...

AIをローカルマシンで安全に実行するDocker Sandboxes とは ?

Mon, 26 Jan 2026 23:03:03 +0900

# ● Docker Sandboxes とは Docker Sandboxesは、AIエージェント(コーディングエージェント)をローカルマシン上で安全に実行するための機能です。Claude Codeのようなエージェントが、コンテナ化されたワークスペース内で安全にコマンドを実行したり、パッケージをインストールしたり、ファイルを変更したりできます。 ## `docker sandbox run ` の動作このコマンドを実行すると、以下のプロセスが行われます: 1. **コンテナの作成**: テンプレートイメージからコンテナを作成し、現在の作業ディレクトリをコンテナ内の同じパスにマウントします 2. **Git設定の自動注入**:...

vscode / cursor / windsurf / antigravity で git worktree の作成方法

Tue, 27 Jan 2026 08:30:52 +0900

## ● 1 . リポジトリを表示します ## ● 2 . リポジトリが表示された後にリポジトリ横の3点リーダーメニューからWorktreeの作成が選択できるようになります。 ## ● 3 . Cursorの場合はまずメニューをVSCodeと同じ表示にします。...

WebStorm でTypeScript-Go（tsgo）のLanguage Server を使用するための設定を追加する

Wed, 21 Jan 2026 16:13:56 +0900

Webstorm → 設定 → 言語＆フレームワーク → TypeScript → こちらを選択する ↓

Claude Code の skills

Wed, 21 Jan 2026 21:38:57 +0900

# skill-creator → anthropic公式のスキル #### 引数付き起動 ``` /create-skill pdf-converter PDFファイルを画像に変換するスキル ``` #### 引数なし起動（対話的） ``` /create-skill ``` # UI UX Pro Max → フロントエンドのUIを書くのにすごく便利 https://github.com/nextlevelbuilder/ui-ux-pro-max-skill # seo-review → AIで作ったサイトのSEO審査に使います https://github.com/leonardomso/33-js-concepts/tree/master/.opencode/skill/seo-review # skills 使い方 ```...

css grid でレスポンシブでレイアウトを変える

Mon, 12 Jan 2026 17:31:52 +0900

``` .grid { display: grid; gap: 16px; background-color: rgb(233, 233, 233); grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr 1fr; } .box { border: 3px solid red; background-color: #ff000011; color: #F00; font-size: 40px; display: flex; justify-content: center; align-items: center;...

flex で gap を変数にして使う

Thu, 08 Jan 2026 13:42:08 +0900

``` .owner__vision__box{ // 変数 --gap: 30px; display: flex; flex-wrap: wrap; gap: var(--gap); margin: 38px 0px 10px 0px; li { display: block; border: 1px solid red; width: calc( (100% - var(--gap) * 2) / 3 ); } } ```

日本語フォントのCSS設定

Wed, 07 Jan 2026 11:02:23 +0900

``` // カーニング font-feature-settings: "palt"; letter-spacing: 0.09em; // 数字と日本語の間に余白を入れる text-autospace: normal; // 折り返し overflow-wrap: anywhere; word-break: normal; // 変なところで折り返さない。 line-break: strict ```

nextjs / vite でも使用されている Node.js向けの軽量で美しいユーザーインターフェースのプロンプトライブラリ

Wed, 25 Mar 2026 09:17:27 +0900

# ● clack/prompts https://github.com/bombshell-dev/clack `npx skills add vercel-labs/agent-skills` などで実行されるVercelのskillsで採用されているライブラリです。モダンな表現になります。 # ● terkelg/prompts https://github.com/terkelg/prompts

biome , oxlint

Wed, 24 Dec 2025 13:50:37 +0900

# ● biome ``` npm install --save-dev --save-exact @biomejs/biome // 設定ファイルの初期化 npx @biomejs/biome init --jsonc ``` ###・biomeでソースコードの整形 = prettier ``` npx @biomejs/biome format ``` ###・biomeでlint ``` npx @biomejs/biome lint ``` ###・biomeで lint+prettier 両方を実行します。 ``` npx @biomejs/biome check ``` #### ・Biomeでno-restricted-importsを実現する方法...

Playwright パラレル

Tue, 23 Dec 2025 18:06:26 +0900

# Playwright パラレル * **ディレクトリ構造は「ドメイン／機能」で分ける** * **並列可否（衝突関係）は「メタ情報」として別レイヤーで表現する** > **構造（何のテストか）と > 実行制約（どう実行できるか）を混ぜない** ## なぜ「並列可能集合ディレクトリ」はダメなのか ### 1. 並列可否は「性質」であって「所属」ではない * ドメイン：**本質的・安定** * 並列可否：**環境・実装・時代依存** ```text ✗ tests/parallel-safe/ ✗ tests/serial-only/ ``` これは： * DB構造が変わる * テストデータが改善される * 並列制御が賢くなる …だけで **ディレクトリ再編が発生**します。 ### 2. 1テストが複数の制約を持てなくなる現実のテストはこうです： *...

as const satisfies の使い所

Fri, 19 Dec 2025 11:19:59 +0900

# ● 例1 （別に as const satisfies を使わなくても良い例） #### 問題1 . エラーになる例 ``` type HttpMethod = "GET" | "POST" | "PUT" | "DELETE"; type Route = { path: string; method: HttpMethod; }; // ❌ widening が起こる const routes1: Record = { getUser: { path: "/users/:id", method: "GET" }, createUser: { path: "/users", method: "POST" }, }; routes1.getUser.method // 型: HttpMethod (Union型) //...

ブラウザのリフレッシュレート

Wed, 17 Dec 2025 14:48:40 +0900

# ● ブラウザのリフレッシュレートブラウザのリフレッシュレートというのは誰がどのタイミングで決定するのか？ ## 誰が決定するか **ディスプレイ(モニター)のハードウェア**が決定します。ブラウザではありません。 ``` ディスプレイのリフレッシュレート ↓ (OSが検出) ↓ (ブラウザが取得) requestAnimationFrame のタイミング ``` ## 一般的なリフレッシュレート - **60Hz**: 一般的なディスプレイ (約16.67ms/フレーム) - **120Hz/144Hz**: ゲーミングモニター (約8.33ms, 6.94ms/フレーム) - **240Hz**: ハイエンドゲーミングモニター (約4.17ms/フレーム) ## ブラウザによる違い...

macで markdownファイルを見やすくする

Fri, 12 Dec 2025 13:34:08 +0900

# ● treemd インストール方法 ``` brew install treemd ``` （結構インストールに時間がかかるので、気長に待ちましょう） # ● mdcat インストール方法 ``` brew install mdcat ```

cssグリットで要素を上下左右中央にセンタリング表示

Mon, 08 Dec 2025 17:23:18 +0900

p-fv { min-height: 500px; display: grid; place-content: center; }

laravelでデータベースのIDの開始を1001からにしたい

Fri, 05 Dec 2025 12:22:04 +0900

# ● laravelでデータベースのIDの開始を1001からにしたい ```php public function up() { $tableName = 'users'; Schema::create($tableName, function (Blueprint $table) { $table->id(); // カラム定義 $table->timestamps(); }); // テーブル作成後にAUTO_INCREMENTの開始値を設定 // テスト用DB（SQLite）以外の場合のみ実行 if (DB::getDriverName() !== 'sqlite') { DB::statement("ALTER TABLE...

Laravel (PHP) で Redis を使用する

Thu, 04 Dec 2025 14:42:24 +0900

LaravelでRedis を使用するにはPECLによりPhpRedisPHP拡張機能をインストールする必要がありますこれが行えない環境にある場合は、次のライブラリを使用します。 # ● Composerでpredisパッケージをインストールする。 https://packagist.org/packages/predis/predis ```bash composer require predis/predis ``` Laravelの環境変数ファイル.envに以下を追加または変更し、Redisクライアントをpredisに設定する。 ``` REDIS_CLIENT=predis REDIS_HOST=127.0.0.1 REDIS_PASSWORD=null REDIS_PORT=6379 ```...

KUSANAGI に redis を入れる

Thu, 04 Dec 2025 10:23:08 +0900

KUSANAGIで管理しているサーバーにRedisを入れる。 # Redisが入っているかどうかを確認する ``` redis-clredis-cli ping // PONG が返ってくれば既に起動しています。 ``` # ● Redisサーバーインストール ``` # 1. パッケージ更新 sudo dnf update -y # 2. Redisインストール（AppStreamリポジトリから最新版） sudo dnf install -y redis # 3. 自動起動設定＆即時起動 sudo systemctl enable --now redis # 4. 動作確認 sudo systemctl status redis #5 . 念のために再起動を確認しておきましょう。 sudo reboot ``` **再起動後に確認します ** ```...

KUSANAGI9 の初期設定とドメイン作成（プロビジョン）方法

Mon, 30 Mar 2026 10:07:32 +0900

# ● 1. KUSANAGI9 のバージョンチェックと yum のアップデートを行う **KUSANAGI9 から kusanagiユーザーから実行できるようになりました。kusanagiコマンドは root ユーザーまたは kusanagi ユーザーから行います** （aws ec2の場合は root からしか実行できません） ``` kusanagi --version ``` 以下のようにバージョンが帰ってきます ``` KUSANAGI Version 9.4.2-1.el9 ``` dnf は **root** ユーザーから行います ``` sudo dnf update -y ``` パッケージのupdateは **yum** コマンドではなく **dnf** コマンドを使用します。 # ● 1-2 現在のunixマシン名（ホスト名）を確認・変更する...

git worktree を便利にするコマンド

Tue, 24 Mar 2026 15:51:07 +0900

# ● 1 . gwq https://github.com/d-kuro/gwq （ワークツリーが作られるフォルダは ~/worktrees ） #### ・インストール ``` brew install d-kuro/tap/gwq ``` ``` gwq add <ブランチ名> gwq remove <ブランチ名> ``` # ● 2 . phantom https://github.com/aku11i/phantom （ワークツリーが作られるフォルダは ./.git/phantom/worktrees/ ） #### ・インストール ``` brew install phantom ``` ブランチ feature-awesome の worktreeを新規に作って cursor で開く ``` phantom create...

laravel-ide-helper を使用してVS CodeやPhpStormでコード補完させる

Tue, 25 Nov 2025 18:29:47 +0900

# ● laravel-ide-helper を使用する次の2ステップの作業のみでVS CodeやPhpStormでコード補完（インテリセンス）が効くようになります。 ## ● 1. laravel-ide-helperのインストール https://github.com/barryvdh/laravel-ide-helper ``` composer require --dev barryvdh/laravel-ide-helper ``` ## 2. モデルファイルに直接PHPDocを書き込む。この方法が一番確実です。次のコマンドで実行できます。 **Company modelにphpdocを直接書き込む** ```php php artisan ide-helper:models "App\Models\Company" --write ```...

Laravel QUEUE_CONNECTION=sync について

Tue, 25 Nov 2025 17:48:30 +0900

# Laravel QUEUE_CONNECTION=sync について QUEUE_CONNECTION=sync は、Laravelのキュー接続設定で、ジョブを同期的に実行するための設定です ## 設定の仕組み `config/queue.php`で、デフォルトのキュー接続が`QUEUE_CONNECTION`環境変数から読み込まれます。 syncドライバーは利用可能な接続の一つとして定義されています ## syncドライバーの特徴 syncドライバーを使用すると、キューに追加されたジョブは**即座に同期的に実行**されます。つまり、バックグラウンドで非同期に処理されるのではなく、ジョブがディスパッチされた時点でその場で実行されます。 ## 使用場面 ### テスト環境...

Tailwind css を依存に関係にもたないUIコンポーネント

Fri, 21 Nov 2025 09:07:12 +0900

## Tailwind CSSを依存しないReact UIコンポーネント 1. Chakra UI 2. Radix Primitives 3. Adobe React Aria 4. Material UI (MUI) 5. Mantine 6. React Bootstrap 7. Ant Design 8. React Suite ## Tailwind CSSを依存するReact UIコンポーネント 1. Tailwind UI 2. Headless UI 3. daisyUI 4. Flowbite React 5. shadcn/ui 6. Tailblocks 7. TailGrids 8. Tail-kit 9. Untitled UI React 10. FlyonUI

tailwind を使わないUIコンポーネント Mantine をインストールする

Mon, 17 Nov 2025 13:29:19 +0900

```sh pnpm install @mantine/core @mantine/hooks pnpm install --save-dev postcss postcss-preset-mantine postcss-simple-vars ``` **src/providers.tsx** ```ts "use client"; import { MantineProvider } from "@mantine/core"; import type { FC, ReactNode } from "react"; type Props = { children: ReactNode; }; export const Providers: FC = ({ children }) => { return (

PHP で nanoid を生成する

Sun, 16 Nov 2025 17:44:22 +0900

ソータブルではないですが、ランダムなIDを作成したいときにNanoIDを利用します。 # ● composer require snortlin/nano-id を使う場合 ```sh composer require snortlin/nano-id ``` 長さが8文字のNanoIDを生成する ```php $serviceRequest->request_code = NanoId::nanoId(8); ``` アルファベット小文字と数字だけを使って長さが8文字のNanoIDを生成する ```php $serviceRequest->request_code = NanoId::nanoId(8,NanoId::ALPHABET_NUMBERS . NanoId::ALPHABET_LOWERCASE); ``` # ●...