Bolt.new: Build a Full-Stack App in Minutes

What is Bolt.new?

Building a full-stack app means juggling frameworks, writing boilerplate code, and spending hours setting up databases. Bolt.new solves these challenges by automating the development process.

Bolt.new is an AI-powered app builder that enables developers to create full-stack applications from natural language prompts. Instead of juggling frameworks like React, Rails, or Django and writing endless boilerplate code, you describe what you want, and Bolt generates the front-end, back-end, and deployment-ready code for you.

The workflow is straightforward: describe your idea, let Bolt generate the code, and with built-in integrations like Supabase for authentication and databases, you can launch instantly. It automates the heavy lifting so you can rapidly prototype, test workflows, and push to production without being slowed down by setup or syntax, making Bolt a platform that redefines how apps are imagined, built, and shipped.

To see Bolt.new in action, let’s start by building a simple workout tracker app.

Build a full-stack workout tracker app with Bolt.new

Let’s put Bolt to work by building something practical: a simple workout tracker app. This app will let users log their exercises, track progress, and stay motivated. Over time, they’ll be able to see patterns in their training and make better fitness decisions. Let us start building this app step by step.

Step 1: Get the core screens for the app

We’ll start by generating the first draft of the app with its core screens. Here’s what our app will include:

• A form to log workouts (exercise name, sets, reps, duration, etc.)
• A dashboard to view past workout history
• Basic analytics like total workouts completed and personal bests

Now, we’ll scaffold the app in Bolt.new and generate the first draft of its screens. Before the full prompt, remember the key principle of prompt engineering to be specific about what you want. A vague request (“build me an app”) won’t give you the best results.

Here’s our prompt for the app:

Build a simple Workout Tracker app where users can: 
- Log different types of workouts (exercise name, sets, reps, or duration) 
- View a history of all logged workouts 
- See a progress dashboard that summarizes their activity over time 

Copy to clipboard
Copy to clipboard

Here is a sample output generated by this prompt:

Note: Your output can vary from the one generated here.

This gives us the initial scaffolding with the main navigation and the essential screens we’ll expand on.

Now that the core functionality is in place, it’s time to polish things up and improve the app’s appearance and feel.

Step 2: Enhance the UI design

A functional app is great, but users stick around when it’s also pleasant to use. Bolt lets you refine the design by giving simple follow-up prompts to adjust layout, styling, and interactivity.

Some examples of enhancements we can do are:

• Add workout categories so exercises are neatly grouped.
• Improve the layout by restructuring the dashboard or navigation.
• Style the progress form with colors, spacing, or icons for a cleaner look.

Here’s what we can use for our prompt:

Make the workout tracker app visually appealing by updating the design. Specifically: 
- Add workout categories with clear icons 
- Improve the overall layout for better readability 
- Style the progress form to look clean and modern 
- Apply a consistent color scheme (e.g., calming blues and greens) 

Copy to clipboard
Copy to clipboard

Here’s a sample of what Bolt generates after this prompt:

And that wraps up our UI improvements. Now the app looks polished and user-friendly, but there’s one big gap we still need to fill. How do we actually save user progress, workout history, and login details so they don’t vanish every time the app restarts?

Step 3: Integrate the workout app with Supabase

Supabase is an open-source backend-as-a-service that gives us a ready-made database, authentication, and APIs. We’ll use Supabase to store workout history, personal goals, and login details. This ensures that users don’t lose their data when they refresh or switch devices, and it gives us a way to handle CRUD operations (Create, Read, Update, Delete).

Here’s a sample prompt for our app:

Let's add authorization and store data in Supabase: 
1. The user shouldn’t see the main app UI if they are not logged in. 
2. Authorization will be based on username and password. 
3. Store login details, workout history, and personal preferences in Supabase tables. 
4. Build an edge function to securely handle workout-related queries. 
5. Store sensitive config values in the .env file. 
6. Do you need anything from me? 
7. Provide me with the SQL queries for creating the database tables. 

Copy to clipboard
Copy to clipboard

Note: The reason the prompt includes the line “Do you need anything from me?” is because Project Bolt will often ask for details like the project URL and API key.

SQL queries are commands used to create and manage database tables in Supabase (since it runs on PostgreSQL). We’re asking the AI to generate them so we don’t have to manually design and write the schema for login details, workout history, and personal preferences.

Once this prompt is executed, Bolt.new will generate the SQL queries as follows:

-- Users table (using Supabase auth, but we can add profile info)
CREATE TABLE IF NOT EXISTS user_profiles (
  id uuid PRIMARY KEY REFERENCES auth.users(id) ON DELETE CASCADE,
  username text UNIQUE,
  full_name text,
  avatar_url text,
  created_at timestamptz DEFAULT now(),
  updated_at timestamptz DEFAULT now()
);

-- User preferences table
CREATE TABLE IF NOT EXISTS user_preferences (
  id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
  user_id uuid REFERENCES auth.users(id) ON DELETE CASCADE,
  theme text DEFAULT 'light',
  units text DEFAULT 'imperial', -- imperial or metric
  default_rest_time integer DEFAULT 60, -- seconds
  notifications_enabled boolean DEFAULT true,
  created_at timestamptz DEFAULT now(),
  updated_at timestamptz DEFAULT now()
);

-- Workouts table
CREATE TABLE IF NOT EXISTS workouts (
  id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
  user_id uuid REFERENCES auth.users(id) ON DELETE CASCADE,
  name text NOT NULL,
  date timestamptz NOT NULL,
  total_duration integer NOT NULL, -- minutes
  notes text,
  created_at timestamptz DEFAULT now(),
  updated_at timestamptz DEFAULT now()
);

-- Exercises table
CREATE TABLE IF NOT EXISTS exercises (
  id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
  workout_id uuid REFERENCES workouts(id) ON DELETE CASCADE,
  name text NOT NULL,
  type text NOT NULL CHECK (type IN ('strength', 'cardio', 'flexibility')),
  sets integer,
  reps integer,
  weight numeric,
  duration integer, -- minutes
  distance numeric, -- miles/km
  notes text,
  order_index integer NOT NULL DEFAULT 0,
  created_at timestamptz DEFAULT now()
);

-- Row Level Security
ALTER TABLE user_profiles ENABLE ROW LEVEL SECURITY;
ALTER TABLE user_preferences ENABLE ROW LEVEL SECURITY;
ALTER TABLE workouts ENABLE ROW LEVEL SECURITY;
ALTER TABLE exercises ENABLE ROW LEVEL SECURITY;

-- RLS Policies
CREATE POLICY "Users can read own profile" ON user_profiles FOR SELECT TO authenticated USING (auth.uid() = id);
CREATE POLICY "Users can update own profile" ON user_profiles FOR UPDATE TO authenticated USING (auth.uid() = id);
CREATE POLICY "Users can insert own profile" ON user_profiles FOR INSERT TO authenticated WITH CHECK (auth.uid() = id);

CREATE POLICY "Users can manage own preferences" ON user_preferences FOR ALL TO authenticated USING (auth.uid() = user_id);

CREATE POLICY "Users can manage own workouts" ON workouts FOR ALL TO authenticated USING (auth.uid() = user_id);

CREATE POLICY "Users can manage own exercises" ON exercises FOR ALL TO authenticated USING (
  auth.uid() = (SELECT user_id FROM workouts WHERE workouts.id = exercises.workout_id)
);

-- Indexes for performance
CREATE INDEX IF NOT EXISTS idx_workouts_user_id ON workouts(user_id);
CREATE INDEX IF NOT EXISTS idx_workouts_date ON workouts(date DESC);
CREATE INDEX IF NOT EXISTS idx_exercises_workout_id ON exercises(workout_id);
CREATE INDEX IF NOT EXISTS idx_exercises_order ON exercises(workout_id, order_index);

Copy to clipboard
Copy to clipboard

Note: This is just an example query.

Follow the steps here to integrate your app with Supabase:

1. Copy the SQL queries generated by Bolt.new

2. Choose the Supabase option from the Integrations section.

3. You’ll land on the dashboard of Supabase. From here, select the “New project” option.

4. Enter the required project details.

5. Select the SQL Editor option from the left menu.

6. Paste the SQL queries copied earlier from Bolt.new and select the “Run” button. This will execute the SQL queries. If there are no errors, you’ll see a “Success” message in the terminal. You’ll see a success message in the terminal if there are no errors.

7. Verify if the tables have been generated by selecting the “Table Editor” option from the left menu.

8. You should see tables created inside this table editor:

9. Navigate to “Authentication” tab from the menu bar.

10. Under this, search for the “Sign In/Providers” option. Disable the “Confirm email” option here. This ensures that the user email need not be confirmed during account creation.

11. Head back to the “Project overview” tab from the menu.

12. From here, copy the project URL and the API key. We’ll prompt both of these to Bolt.new to finish the Supabase integration.

13. Give the following information to Bolt.new:

Here is the Project URL: <Enter your URL here> and API key: <Enter your API key here>. 

Copy to clipboard
Copy to clipboard

Note: Enter your actual URL and API key in the prompt.

You’ve now successfully connected the WorkTracker app with Supabase, set up authentication, and ensured data is being stored securely.

Step 4: Testing the final app

With Supabase in place, the next step is to make sure everything works smoothly. Test the app thoroughly and confirm that data is being stored, retrieved, and displayed as expected. Here are a few quick checks:

• Log in with valid credentials and ensure the app loads correctly.

• Add some data (like chat messages or favorites) and confirm it appears in Supabase.

• Log out and back in to verify the saved data is still there.

• Keep checking the Supbase tables to ensure data is fetched and stored properly in the database

That’s it! You’ve confirmed that authentication works, data flows correctly to Supabase, and your app is behaving as expected.

So now that everything runs locally, the real question is how do we get this app live with Bolt.new?

How to deploy apps with Bolt.new

Once your app is built and tested, hosting it live is the next step. Bolt.new gives you two clear paths to get your Workout Tracker online and shareable:

1. Bolt hosting

Bolt now offers built-in hosting, so you can publish your project instantly with no servers, no third-party setup required. New Bolt projects are published to a .bolt.host URL by default. You just select the “Publish” button, wait a minute, and your app is live with SSL included.

1. Export the code and host anywhere

Prefer deploying via your own platform? Bolt lets you export the full codebase. You can push this to GitHub and then deploy on platforms like Vercel, Netlify, or Render using their usual CI/CD workflows. This gives you full control over domains, environment variables, and deployment settings.

Now that you know how to get your app live, let’s break down the key features that make Bolt stand out for developers.

Key features of Bolt.new

Bolt.new is designed to speed up development while keeping things flexible and developer-friendly. Here are the features that set it apart:

1. Natural language prompt-to-app generation: You can describe what you want in plain English, and Bolt will generate the code. This helps you get a working prototype in minutes.

2. Full-stack scaffolding: Bolt doesn’t stop at UI screens. It can spin up frontend, backend, and even database layers in one go, giving you a solid foundation to build on.

3. Built-in Supabase integration: Authentication, database storage, and APIs are already wired up with Supabase. Instead of spending hours configuring, you can connect your app to a production-ready backend.

4. Quick deployment workflow: Once your app is ready, deploying it is just a few clicks away. Bolt takes care of the hosting and configuration so you can focus on building, not DevOps.

5. Collaboration and export to GitHub: You can invite teammates to work with you inside the platform or export the full codebase to GitHub whenever you’re ready to take the project further.

In short, Bolt.new is designed to accelerate development without sacrificing flexibility or control.

Let’s look at some best practices for using Bolt.new effectively.

Best practices for using Bolt.new

Getting the most out of Bolt.new isn’t just about knowing what it can do, it’s about how you use it. A few small habits can make a big difference in your workflow. Here are a few points:

• Write prompts that are clear and detailed so the AI knows exactly what to build.

• Begin with a simple version of your project, then improve it step by step.

• Rely on Bolt’s iterative prompt system to test ideas and polish the UI.

• Export projects early to keep versions saved and avoid losing work.

By keeping these practices in mind, you’ll make Bolt a powerful ally in building apps faster and smarter.

Conclusion

Bolt.new is an AI-powered app builder that transforms how developers prototype and ship full-stack applications. From natural language prompts to full-stack scaffolding, Supabase integration, and quick deployment, Bolt streamlines every step helping you build, refine, and launch your Workout Tracker without running into setup friction or configuration overhead.

Learn the foundations of AI, prompt engineering, and practical workflows in Codecademy’s Generative AI for Everyone Skill Path.

Frequently asked questions

1. What does Bolt New do?

Bolt New is an AI-powered development tool that helps developers quickly generate, test, and refine code. It speeds up the software creation process by combining AI assistance with real-time coding support.

2. Is Bolt New free?

Bolt New offers a free tier for developers to try out its core features. However, more advanced capabilities and higher usage limits are available under paid plans.

3. Who is the CEO of Bolt New?

The CEO of Bolt New is Shafi Khan, who is leading the company’s efforts to transform AI-assisted software development.

4. Is Bolt New an AI agent?

Yes, Bolt New functions as an AI agent designed for developers. It assists with code generation, debugging, and iterative improvements, making development faster and smarter.

5. Is Bolt New full stack?

Yes, Bolt New can be considered full stack. It supports developers in building across frontend, backend, and integration layers, making it useful for end-to-end software projects.

6. Is Cursor better than Bolt New?

Cursor and Bolt New are AI-powered coding tools, but they serve slightly different purposes. Cursor focuses on AI pair programming inside an editor, while Bolt New emphasizes building, testing, and refining applications with AI support. The better option depends on the developer’s workflow and project needs.