Bolt.new and Mailtrap Integration

Send emails with Bolt.new and Mailtrap

Step-by-step guide on how to integrate Mailtrap with your Bolt.new application.

Mailtrap is an email-sending solution for developer and product teams. Focused on fast delivery and high inboxing rates for transactional and promo emails. It provides highly customizable API and 24/7 tech support.

And this integration is built to:

  • Send transactional emails (notifications, order confirmations, password-change messages) from a verified sending domain using the Mailtrap Node.js SDK. 
  • Manage contacts in Mailtrap and push recipient information to Contacts.

Make sure to adjust the prompts to your specific needs, this is just an exemplary tutorial.

We created the prompts in August ‘25 and they’re based on our experience with GPT-5 and Bolt.new.

As LLM models and platforms constantly evolve, the integration could be slightly different for you.

Prerequisites

Before starting, make sure you have:

  • A verified sending domain in Mailtrap - How to verify a domain with GoDaddy
  • An Admin API token with access to your domain, Contacts, and Email API - How to create an API token
  • Your Account ID - Go to Mailtrap Settings, then select Account Settings
  • (Optional) Custom fields for storing extra contact data - Creating custom fields
  • (Optional) List IDs for assigning contacts to lists -Managing lists
  • A Bolt.new account and Supabase account (connect the two when prompted by Bolt)

Send emails with Mailtrap email API

Check the prompt you can use to send emails from your project. For the project, we used a simple landing page with a contact form (see below). 

Also, Bolt.new will ask you to update environment variables (MAILTRAP_API_KEY , MAILTRAP_ACCOUNT_ID , MAILTRAP_MY_EMAIL ) in Supabase. Make sure to do it, otherwise, you can’t send emails. 

⬇️ Prompt for Bolt ⬇️

Technical note: Please update the prompt with your verified domain and the sending address you’ll be using. 

(Optional) - Add users or leads to Mailtrap Contacts 

Adding contacts to Mailtrap enables you to send email Campaigns, create recipient segments, and manage them. And you can also use the given contact for automated email sequences. 


So, here’s what to do:

Thereon, you can paste the following prompt into Bolt.new.

  • Pass all my new users/ form submissions to Mailtrap contacts.
  • Use the latest version of Mailtrap NodeJS SDK (https://www.npmjs.com/package/mailtrap, https://github.com/railsware/mailtrap-nodejs/blob/main/README.md) to add contacts.
  • My MAILTRAP_ACCOUNT_ID env variable.
  • Use the same Token I use for the production mode of Mailtrap, as it can also create Contacts.
  • Pass the name from my form to name field in Mailtrap. Add users to MAILTRAP_LIST_ID.
  • Create contacts table in Supabase with such columns as:
    • id : UUID, primary key
    • name : text
    • email : text
    • message : text
    • created_at : timestamp
    • mailtrap_contact_id : text
  • Apply Supabase Row-Level Security (RLS) to restrict access to only authenticated users.
  • Save form contacts info from submissions in DB and use Mailtrap NodeJS SDK to create a contact in Mailtrap.
  • Save Mailtrap contact_id (Mailtrap provides it with a response) to mailtrap_contact_id column in contacts table.

Integration example: Form submission landing page

We use Bolt.new to create a simple landing page with a lead-capture form. That page is used for email sending, submission notifications, and contacts management. 

Notes:

  • The guide is only referential, so you better understand Mailtrap integration.
  • Remember, your experience with Bolt.new might be different as it’s non-deterministic and constantly evolving. 
  • Make sure to store all your sensitive information with Supabase, not the code itself. 
  • Adjust Supabase project SMTP settings to Mailtrap. Here’s the guide. This way you avoid their hourly limit on email sending. 

Step 1 - Connect Bolt and Supabase

The integration is simple since Bolt has it pre-made. Here’s what to do:

  • Hit the Integrations button at the top right and select Supabase.

  • Follow the wizard, it does everything for you.
  • Only pay close attention to select the Supabase project related to this task.
  • Once done, Bolt confirms the connection.

Step 2 - Landing page creation

Here is the prompt for the landing page that creates a new Mailtrap contact with each form submission and emails you a notification with each submission. 

Create a SaaS landing page with a contact form that collects the full name, email address, and message.

// Note: provide more info about your company, if you have any screenshots, design files, copy - mention all of that and attach

<company_info>

My SaaS is called Acmecomp-deliverability.com, which is about helping our customers to ensure their emails are delivered without problems. Our form will capture leads who want to talk about our deliverability consultation services. We have already helped 120 companies and have a few case studies we want to showcase.

</company_info>

My landing page should have such a structure:

<website_structure>

  • The hero section describes my benefits with a button that scrolls to the form
  • Testimonials / social proof/case studies
  • Form
  • About section
  • Contact Info section
  • Links to social networks (LinkedIn, Instagram)

</website_structure>


// Note: provide your info about domains, emails, account ID, keys to use, etc. If you add keys manually to Supabase Secrets, mention that (or Bolt.new asks you to add it there directly or via its integration). You might also keep email_from and email_to in the Secrets for an easy change across the project

Make sure this form works like this:

<form_functionality>

  • Add browser validation for the email input in the form, so only a valid email will pass
  • Add a minimum length of a message field of 50 characters, and a maximum length for the Name input of 100 characters.
  • As a customer submits a form (each form submission):
    • Send an email with its content to my email MAILTRAP-MY-EMAIL secret variable
      • Emails should be sent from form-submissions@demoatmailtrap.com (MAILTRAP-FROM-EMAIL), as demoatmailtrap.com is my verified domain in Mailtrap
    • Create a contact in Mailtrap (name, email).
    • Pass value from the form's "Full name" input to Mailtrap's custom field name.
    • Create contacts table in Supabase with such columns as:
      • id : UUID, primary key
      • name : text
      • email : text
      • message : text
      • created_at : timestamp
      • mailtrap_contact_id : text
    • Add info about a form submission to the Supabase contacts table as well, and write info if the contact was submitted, its Mailtrap Contact ID (Returned with a response). Apply Supabase Row-Level Security (RLS) to restrict access to only authenticated users.
    • As the form is submitted, display that state and notify the visitor that it's submitted.
  • Email should be sent via Mailtrap, as I have an account there:

</form_functionality>

Plan step-by-step, verify results after each step. Verify all steps work before continuing with the next one. Write code in Typescript, generate atomic files in the Supabase Edge function so it's easier to verify and debug.

After pasting the prompt and hitting Enter, it takes Bolt a few minutes to engineer everything for you.


Typically, Bolt asks you to apply the changes necessary for your software to run, review its flow and apply the changes. 


If Bolt encounters any bugs, it will list them and attempt to fix once you click the associated button.

Step 3 - Use the landing page form to send the emails

Under Bolt Preview, navigate to the contact form, fill it out and hit submit.


Once you submit the form, you should see the following confirmation message.

If there are any errors in sending, Bolt will attempt to fix it once prompted, keep an eye on the message thread. To that, it’s helpful to check Edge Functions (Supabase context) error logs and paste them into Bolt. 

If everything runs well, you’ll be able to see a new contact under Mailtrap Contacts. 

And you’ll be able to see the form notification in your inbox. 

Troubleshooting for Bolt.new

  • Environment variables not loading: Make sure you’ve properly integrated Supabase and added environment variables into Supabase Project Settings. 
  • Email sending fails: Ensure your domain is verified and your from address matches the verified domain.

Next steps

  • Automate welcome emails using Mailtrap’s Automations.
  • Explore Template Sending for dynamic email content.
  • Use Lists to segment your Contacts for campaigns.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us