プログラムメモ

日本語フォントの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向けの軽量で美しいユーザーインターフェースのプロンプトライブラリ

Tue, 06 Jan 2026 14:06:18 +0900

# ● 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, 08 Dec 2025 11:36:30 +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-runner

Wed, 26 Nov 2025 12:18:26 +0900

# ● git-worktree-runner のインストール ```sh git clone https://github.com/coderabbitai/git-worktree-runner.git cd git-worktree-runner sudo ln -s "$(pwd)/bin/git-gtr" /usr/local/bin/git-gtr ``` ```sh git-gtr --version // git gtr version 2.0.0 ``` # ● git-worktree-runner の設定 ``` # デフォルトのエディタとAIツールを設定 gtr config set gtr.editor.default code git gtr config set gtr.ai.default claude #...

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); ``` # ●...

大文字と小文字の区別がデフォルトで判別しないになっていることがあるので注意

Sat, 15 Nov 2025 23:11:23 +0900

``` git config core.ignorecase ``` ``` true ``` Macなどの場合、Gitが大文字小文字を区別しない設定になっていることがあります。その場合に以下のようなリネームをしたとしても気づいてくれません。 ``` Samplepage.tsx → SamplePage.tsx ``` その時は一旦ファイルを削除してコミットし、その後にリネームしたファイルを登録してコミットとするか、そもそものこの設定を変更する必要があります。 Gitが大文字小文字を区別するようにする。 ``` git config core.ignorecase false ```

deployer でのデプロイが便利すぎる

Fri, 14 Nov 2025 22:22:33 +0900

# ● deployerのインストール ```sh composer require deployer/deployer --dev ``` # ● deployerの初期設定 ``` vendor/bin/dep init ``` 各種質問に答えます。hostsという質問のときは、デプロイ先のSSH接続名を入力します。

Laravel で API の入出力を自動的にキャメルケースに変換するミドルウェア。

Thu, 06 Nov 2025 22:36:14 +0900

# ● rizkussef/laravel-snake-to-camel-case https://github.com/RizkUssef/laravel-snake-to-camel-case Laravel 内ではスネークケースで統一して、あとは自動的にフロントエンドとのやり取りをキャメルケースにしてくれます。

Laravel で実際にデータベースを見に行った上でTypeScriptの型を生成するパッケージ

Thu, 11 Dec 2025 15:25:31 +0900

# ● fumeapp/modeltyper https://github.com/fumeapp/modeltyper 導入と生成がとても簡単なのでおすすめです。 #### インストール ```sh composer require --dev fumeapp/modeltyper ``` #### 実行（ type を使う場合） ``` php artisan model:typer --use-types # 実行すると画面上に表示されるので、クリップボードに入れたい場合は、 php artisan model:typer --use-types | pbcopy ``` #### 実行（ interface を使う場合） ``` php artisan model:typer # 実行すると画面上に表示されるので、クリップボードに入れたい場合は、...

codeigniter でログを取得する

Mon, 03 Nov 2025 17:06:28 +0900

明示的にメソッドを呼び出してログを記録する方法をご説明します。 ## CodeIgniterの標準ログメソッド特定のコントローラー内で以下のように記述します： ```php _log_access(); // 通常の処理 // ... } public function complete() { // アクセスログを記録...

Laravelで日本語の住所からGoogleマップのURLを取得する関数

Sat, 01 Nov 2025 13:16:41 +0900

# ● composer require spatie/geocoder インストール ``` composer require spatie/geocoder ``` 取得関数 ``` setApiKey(config('geocoder.key'));...

PHPのLaravelでURLをQRコードにするQRコード画像を生成するパッケージ

Sat, 01 Nov 2025 09:15:48 +0900

最短手順は「インストール →（自動登録）→ Bladeやコントローラで QrCode ファサードを呼ぶ」です。SVG表示は即使え、PNG出力は GD/Imagick が必要です。[1][2][3] ### インストール - 実行: composer require simplesoftwareio/simple-qrcode（v4系が推奨）。[2][3] - Laravelの自動パッケージ発見でプロバイダ/エイリアス登録は不要（古い記事の手動追記は基本不要）。[3] ### もっとも簡単な表示（SVG） - Bladeにそのまま埋め込み・{!! QrCode::generate('https://example.com') !!}（デフォルトはサイズ100のSVG）。[4][3] - サイズ指定・{!!...

Laraelのモデルでグローバルスコープ、ローカルスコープを動的なパラメーターでセットする

Fri, 31 Oct 2025 20:51:33 +0900

# ● Laravelのモデルの「スコープ」とは Laravelのモデルのスコープとは簡単にいうと SQL文の「 WHERE aaa = 'bbb'」みたいなWHERE句なのですが、 ``` ・「User」モデルの中の管理者フラグを持つものだけを取り扱う・「User」モデルが既にあるときに、現在削除されてないユーザー（ WHERE is_deleted = 0 ）を「Activeuser」モデルとして作成する。 ``` みたいなところで使います。その時に使うのが　モデルの「スコープ」です。好きな時につけたり外したりできる「ローカルスコープ」と基本的につけっ放しの「グローバルスコープ」があります。 # ● グローバルスコープの作成方法（A. スコープクラスを作成して使う場合）...

Claude Code 便利集

Fri, 19 Dec 2025 09:37:45 +0900

# ● claude -r の代わりに ccr コマンドでClaude Code のセッションを再開する ```sh npm install -g @sasazame/ccresume ``` **.bash_profile** ``` alias ccr='ccresume' ``` ccrコマンドで起動できるようになります。 ``` ccr ``` # ● ccv コマンドでClaude Code の昔のセッションを再開する **.bash_profile** ``` alias ccv='PORT=3400 npx @kimuson/claude-code-viewer@latest; open http://localhost:3400' ``` ccvコマンドで起動できるようになります。 ``` ccv ``` # ● Claude...

gitであるファイルが変更されたコミットを検索する

Thu, 30 Oct 2025 09:10:22 +0900

``` git log --all --full-history --oneline -- "path/to/your/file/test.html" | head -20 ```

LaravelでPest使う

Sat, 08 Nov 2025 09:43:54 +0900

# 1 . PHPユニットに感謝しつつ削除する ```sh composer remove phpunit/phpunit ``` # 2 . Pest をインストール ```sh composer require pestphp/pest --dev --with-all-dependencies ``` # 3 . Pest の初期化 ```sh ./vendor/bin/pest --init ``` # 4 . テスト実行 ```sh ./vendor/bin/pest ``` **.bash_profile** Aliasを設定しておきましょう。 ``` alias pest='./vendor/bin/pest' ``` #### laravle pest で指定したタイトルにマッチするテストだけを実行 ```sh pest...

laravel-arsenal-core を使ってみる

Tue, 28 Oct 2025 20:12:17 +0900

```bash composer create-project laravel/laravel laravel-lac-app ``` ```bash cd laravel-lac-app ``` ```bash composer require lac/toolkit --dev ``` Post テーブルをスキャフォールディングする ``` php artisan lac:scaffold Post php artisan lac:sync-routes ```

vscodeでplant uml を表示する

Tue, 28 Oct 2025 13:35:51 +0900

``` brew install openjdk java --version ``` ``` brew install graphviz brew install plantuml ``` # ● PlantUML https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml

I AM Identity Center / SSO

Fri, 24 Oct 2025 10:50:58 +0900

# ● I AM ユーザーを作ったら負け引用 : https://speakerdeck.com/opelab/20240621-aws-summit-iam?slide=41 ### 従来の方法(IAMユーザー+アクセスキー)の問題点 ``` ・アクセスキーは長期的な認証情報で、漏洩リスクが高い・ローテーションが手動で面倒・ハードコードやGitへの誤コミットのリスク・複数の環境で同じキーを使い回しがち ``` **恒常的なクレデンシャルが常にAWSの外にあることが問題である** ### IAM Identity Centerを使う利点 ``` ・一時的な認証情報を自動取得(数時間で自動失効) ・AWS CLIでaws sso loginコマンドで認証・1つのログインで複数のAWSアカウント・ロールにアクセス可能・より安全で、認証情報の管理が楽 ``` #...

AWS CloudWatchで AWS CloudFrontへのアクセスを調べる

Thu, 23 Oct 2025 13:16:23 +0900

AWS CloudWatchでCloudFrontのファイルアクセスを調査する方法 ## 前提確認が必要な点 CloudFrontのログ設定により調査方法が異なります: ### 1. **CloudFront Real-time Logs**が有効な場合 CloudWatch Logsに直接ログが送信されているため、**CloudWatch Logs Insights**でクエリ可能です。 ``` # 特定のファイルへのアクセスを検索 fields @timestamp, c-ip, cs-uri-stem, sc-status, cs-method | filter cs-uri-stem like /\/path\/to\/your\/file\.ext/ | sort @timestamp desc | limit 1000 ``` **CloudFront...

Webサーバーの負荷テストコマンド ab

Thu, 23 Oct 2025 10:32:29 +0900

# ● Webサーバーの負荷テストコマンド ab ``` ab -n 1000 -c 100 http://localhost/ ``` ## 各オプションの意味 - **`-n 1000`**: 合計で **1000回のリクエスト** を実行 - **`-c 100`**: **同時に100個の並行リクエスト** を実行 - **`http://localhost/`**: ベンチマーク対象のURL ## 動作の流れ 1. 100個の並行接続を確立 2. それらの接続を使って合計1000回のリクエストを送信 3. 各接続は約10回ずつリクエストを処理（1000 ÷ 100） 4. すべてのリクエストが完了したら統計情報を表示 ## 出力される主な情報 - **Requests per second**: 1秒あたりの処理リクエスト数 - **Time per...

Next.jsでFirebase Analyticsを使う

Mon, 20 Oct 2025 16:31:04 +0900

Next.jsにFirebaseアナリティクス（Google Analytics）を追加するには、クライアントサイドでFirebase Analyticsを初期化し、必要に応じてイベント計測を行うようにします ### 手順概要 1. Firebaseプロジェクト作成・設定 2. Firebase SDK依存パッケージのインストール 3. 環境変数でFirebase設定情報を管理 4. クライアントコンポーネントでAnalytics初期化 5. カスタムイベントの記録 *** ### 1. Firebaseプロジェクト作成 - [Firebaseコンソール](https://console.firebase.google.com/)で新規プロジェクトを作成し、Google Analyticsの設定を有効化します。 - プロジェクトの「設定」→「全般」→「マイアプリ」から...

CloudWatch で EC2 の使用状況確認する

Thu, 16 Oct 2025 15:29:47 +0900

### 必要な設定の流れ - IAMロールの作成（CloudWatchへの書き込み権限が必要）[2][1] - CloudWatch エージェントのインストール（EC2にログインしてインストール）[1][2] - CloudWatch エージェントの設定と起動（ディスク監視用）[2][1] - CloudWatchメトリクスの確認（カスタムメトリクスとして表示）[4][5] ### メニューと設定手順 1. **IAMロール作成** AWSコンソール > IAM > ロール作成 → EC2用のCloudWatch書き込み権限付きポリシー（例: AmazonCloudWatchAgent）をアタッチ[6][1][2] 2. **エージェントインストール** EC2インスタンスにログインし、下記URLからCloudWatch...

ngixであるIPからのアクセスのときはベーシック認証を回避するが、それ以外のときはベーシック認証を出す

Thu, 16 Oct 2025 14:34:36 +0900

EngineX（nginx）で特定のIPアドレスからのアクセスはベーシック認証を回避し、それ以外のアクセスにはベーシック認証をかける設定は、nginxの「satisfy any;」ディレクティブを使って実現できます。具体的には、以下のような設定例です： ``` server { listen 80; server_name example.com; location / { satisfy any; # 許可するIPを指定（認証回避） allow 192.168.1.100; allow 127.0.0.1; # 他のIPは拒否 deny all; # ベーシック認証設定 auth_basic...

gitであるコミットの特定ファイルだけを取り出して、自分のブランチに適用させる。

Thu, 16 Oct 2025 12:03:44 +0900

# ● gitであるコミットの特定ファイルだけを取り出して、自分のブランチに適用させる。 cherry-pick より細かいファイル単位で取り出したいときに使います。 ```sh git checkout ＜コミットID＞ -- ＜ファイル名＞ ```

CircleCI CLI を使ってデバッグする

Thu, 16 Oct 2025 09:32:33 +0900

## 1. CircleCI CLI を使う（推奨） CircleCI CLIをインストールして、ローカルでジョブを実行できます。 ```bash # インストール（macOS の場合） brew install circleci # 設定ファイルのバリデーション circleci config validate # ローカルでジョブを実行 circleci local execute --job nextjs_test ``` ただし、`circleci-agent step halt` などの一部のCircleCI専用コマンドはローカルでは動作しません ## 2. ブランチをプッシュしてテスト（プルリクエストなし） ```bash # テスト用ブランチを作成 git checkout -b test/circleci-test # 変更をコミット git...

Go ECHO でログを JSON形式、LTSV形式にする

Tue, 14 Oct 2025 22:40:07 +0900

``` // LoggerミドルウェアをJSON形式で e.Use(middleware.LoggerWithConfig(middleware.LoggerConfig{ Format: `{"time":"${time_rfc3339}","method":"${method}","uri":"${uri}","status":${status},"latency_ms":${latency_ms},"remote_ip":"${remote_ip}","error":"${error}"}` + "\n", })) ``` ``` // LoggerミドルウェアをLTSV形式で e.Use(middleware.LoggerWithConfig(middleware.LoggerConfig{ Format:...

Go ECHO の Recoverミドルウェア

Tue, 14 Oct 2025 22:37:03 +0900

``` // Recoverミドルウェア（panicをキャッチしてログ出力） e.Use(middleware.RecoverWithConfig(middleware.RecoverConfig{ LogLevel: log.ERROR, })) ```

curl コマンドでGETメソッドのレスポンスヘッダーだけを見る

Tue, 14 Oct 2025 18:12:48 +0900

# ● curl コマンドでGETメソッドのレスポンスヘッダーだけを見る ``` curl -s -D - -o /dev/null https://example.com ``` 注意として、-I オプションははHEADメソッドでアクセスするので、厳密にヘッダーを見たい場合は上のようなコマンドを送ります。

Javascript の Set と Map

Tue, 14 Oct 2025 13:33:29 +0900

# ● Javascript の Set #### 1 . Set は重複しないリストを作ることができます ``` const mySet = new Set(); mySet.add(1); mySet.add(1); console.log(mySet); // Set { 1 } // 結果 // { // 0: 1 // } ``` #### 2 . ただし、オブジェクトの場合は参照先が異なるので、別のものとして重複配置はできません。 ``` const myCollection = new Set(); myCollection.add({id: 1, name: 'John'}); myCollection.add({id: 1, name: 'John'}); console.log(myCollection); // 結果 // { //...

git マージしたPRのブランチを checkoutする

Tue, 14 Oct 2025 11:31:04 +0900

# ● git マージしたPRのブランチを checkoutする ``` git fetch <リモート名> <リモート参照>:<ローカルブランチ名> ``` PR#1234 をローカルのブランチ名 my-local-branch-name で checkout する ``` git fetch origin pull/1234/head:my-local-branch-name ```

RTK Query の infiniteQuery

Mon, 13 Oct 2025 10:00:26 +0900

# ● RTK Query の infiniteQuery ## 概要 `build.infiniteQuery()`は、エンドポイント定義時に使用するメソッドで、TypeScriptでは3つのジェネリック型引数を必要とします [1](#5-0) : ```typescript build.infiniteQuery() ``` ## ジェネリック型引数 | 引数 | 説明 | |------|------| | `ResultType` | 単一ページのデータ型（例: `Pokemon[]`） | | `QueryArg` | キャッシュキーとして使用される引数の型（引数がない場合は`void`） | | `PageParam` | ページを特定するためのパラメータの型（例: `number`,...

next.js ondemand ISR のキャッシュの場所

Fri, 10 Oct 2025 11:32:32 +0900

# ● next.js ondemand ISR のキャッシュファイル保存場所 ## 1. キャッシュファイルの保存場所オンデマンドISRのキャッシュファイルは、`FileSystemCache`クラスの`getFilePath`メソッドによって決定されます。 next.js:450-471 キャッシュの種類によって、以下のように保存されます： - Fetchキャッシュ → `.next/cache/fetch-cache`ディレクトリに保存されます。 - ページキャッシュ → `.next/server/app`ディレクトリに保存されます。具体的には ``` ・HTMLファイル: `{key}.html` ・RSCデータ: `{key}.rsc`（PPR有効時は`{key}.prefetch.rsc`）・メタデータ: `{key}.meta`...

ls コマンドの色設定をする

Mon, 06 Oct 2025 09:31:31 +0900

# ● ls コマンドの色設定をするファイル **ls_colors.txt** に色設定を保存して、それを読み出します ``` cd ~ vi ls_colors.txt ``` **ls_colors.txt** ```...

ここで今一度javascriptのランタイムについて整理しておこう

Fri, 03 Oct 2025 09:39:13 +0900

ここで今一度javascriptのランタイムについて整理しておこう # ● ブラウザ以外の主要なJavaScriptランタイム | ランタイム名 | ベースエンジン | 特徴・用途 | |------------------------------|----------------------|--------------------------------------------------------| | Node.js | V8 | サーバーサイドの定番。豊富なnpmエコシステム、API群が充実 | | Deno...

javascript で配列を高速に初期化する

Tue, 30 Sep 2025 09:47:49 +0900

# ● javascript で配列を高速に初期化する js で配列をクリアする時 ```js myarray.length = 0; 　　と myarray= []; ``` どちらが早い？　　　　↓ ```js // 配列 myarray を初期化する myarray.length = 0; ``` の方が高速です！

Amazon ElastiCache

Fri, 26 Sep 2025 16:43:27 +0900

Amazon ElastiCacheとは、AWSが提供するフルマネージド型のインメモリキャッシングサービスです Valkeyが安いので最初に試すにはValkeyが良いでしょう。 # ● キャッシュを作成する ``` AWS Console → ElasitiCache → Valkeyキャッシュ→ キャッシュを作成デフォルト設定をカスタマイズ → 使用量の制限を「データストレージを最大1GB」に設定する ``` これでokです。