英語学習歴10年・外資系勤務・TOEIC860のフロントエンドエンジニアが、子育ての合間に「自分が欲しかったツール」を作った話です。
YouTubeを見ながら、何度も一時停止していた
10年近く趣味でゆるく英語を勉強してきた。バックパッカーで海外を回り、英語話者の友人もそれなりにいる。会話はそれなりにでき、意思疎通で困ることはあまりない。
それでも、ずっと気になっていることがあった。
自分の英語、ワンパターンなんだよなあ。
"I think〜" "That's interesting" "It's important to〜"
言いたいことは伝わる。でも、海外の友人と話していると、彼らはもっとシンプルな単語しか使っていないのに、なぜかこなれた感じがある。単語の難易度の問題じゃない。「表現の選び方」が違うのだと気づいた。
YouTubeで海外のドキュメンタリーやトークショーを見るときは、知らない表現が出るたびに一時停止してメモを取っていた。
"get the hang of it" → コツをつかむ
"pull it off" → やり遂げる
"back me up" → 支持する
でも、見終わるころには何をメモしたか忘れている。30分の動画で10回止めると、もはや英語学習なのかメモ作業なのかわからなくなってくる。
「このメモ作業、自動でやってくれるツールがあればいいのに」
そこから開発をスタートしました。
作ったもの
LinguistLens(https://linguistlens.app)
YouTubeや英語記事のURLを貼るだけで、AIが「本当に使える表現」を自動で抽出・解説してくれるサービスです。
YouTubeを一時停止してメモを取る、あの作業をゼロにするのがコアコンセプトです。
主な機能
- URL入力 → 表現自動抽出:YouTubeや英語記事のURLを入れると、ネイティブの自然な表現をAIがニュアンス解説付きで抽出
- 日本人がパッと出てこない表現一覧:レベル別に整理
- フラッシュカード:保存した表現を使って復習
- 文法コアイメージ解説:ネイティブの感覚で理解するための解説ページ
- レベル別記事:AI生成の英語学習記事
- 音声機能:例文の発音確認
ターゲットは英語中上級者。TOEIC 700点台〜のスコアは取れるけど、会話がワンパターンで伸び悩んでいる層です。初心者向け英語学習アプリに物足りなさを感じている、でもコーチングは高すぎる、という人。自分自身がそうなので、ニーズに確信はあります。
技術構成
スタック全体像
| レイヤー | 技術 | 選んだ理由 |
|---|---|---|
| フロントエンド | Next.js(App Router) | Server Componentsでバンドル最小化 |
| 認証 | Clerk | Middlewareだけで認証ルーティング完結 |
| DB | Supabase | RLSでユーザーデータ分離、管理が楽 |
| AI | Claude API(Anthropic) | 解析精度が高く、構造化出力が安定 |
| 決済 | Stripe(Checkout + Webhook) | 個人開発の定番。最小構成で導入 |
| インフラ | Vercel | Next.jsと相性◎、インフラ管理ゼロ |
AIまわりで一番時間をかけた部分
表現抽出のプロンプト設計です。最初はシンプルな指示を与えていましたが、ハルシネーションが多く、存在しない表現や不自然な解説が頻繁に出てきた。
解決策は穴埋めテンプレート形式での出力拘束です。
【出力テンプレート】
表現: [抽出した表現]
意味: [日本語で一言]
コアイメージ: [視覚的なイメージを40文字以内で]
使う場面: [具体的なシーンを20文字以内で]
例文: [原文から抜粋または類似例文]
[ ]の部分だけを埋めさせる形にしたら、品質が大幅に安定しました。LLMへの指示は「自由に書いて」より「この枠を埋めて」のほうがいい、というのは他のプロダクトにも応用できる知見だと思います。
pSEO自動記事生成(GitHub Actions)
集客の自動化として、GitHub Actionsで1日2本の英語学習記事を自動生成・公開しています。
# .github/workflows/generate-articles.yml
on:
schedule:
- cron: '0 0 * * *' # 毎日UTC 0:00
workflow_dispatch:
jobs:
generate:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- run: npm ci
- run: npm run generate-seo-article
- uses: stefanzweifel/git-auto-commit-action@v5
記事の内容はAIが生成し、Next.jsのSSGで静的ページとしてビルド。サーバーコストはゼロです。これをprogrammatic SEO(pSEO)として回し、オーガニック流入の土台を作っています。
Supabase RLSの設計方針
ユーザーごとのデータ分離はRLS(Row Level Security)で実現しています。方針はシンプルで:
- すべてのテーブルにRLSを有効化
-
auth.uid() = user_idのポリシーを基本形として統一 - サービスロールキーはサーバーサイドAPIルートでのみ使用
個人開発でここまでやる必要があるかは議論の余地がありますが、Supabaseだとダッシュボードからポチポチ設定するだけなので、コスト対効果は高いです。
子育て中1ヶ月開発のリアル
使える時間は1日最大2時間です。子どもの昼寝の隙間1時間と就寝後。まとまった時間はほぼ取れない。
これが意外にも、開発の質を上げました。
時間がないので「今日はこのコンポーネントだけ」と範囲を決めざるを得ない。実装前に設計をきちんと考える癖がつく。試行錯誤している余裕がないから、Claude Codeで設計を相談してから書き始める。
結果として、行き当たりばったりのコードが減りました。
1ヶ月で形にできた理由を振り返ると:
- Clerk・Supabase・Vercel で「作るべきもの以外」を全部アウトソース
- Claude Code + Cursor で設計とレビューをAIに任せる
- 自分が欲しいものを作る から仕様で迷わない
3番目が一番大きいかもしれません。ターゲットが自分自身なので、「この機能いる?」で悩む時間がほぼゼロでした。
現在地と反省
2026年3月末にローンチしました。
作ることには自信があっても、集客は苦手——これが次の山だと実感しています。個人開発あるあるな気がしますが、正直に書いておきます。
現在はpSEOで自動記事を回しつつ、オーガニック流入が育つのを待っているフェーズです。SNS運用は試みましたが自分には合わず、書いたら放置できる施策に絞る方針に落ち着きました。個人開発者が集客まで全部やるのは本当に大変です。
英語の中上級者で「YouTubeを見ているのに表現が増えない」「会話はできるのにワンパターン」という悩みを持っている方、ぜひ試してみてください。
まとめ
| 項目 | 内容 |
|---|---|
| 開発期間 | 約1ヶ月(1日2時間) |
| 技術スタック | Next.js / Clerk / Supabase / Claude API / Stripe / Vercel |
| ターゲット | 英語中上級者(TOEIC 700点台〜) |
| 価格 | 月額980円 / 年額7,800円 |
| 現状 | ローンチ済み・pSEOで集客中 |