instant

Whirlwind tour: Build a full-stack app with InstantDB

👋 Hey there!

In this tutorial we'll walk through creating a full-stack app with InstantDB. Within 5-10 minutes you'll have an app that runs on your computer, and if you like, can be deployed into the wild!

What we'll do:

  1. 1.Login to Instant in the terminal
  2. 2.Scaffold a starter Instant app
  3. 3.Prompt an LLM to build us an app (This is the fun part!)
  4. 4.Deploy the app to Vercel

1. Log in to Instant via instant-cli

As a first step let's make sure you're logged in. Run the following command in the terminal with your favorite package manager.

npx instant-cli login

This will open up a browser window where you can log in to your Instant account or sign up if you don't have one yet.

2. Scaffold a starter instant app

Now that you're authenticated any app you make will persist unless you delete the data later — woohoo!

As a next step we'll use create-instant-app, our CLI tool, which makes it super easy to get started with a new Instant project. Run the following in your terminal.

npx create-instant-app

Go through the prompts to select your framework and llm. Once the app is generated change into the new directory and go on to step 3!

3. Prompt the LLM to build us an app! (This is the fun part!)

Woohoo! Now that we've got everything set up, we're ready to build an app! Fire up your editor (cursor, windsurf, zed, etc.) or your CLI tool (claude, gemini, etc) and type up a prompt. Hit enter and watch the magic happen!

Here are some example prompts for inspiration

Habit Tracker
Create a habit tracking app where users can create habits, mark daily completions, and visualize streaks. Include features for setting habit frequency (daily/weekly), viewing completion calendars, and tracking overall progress percentages. Keep the code to < 1000 lines. Seed with 5-6 sample habits like "Exercise", "Read", "Meditate" with 30 days of completion history.
Trivia Game
Use InstantDB to create a trivia game with multiple-choice questions, score tracking, and category selection. Players should see immediate feedback on answers, track their high scores, and compete on a leaderboard. Keep the code to < 1000 lines. Seed with 30-40 questions across categories like "Science", "History", "Sports", and "Entertainment".
Job Board
Build a job board app where employers can post jobs and job seekers can browse and save listings. Include filtering by job type, location, and salary range, plus a simple application tracking system. Keep the code to < 1000 lines. Seed with 15-20 job listings across categories like "Engineering", "Design", "Marketing" with various companies and locations.

Debugging Common Issues

Run into an issue? Here are solutions to common problems you might encounter:

4. Deploy the app to Vercel

Once you've got a working app we can get it live by deploying to Vercel! Before we deploy, let's verify there are no build errors. In the terminal run:

npm run build

If there are build errors, paste them into your agent to get them fixed up. Make sure your app still works as expected after your agent gets the build to pass:

npm run dev

If all looks well let's kick off a deploy!

npx vercel --prod

Your app should be live after vercel finishes deploying! If you see any error about a missing app-id it means we need to add it to the vercel environment. Run this command

npx vercel env add NEXT_PUBLIC_INSTANT_APP_ID production

and it will prompt you to paste your app id. You can find the value in your .env file. Redeploy and you should have a fully-working app.

Huzzah! If you're curious, you can go to your Instant dashboard and see your data in the Explorer tab as you interact with your app.

🎉

Show off your creation!

We'd love to see what you built! Tweet us @instant_db and we'll amplify your awesome creations to the community.

🧡Share on Twitter
Instant
Engineered in San Francisco
HiringDiscordGitHubStatusPrivacy PolicyTerms