AIとつくる はじめてのWeb開発実践講座完全無料
中級編のカリキュラムへ

中級編約30分

中級⑥ アクセス解析で改善ループを回す

勘ではなくデータで育てる。見る→1つ直す→また見る、のループへ

中級編、最終回です。④で「見つけてもらう」装備を付けました。今日は見つけてくれた人が、どこを読んで、どこで帰ってしまうのかを見えるようにします。サービスを育てる最後のピース——アクセス解析です。

今日のゴール

解析を2段構えで入れます。①Vercel Analytics（2分で入る・まずはこれ）②GA4（Googleアナリティクス。流入元まで見たい人向け）。そして一番大事な「何を見て、どう直すか」のループを覚えます。

STEP1：Vercel Analytics——まず2分で計測開始

  1. Vercelのmy-appのダッシュボード→「Analytics」タブ→Enable。
  2. AIに頼む：「@vercel/analytics を導入して、layout.tsx に組み込んで。mainに反映して」。
  3. 公開URLを自分で何ページか見て回る→Analyticsタブにアクセスが現れたら計測開始！

これだけで「どのページが何回見られたか」「訪問者数」が分かります。個人サービスの解析は、正直これで8割足ります。

STEP2：GA4——本格派の無料解析（やりたい人向け）

「どこから来たのか（検索？SNS？）」「スマホとPCの割合」まで見たくなったら、定番の GA4（Googleアナリティクス4） を足します。

  1. analytics.google.com でアカウントとプロパティを作成（サイト名・タイムゾーン日本・通貨JPY）。
  2. 「データストリーム」でWebを選び、公開URLを登録→ 測定ID（G-で始まる） をコピー。
  3. AIに頼む（下のプロンプト）→Vercelの環境変数に NEXT_PUBLIC_GA_ID ＝測定IDを追加→Redeploy。
GA4を導入して。@next/third-parties の GoogleAnalytics コンポーネントを使い、測定IDは環境変数 NEXT_PUBLIC_GA_ID から読む。IDが未設定のときは何も読み込まないようにして。まず計画を見せて。

今回はNEXT_PUBLIC_で正解——理由を言えますか？

②③では「秘密の鍵にNEXT_PUBLIC_は厳禁」でした。でも測定IDはブラウザが計測データを送る宛先で、ページを見れば誰でも分かる公開前提の値。Supabaseのanonキーと同じ理屈です。「この値は漏れたら困るか？」で判断する——もう完全に身についていますね。

設定できたら、GA4の「リアルタイム」画面を開いたまま自分のサイトをスマホで開く——地図に自分が1人現れたら成功です（ちょっと感動します）。

STEP3：何を見るか——最初は3つだけ

よく見られているページ
あなたの“勝ちページ”。ここを磨く・ここから他ページへ誘導する。
流入元（GA4）
検索・SNS・直接。多い経路をさらに伸ばすのが効率的。
すぐ帰られているページ
期待と中身がズレているサイン。見出しか冒頭を直す候補。

STEP4：改善ループを1周してみる

  1. データを見る：一番見られているページと、すぐ帰られているページを1つずつ特定。
  2. 仮説を立てる：「冒頭が分かりにくい？」「次に進むリンクがない？」
  3. 1つだけ直す（AIに頼む）：「このページの冒頭に、何ができるかの一文とボタンを足して」など。
  4. 1〜2週間後にまた見る：数字が動いたか確認。動いたら勝ちパターン、動かなければ次の仮説へ。

プライバシーへの配慮を忘れずに

アクセス解析を入れたら、プライバシーポリシーに「アクセス解析ツールを使用しています」と明記するのがマナーであり義務です。「プライバシーポリシーのページを作って。GA4とVercel Analyticsの利用を明記して」とAIに頼んでおきましょう。法務まわりの本格対応は上級編③でやります。

おさらい：今日使った“言葉”

Vercel Analytics
2分で入る計測。ページ別の閲覧数と訪問者数。まずこれ。
GA4
Googleの無料解析。流入元・端末・リアルタイムまで見える定番。
測定ID
G-で始まる公開前提のID。だからNEXT_PUBLIC_でOK。
改善ループ
見る→仮説→1つ直す→また見る。勘ではなくデータで育てる。

中級⑥・完成チェック

0 / 4

つまずいたら

①GA4に何も出ない→測定IDのスペル・Redeploy・広告ブロッカー（自分のブラウザの拡張機能が計測を止めていることも）を確認。②リアルタイムに出るのに翌日のレポートが空→集計には1日かかります。③数字が少なくて凹む→全員ここから。④の集客装備とSNSでの発信が効いてくるのを待ちつつ、改善ループを回しましょう。

🎉 中級編、コンプリート！

おめでとうございます！あなたのサービスはいま、AIの開発装備・問い合わせ窓口・AI機能・集客装備・テスト・解析を備えた“運営されているWebサービス”です。上級編では、ここに決済（Stripe）・有料プラン・法務・自動化を加えて、“事業として続けられるプロダクト”に仕上げます（準備中）。それまで、改善ループを回しながら待っていてください。