How to Integrate Bolt.new with Postman

Before you can use Postman to test anything, your Bolt app needs to be publicly accessible. Bolt's WebContainer environment during development runs inside a browser tab with a temporary internal URL that is only accessible within that browser session. Postman cannot reach this URL — it has no internet address. The fastest path to a testable URL is Bolt's built-in publish feature. In the top-right corner of the Bolt editor, click the 'Publish' button. Bolt builds your project and deploys it to Bolt Cloud (*.bolt.host) or, if you have connected Netlify in Settings > Applications, to Netlify (*.netlify.app). The build and deploy process takes 30-90 seconds. Once complete, Bolt shows you the live URL. Alternatively, if you have already connected Bolt to GitHub (via the Git panel) and set up Netlify to watch that repository, every push from Bolt automatically creates a new deployment. The Netlify URL is stable between deployments and is the URL you will use throughout your Postman testing. After deployment, do a quick browser check first: open the deployed URL and click through the app to verify the UI loads correctly and the basic functionality works. This is a sanity check before you start API-level testing. If the app does not load, there is likely a build or environment variable issue to resolve before Postman testing is useful. Important note: if your Bolt app uses environment variables (Supabase URL, API keys), you need to add these to the hosting platform's environment settings — not just the .env file in Bolt. For Netlify: Site Settings > Environment Variables. For Bolt Cloud: the Secrets tab in Bolt's editor. Variables missing from the production environment are the single most common cause of API routes failing in deployment while working in Bolt's preview.

A Postman collection is an organized folder of API requests. Creating one for your Bolt app gives you a reusable test suite that you can run after every deployment to verify everything still works correctly. In Postman, click 'New' in the top-left sidebar, then select 'Collection.' Name it after your Bolt app (e.g., 'My Bolt App API'). Inside the collection, you will create one request for each API route in your Bolt project. For each API route: right-click the collection and select 'Add request.' Set the HTTP method to match the route handler (GET for data fetching, POST for data submission, PUT/PATCH for updates, DELETE for deletions). Enter the full URL to your deployed endpoint — for example, https://your-app.netlify.app/api/weather/London for a weather route. For routes that require authentication (an Authorization header with a bearer token, or API key headers), add these in the Headers tab of the request. If your Bolt app uses Supabase Auth, the frontend sends a JWT token in the Authorization header — you can get a test token from Supabase's auth dashboard or by logging in to your deployed app and extracting the token from browser DevTools (Network tab > any authenticated request > Authorization header). Send the first request and look at the response. Postman shows the HTTP status code (200, 401, 404, 500), the response time in milliseconds, and the full response body. Verify that the response matches what your Bolt component expects to receive. If the response is incorrect or the status is an error, use this information to go back to Bolt and debug the API route.

1// Example: testing a Bolt Next.js API route in Postman
2// Route: GET https://your-app.netlify.app/api/users
3//
4// Expected request in Postman:
5// Method: GET
6// URL: https://your-app.netlify.app/api/users
7// Headers:
8//   Authorization: Bearer {{jwt_token}}
9//   Content-Type: application/json
10//
11// Expected successful response (200 OK):
12// {
13//   "users": [
14//     { "id": "uuid", "email": "user@example.com", "created_at": "..." }
15//   ],
16//   "count": 1
17// }
18//
19// Expected error response (401 Unauthorized) when no auth header:
20// { "error": "Unauthorized" }

Postman environments let you switch between different URL configurations without editing each request manually. For Bolt development, you will typically have at least two environments: a staging environment pointing to your Netlify preview URL, and a production environment pointing to your production domain (if you have a custom domain configured). To create environments in Postman: click the 'Environments' icon in the left sidebar (gear icon), then 'Create Environment.' Create one environment named 'Bolt Dev/Staging' and another named 'Bolt Production.' In each environment, add a variable named BASE_URL with the corresponding deployment URL as the value. Update your collection requests to use the variable: replace the hardcoded URL prefix (https://your-app.netlify.app) with {{BASE_URL}} in each request URL. For example, GET {{BASE_URL}}/api/weather/London. When you select 'Bolt Dev/Staging' as the active environment, {{BASE_URL}} resolves to the staging URL; switch to 'Bolt Production' and the same request tests the production URL. Also add authentication tokens and API keys as environment variables. An apiKey variable and jwtToken variable in the environment let you store these sensitive values outside the collection itself — Postman environments can be kept private and not exported with collection sharing, keeping credentials separate from test logic. For Bolt's WebContainer limitation: you cannot create a 'Bolt Preview' environment with a local preview URL — that URL only exists within the browser tab running Bolt. The closest equivalent is running the exported project locally with npm run dev (after exporting via GitHub) and using http://localhost:5173 as the base URL for a 'Local Dev' environment.

1// Postman environment variables to set up:
2// Environment: 'Bolt Dev (Netlify)'
3// BASE_URL = https://your-app.netlify.app
4// API_KEY = your-api-key-for-testing
5// JWT_TOKEN = (copy from browser DevTools after logging into the dev app)
6
7// Environment: 'Bolt Production'
8// BASE_URL = https://your-custom-domain.com
9// API_KEY = your-production-api-key
10// JWT_TOKEN = (copy from browser DevTools after logging into the prod app)
11
12// In request URLs, use:
13// GET {{BASE_URL}}/api/users
14// POST {{BASE_URL}}/api/payments
15
16// In request Headers, use:
17// Authorization: Bearer {{JWT_TOKEN}}
18// X-API-Key: {{API_KEY}}

Postman's Tests tab (part of each request's configuration) lets you write JavaScript assertions that run automatically when the request completes. These automated tests check the response structure, status codes, and data values — turning your Postman collection into a regression test suite for your Bolt app. Basic tests to add to every Bolt API route request: verify the status code is 200 (or whatever the expected success code is), verify the response time is under an acceptable threshold (e.g., 2000ms for most endpoints), and verify the response body contains the expected fields. For routes that return arrays, verify the array is not null and contains the expected structure. For routes that require authentication, add a second request with no auth header and verify it returns 401. After building and testing your API routes in Postman, you can use the code generation feature to create frontend code that connects to these verified endpoints. In any Postman request, click the '</>' (Code snippet) button in the top-right area of the request. Select 'JavaScript - Fetch' or 'JavaScript - Axios' from the dropdown. Postman generates the exact fetch call with the correct URL, headers, method, and body parameters. Copy this generated code and use it in a Bolt prompt. For example: 'Build a React component using this exact API call: [paste Postman code]. The API returns this response shape: [paste sample response from Postman Tests]. Create a form for user input and display the results in a styled card grid.' This workflow eliminates guesswork about API shapes — you have verified data from Postman tests driving the Bolt component generation.

1// Postman test script (paste in the Tests tab of each request):
2pm.test('Status is 200', () => {
3  pm.response.to.have.status(200);
4});
5
6pm.test('Response time under 2 seconds', () => {
7  pm.expect(pm.response.responseTime).to.be.below(2000);
8});
9
10pm.test('Response has expected fields', () => {
11  const json = pm.response.json();
12  pm.expect(json).to.have.property('data');
13  pm.expect(json.data).to.be.an('array');
14});
15
16pm.test('No error field in successful response', () => {
17  const json = pm.response.json();
18  pm.expect(json).to.not.have.property('error');
19});
20
21// Save response data for use in other requests:
22pm.environment.set('last_response', JSON.stringify(pm.response.json()));