開発・個人開発

Vercel・Supabase・Astroなどで自分でサービスを作る人向けの構築ノウハウ。

開発・個人開発

AIに記事を量産させる仕組みの作り方再現性のある品質管理

生成AIで記事を量産するには、品質基準を文書化しAIに読ませる「CLAUDE.md方式」が効果的だ。1本30〜40分で5,000字の記事を生成する実際のワークフローと、品質を保つための仕組み作りを解説する。

開発・個人開発

個人でAIメディアを作る全体像技術スタックと立ち上げの流れ

Astro + Vercel + Supabase + Claude Codeの組み合わせで、個人開発者が月数千円以下のコストでAIメディアサイトを作れる。技術選定の理由から公開までの流れを、このサイト自体の構築経験をもとに解説する。

開発・個人開発

AIメディアを個人で運営する実録月200本ペースの体制と実態

Astro + Claude Codeで構築したAIメディアを1人で運営する実際のワークフロー・コスト・成果を公開する。記事量産から公開・SEO対応・アクセス計測まで、個人が再現できる体制の作り方を解説する。

開発・個人開発

Astroで爆速ブログ・メディアを作る入門インストールから記事公開まで

Astroは静的サイトジェネレーターの中でメディア・ブログ向けに最適化されており、Markdownで記事を管理しながら表示速度とSEOを両立できる。ゼロから記事が公開できる状態になるまでの手順を解説する。

開発・個人開発

AstroでSEO・構造化データを自動化する記事ごとの設定が不要になる実装

Astroでは、メタタグ・OGP・Article JSON-LD・FAQPage構造化データ・sitemap・llms.txtを一度実装すれば、記事を追加するだけで自動適用される仕組みを作れる。実装コードと設計の考え方を解説する。

開発・個人開発

Claude Codeで個人開発を加速する使い方と活用パターン

Claude Codeはターミナルから動くAIコーディング支援ツールで、コード生成・デバッグ・ファイル操作を自然言語で指示できる。個人開発者が実務で使える活用パターンとコスト管理の方法を解説する。

開発・個人開発

問い合わせフォームをSupabase+Resend+Slackで作る静的サイト向け実装

静的サイトの問い合わせフォームを、Supabase Edge Functions・Resendのメール送信・SlackのWebhookを使って実装する。サーバー不要・コストほぼゼロで動く問い合わせシステムの作り方を解説する。

開発・個人開発

個人開発のためのGitHub最小限入門リポジトリ作成からVercel連携まで

GitHubはコードの変更履歴を管理し、チームや自分の過去作業を追跡できるサービスだ。個人開発で必要なリポジトリ作成・git add/commit/push・Vercel連携の操作を、コマンドライン不要の手順も含めて解説する。

開発・個人開発

静的サイトに動的機能を足す設計（JAMstack）アーキテクチャの考え方

JAMstackは静的サイト（Markup）にAPIとJavaScriptを組み合わせて動的機能を実現するアーキテクチャだ。Astro + Vercel + SupabaseのスタックでJAMstack的な設計をどう実現するかを解説する。

開発・個人開発

llms.txtとは？ AIに見つかるサイトにする最適化ガイド

llms.txtは、ChatGPTやClaudeなどのAIがサイト内容を効率よく読めるよう情報を整理したテキストファイルだ。robots.txtのAI版ともいえる。設置方法と書き方、SEOとの違いを解説する。

開発・個人開発

ノーコードとフルコードの使い分け個人開発で迷わない判断基準

ノーコードツール（Webflow・Bubble・Notion）とフルコード（Astro・Next.js）には向き不向きがある。個人開発者が機能・スピード・コスト・拡張性から使い分けを判断するための基準を解説する。

開発・個人開発

個人開発でやりがちな失敗と回避策完成しない・動かない・続かない

個人開発でつまずくポイントは「完成しない」「動かない」「続かない」の3つに集約される。実際に多く観察される失敗パターンと、それぞれの回避策を具体的に解説する。

開発・個人開発

個人開発のコスト設計 Vercel・Supabase・AIツールの無料枠活用

Vercel・Supabase・Claude Code・ドメインを組み合わせた個人開発の月額コストを、無料枠の範囲・有料化のタイミング・コスト削減の工夫を含めて整理した。月3,000〜5,000円で運営できる構成を解説する。

開発・個人開発

個人開発で作る管理ダッシュボード Supabase + Astroで1日で完成

個人開発のメディアサイトに管理ダッシュボードを追加する。アクセスランキング・問い合わせ一覧・環境フラグ管理の3機能をSupabase + Astroで実装する設計と実際のコードを解説する。

開発・個人開発

個人開発の公開前チェックリスト 20項目で見落としゼロに

個人開発のサイト・アプリを公開する前に確認すべき20項目をまとめた。セキュリティ・SEO・パフォーマンス・法的事項・ユーザー体験の5つの観点で、公開後のトラブルを防ぐチェックリストを解説する。

開発・個人開発

Resendでメール送信を実装する個人開発に使えるAPIの基本

Resendは開発者向けのメール送信APIで、無料プランで月3,000件まで送信できる。APIキーの取得・ドメイン設定・JavaScriptでのメール送信実装まで、個人開発に必要な手順を解説する。

開発・個人開発

Slack Incoming Webhookで通知を作る個人開発のモニタリングに使う実装

Slack Incoming Webhookを使うと、個人開発のサイトから問い合わせ受信・エラー検知・デプロイ完了などをSlackに通知できる。Webhookの設定から実装コードまで、10分で動かせる手順を解説する。

開発・個人開発

静的サイトにアクセス解析を自作する Google Analytics不要の計測設計

Supabaseを使って静的サイトのアクセスデータを自前で計測する仕組みを作れば、Google Analyticsのトラッキングスクリプトなしにページビュー・人気記事・流入元を把握できる。設計と実装を解説する。

開発・個人開発

Supabase Authでメール認証ログインを実装する管理ページの保護に使える

Supabase Authのメール＋パスワード認証を使って、個人開発の管理ページを保護する実装方法を解説する。ログインフォーム・セッション管理・保護ページの作り方をAstroでのコード例とともに示す。

開発・個人開発

Supabase Edge Functionsの基礎サーバーレスAPIをDenoで作る

Supabase Edge FunctionsはDenoで動くサーバーサイドの関数で、APIキーを隠したバックエンド処理・外部API連携・データベースの管理操作に使える。セットアップから実装・デプロイまでを解説する。

開発・個人開発

Supabaseの始め方プロジェクト作成から基本操作まで

SupabaseはPostgreSQLデータベースをAPIで扱えるBaaSで、個人開発に必要なデータベース・認証・ファイル保存を無料プランで始められる。アカウント作成からテーブル作成・データの読み書きまでの手順を解説する。

開発・個人開発

Supabaseの行レベルセキュリティ（RLS）入門設定しないと起きる問題と実装方法

SupabaseのRLS（Row Level Security）を設定していないと、anon keyを使えば誰でもデータベースの全データを読み書きできる。RLSの仕組み・設定方法・よく使うポリシーパターンを実装コードで解説する。

開発・個人開発

Supabaseでアクセス数カウンターを作る静的サイトに動的機能を追加

静的サイトにページビューカウンターを実装するには、Supabaseのデータベースとクライアントサイドのリクエストを組み合わせる。Astro + Supabaseで実際に動くカウンターを作る手順を解説する。

開発・個人開発

Vercelに独自ドメインを設定する手順 DNSからHTTPS化まで

VercelのデフォルトURLから独自ドメインに切り替える手順を解説する。ドメイン取得・DNSレコードの設定・Vercelへの追加・HTTPS化まで、個人開発者が30分で完了できるステップバイステップガイド。

開発・個人開発

Vercelの初期設定とGitHub連携・自動デプロイの手順

VercelとGitHubを連携すると、mainブランチへのプッシュだけで自動的にビルド・デプロイが走る。アカウント作成からプロジェクトの公開URL取得まで、個人開発者が最短で動かせる手順をまとめた。