Check out "Do you speak JavaScript?" - my latest video course on advanced JavaScript.
Language APIs, Popular Concepts, Design Patterns, Advanced Techniques In the Browser

Configure Google domain email in Vercel with ImprovMX

Back in February last year I blog on topic Email not working after DNS change. Well, I had kinda similar situation but not exactly. This time I bought a domain from Google and wanted to use an email with it. The setup wasn't obvious for me so I decided to document the process.

Setting up Vercel DNS for your domain

Open your domain settings in https://domains.google.com/ and navigate to the DNS section. Set the Vercel DNS instead of the default Google ones:

Setting Vercel DNS

What you should know after this step is that your domain is no longer pointing to Google's servers. This means that you can't use the email aliases provided by Google. Every attempt to send an email to <something>@yourdomain.com will be forwarded to Vercel.

Adding the domain in the Vercel project

You need to have a Vercel project to which you will be adding the new domain. I did not create the project in the Vercel UI at vercel.com but I've made a folder on my machine. I anyway needed it with the idea to develop my project there so I did that and simply run vercel inside (previously installed via npm i -g vercel). This command walked me through the needed basic settings. Immediately a new project appeared in my Vercel dashboard.

When your project exists you should go to the domains section in Vercel and click on the Add button. Pick the correct entry from the list and after some time you should see your domain. Like on the following image.

Adding the domain in the Vercel project

Have in mind that it may take some time. Vercel needs to verify the DNS settings and also to set up a SSL certificate.

Using ImrovMX to create an alias email

ImprovMX is a service that allows you to create email aliases for your domain. We need such service because Vercel is not offering email management.

The first thing that you have to do is to create an account and add your domain.

Adding your domain to ImprovMX

Once your domain is added you need to configure it. Click on the gear icon next to it and you should be prompted with a page that shows you the MX and SPF records that you need to set up in Vercel. Go to Vercel domains and under the DNS Records section add the ImprovMX records. This is how it should look:

Adding the domain in the Vercel project

When these records exist in Vercel you will get a confirmation in ImprovMX dashboard that your domain is properly set up.

Adding the domain in the Vercel project

Then go to the first tab on that same screen called Aliases and add the desired emails.

Have in mind that this whole setup may not start working immediately. I'll suggest to wait a couple of hours before giving up 😉

Using the email as a sender

All the work so far is valid for the case where you want to receive an email to your alias. If you however want use it as a sender you have to make additional effort. And this depends on what other email service you are using. In my case this was GMail. There is a really nice article here improvmx.com/guides/send-emails-using-gmail/ that shows you how to add your alias to a GMail account and use Google's SMTP.

Final words

So, you have your domain pointing to Vercel's servers. The HTTP/S traffic is fine but to make the emails work you need an email service. You need to instruct Vercel where to forward such email requests. This happen via the MX record. Once this is set up you can rely on that third-party email provider. In my case this was ImprovMX.

If you enjoy this post, share it on Twitter, Facebook or LinkedIn.