SUPACODEAI STUDIO
無料で始める
活用例 · Next.jsアプリ

Next.jsのフルスタックアプリをAIで作る

アプリを説明すると、SupacodeがページやサーバーのコードやAPIルートを含めてNext.jsで書き上げます。データとログインにはご自身のSupabaseプロジェクトを接続し、ライブプレビューで動きを確かめて、ご自身のVercelアカウントにデプロイできます。

このアイデアで作り始める 料金を見る

このプロンプトが入力された状態で作成画面が開きます。作成前に自由に編集でき、実行前に必要なクレジットが表示されます。

作成の流れ

  1. アプリを説明する

    ページ構成、扱うデータ、誰が何をできるかを伝えます。構成でNext.jsを選んでください。

  2. Supabaseを接続する

    「バックエンド」タブでSupabaseプロジェクトを接続します。Supacodeがマイグレーションを書き、承認したあとにだけ実行します。

  3. デプロイする

    「公開」メニューからご自身のVercelアカウントにデプロイするか、コードをGitHubにプッシュします。

依頼できること

プロンプト例：ログイン付きのNext.jsアプリ：ユーザーがメモを作成・編集・削除でき、メモはSupabaseのデータベースに保存され、各ユーザーには自分のメモだけが表示されるようにしてください。

ギャラリーの作品例

すべて見る

よくある質問

プレビューでサーバーのコードも動きますか？

はい。Next.jsのプロジェクトは隔離されたサンドボックスで動くので、デプロイ前にページやAPIルートを試せます。

データベースやホスティングは誰のものですか？

あなたのものです。データベースはご自身のSupabaseプロジェクト、デプロイ先はご自身のVercelアカウントです。

プロジェクトを書き出せますか？

はい。zipでダウンロードするか、GitHubにプッシュして、どこでも開発を続けられます。

あなたのアイデアで試してみましょう

毎日もらえる無料クレジットで始められます。変更はすべてバージョンとして保存され、いつでも復元できます。

作り始める