制作中・近日公開
プレミアム講座
“読む”から“作る”へ。実際に作って世界へ公開するハンズオンと、ページ内だけで完結する言語別ドリルの2本立てで、はじめての1ページから収益化まで“作りきる”講座を準備しています。
🛠 ハンズオン
- 超初級編
はじめての“作って、世界に出す”
ブラウザだけでAIと一緒に初めてのWebページを作り、世界に公開するまでを体験します。インストールは0個。
- ハンズオン① 自分の手で、はじめてのWebページ
- ハンズオン② ブラウザだけで始めるClaude Code
- ハンズオン③ 自己紹介サイトをAIと一緒に作る
- ハンズオン④ 作ったサイトを世界に公開する
- 番外編 自分のPCでClaude Codeを動かす
- 初級編
“1枚のページ”から“本物のアプリ”へ
Next.jsとSupabaseを使って、ログインとデータ保存のあるミニアプリを作って公開できるようになります。
- 初級① Next.jsプロジェクトをAIと立ち上げる
- 初級② ページを増やして、部品に分ける
- 初級③ デザインを整える
- 初級④ ログインをつける
- 初級⑤ データを保存する
- 初級⑥ 公開を仕上げて、独自ドメインをつなぐ
- 番外編 画像アップロードをつける（保存先の選び方つき）
- 中級編
“動くアプリ”を“使われるサービス”に
AI機能・集客・運用の型を備えて、実際に人に使ってもらえるサービスに育てます。
- 中級① 開発環境を本格化する（CLAUDE.md・スキル・MCP）
- 中級② お問い合わせフォームとメール通知をつける
- 中級③ アプリにAIを組み込む（Claude API）
- 中級④ SEO・OGP・AI検索対応を実装する
- 中級⑤ テストと公開前チェックの型を作る
- 中級⑥ アクセス解析で改善ループを回す
- 上級編
収益化して、続けられるプロダクトに
決済・会員制・法務・自動化まで備えた、“事業として続けられる”プロダクトにします。
- 上級① Stripeで決済をつける
- 上級② 有料プランの出し分けを作る
- 上級③ 公開に必要な法務ページ
- 上級④ 運用を自動化する
- 上級⑤ セキュリティ総点検
- 上級⑥ 成長させる
✍️ 言語別ドリル
- ドリル
HTML・CSS
このページの中だけで完結する練習帳。書いて→すぐ反映で、骨組みと見た目の言葉を体に入れます。
- HTMLドリル① 骨組みのタグを手に入れる
- CSSドリル① 色・文字・余白を自在にする
- CSSドリル② flexboxで“並べる”
- HTML・CSSドリル③ ミニページを丸ごと組む
- HTML・CSSドリル④ スマホ対応（レスポンシブ）
- ドリル
JavaScript
「押したら変わる」から「入力に反応する」へ。動きのプログラムを、書いて→すぐ確認。
- JSドリル① はじめての“動き”
- JSドリル② 入力に反応する
- JSドリル③ リストと繰り返し
- JSドリル④ 保存してみる（localStorage）
- ドリル
React・Next.js
画面を“部品”として作るReactの考え方を、ページ内のミニ実行環境で体験します。
- Reactドリル① はじめてのコンポーネント
- Reactドリル② propsで使い回す
- Reactドリル③ useStateで動かす（状態）
- Next.jsドリル① 仕組みまるわかり