第2話｜Next.jsもSupabaseも知らない。でも、なぜかログイン画面ができていった

森山卓｜オンラインスクール運営15年

2026年8月25日 20:04

前回、Cursorをインストールして、「英検対策アプリを作りたい」
と、頭の中にあることをそのまま書いてみました。

するとCursorは、すぐに開発の構成を提案してきました。

Next.js
Tailwind CSS

……知らない。

正確に言えば、名前を見たことはありました。
でも、自分で使ったことはありません。

これまで私が触ってきたのは、PHPやPerl、Node.jsなど。
CSSのフレームワークも、Bootstrapを使うことがほとんどでした。

だから最初は、

「これ、自分が分からない技術で作って大丈夫なのかな？」

という不安がありました。

何かトラブルが起きたとき、自分で直せないかもしれない。
今までなら、それはかなり怖いことでした。

でも、ふと思いました。

デバッグもAIにお願いするのであれば、自分がすべて理解している必要はないのかもしれない。

もちろん、何も知らなくていいとは思いません。

でも最初から、「自分が使ったことのある技術だけで作ってください」
と制限する必要もない。

せっかくAIと一緒に開発するなら、今回はCursorの提案に任せてみよう。
そう思って、「OK！」と返しました。

すると、開発が始まりました。

最初に作り始めたのは、ログイン機能でした

英検対策アプリとして提供するのであれば、ユーザー登録が必要です。
ログインも必要になります。

そこでCursorが、

「まず認証機能から作りましょう」

と進め始めました。

すると、また知らない言葉が出てきます。

Supabase。

「何だろう？」

調べてみると、データベースや認証などをまとめて扱えるサービスらしい。

私がこれまでデータベースを触るときは、MySQL、phpMyAdmin。
そんな環境が当たり前でした。

Webブラウザ上でデータベースを作り、認証まで管理できる。
それ自体が、かなり新鮮でした。

Cursorに言われるままSupabaseへ登録しました。

プロジェクトを作る。
APIキーを発行する。
.envというファイルにキーを書く。

一つひとつ進めていきます。

正直、この時点では、

自分が何をしているのか、半分くらいしか分かっていなかった

と思います。

ただ、Cursorは次に何をすればいいのかを教えてくれます。

分からない言葉が出てきたら、「これは何？」と聞けばいい。
すると説明してくれる。

その繰り返しで進んでいきました。

サーバーにFTPでアップしないの？

さらに驚いたのが、公開方法でした。

これまでWeb制作をしてきた私にとって、
ホームページを公開する＝サーバーへFTPでアップロードする
という感覚がかなり強く残っています。

ConoHaなどのサーバーへ接続する。
ファイルをアップする。
表示を確認する。

長い間、それが普通でした。

ところが今回、Cursorが提案したのは、

GitHubへコードを置いて、
Vercelから公開する。

という方法でした。

また知らない世界です。

GitHub自体は知っていました。
でも、自分が一人で作るサービスをGitHub経由でVercelへ公開する、という流れは経験したことがありません。

しかも、GitHubへ更新すると、その内容が自動的に反映されていく。

「FTPでファイルをアップしなくていいの？」

最初は、本当にそんな感覚でした。

Next.js
Tailwind CSS
Supabase
GitHub
Vercel

数時間の間に、今までほとんど使ったことのないものが次々に登場します。私の頭の中も、新しい情報を書き込むので必死でした。

でも、ログインできた

そんな状態で進めていたのですが、あるところまで来て実際に画面を開いてみました。

会員登録フォームがあります。
メールアドレスとパスワードを入力する。
登録する。
そして、ログインしてみる。

ログインできました。

当たり前のことのようですが、この瞬間は結構感動しました。

つい少し前まで、「Supabaseって何？」と言っていた自分のPC上で、

会員登録ができて、
データベースにユーザー情報が保存されて、
ログインまでできています。

しかも、その大部分を自分でコードを書いていません。

そのとき初めて、

「これ、本当にアプリを作れるかもしれない」

と思いました。

今までなら、「知らないから使わない」でした

振り返ると、これまでの私は、新しい技術を使うときに、

「何かあったときに自分で直せるか」

をかなり気にしていました。

だから、どうしても使い慣れた技術を選びます。

PHP
MySQL
Bootstrap

もちろん、それ自体が悪いわけではありません。

使い慣れているので、速く作れます。
トラブルにも対応できます。

でもAIと一緒に開発すると、その前提が少し変わりました。

分からなければ聞けばいい。
エラーが出たら、そのエラーをAIに見てもらえばいい。
コードの意味が分からなければ、説明してもらえばいい。

つまり、

「全部理解してから使う」必要がなくなった。

まず使ってみる。
動かしてみる。
必要になったところで理解する。

そんな学び方ができるようになりました。

「知らない」は、開発を止める理由ではなくなった

もちろん、この後も知らないものは大量に出てきます。
むしろ、開発が進むほど増えていきました。

でも、このログイン機能が完成したことで、私の中で一つ考え方が変わりました。

知らない技術が出てきたら、避けるのではなく、

その都度覚えればいい。

そして、すべてを完璧に理解しようとする必要もない。

自分が判断するために必要なところは理解する。
細かな実装はAIに助けてもらう。

この分担なら、自分でも進められるかもしれない。
そう思えるようになりました。

第1話では、

「もしかしたらアプリを作れるかもしれない」

という状態でした。

でも、このログイン画面が動いた瞬間、

「よし、このまま本当に作ってみよう」

に変わりました。

ここから、英検対策アプリ「AiKen」の本格的な開発が始まります。

次回は、ログインの次に何を作ったのか。
そして、英検対策アプリらしい機能が少しずつ形になっていったところを書いてみたいと思います。

※「AIと一人で、アプリを作る。｜AiKen開発記」マガジン連載中

（第5話、2026年9月1日　更新予定です）