We recently announced Strapi Cloud is now available. Strapi Cloud is a fully managed, composable, and collaborative platform to boost your team's velocity. It is a powerful platform for building and deploying your Strapi application. But sometimes, you must integrate additional functionality to take your project to the next level. One essential feature for many applications is email functionality.
This tutorial teaches how to seamlessly set up an external email provider on Strapi Cloud using Sendgrid.
The two things you will need are an api key
and a verified email
. It is recommended that you have a domain-specific email.
For instance, I have a domain name, codingafterthirty.com
, and my email is paul@codingafterthirty.com
.
I set up my domain email using Google Workspaces, but there are other services that you can use as well.
Once you have your domain specific email, the next step is to verify it in Sendgrid.
You can do that within your Sendgrid dashboard under the sender authentication section.
And the final step is to create an API KEY
that we will use when setting up our email provider.
Now that we have our API KEY
and domain-specific email
, we are ready to move on to the next step.
Note: if you already have a project in the cloud, you can skip the next two sections:
We will set up a simple local project so you can use it as a reference later. I will share the repo at the end of the article.
We can create our Strapi project by running the following command in your folder of choice:
npx create-strapi-app@latest email-provider-demo --quickstart
Once the project is created, go ahead and create your first admin
user. Now let's save our project to git and push it to the cloud.
The hard work is done to set up our project, go to https://cloud.strapi.io to get started.
In the dashboard, click the create-project
button.
You should see the following screen:
Select the project repo that we just created and click the next
button.
Continue clicking next for all the remaining steps. Enter your billing information and click next.
Note: this will create your project and start your subscription.
Once the deployment process starts, you can see the progress under the Deploys
menu tab after selecting the project.
By clicking the eye
icon, you will get a more detailed view.
Once the deployment process is complete, let's create our first admin user and see our Strapi Admin Cloud email settings.
Once your project is deployed, click the Visit app
button and go to /admin
to log in.
Since this is a new project, you will be prompted to create a new admin user
go ahead and do that to log in.
From the dashboard, click on the settings
menu tab and navigate to the EMAIL PLUGIN
configuration menu, and you will see the out-of-the-box email setting provided by Strapi.
You can send emails and use the reset forgotten passwords feature if you get locked out of your account.
But you can not switch or configure your default sender email
or default response email
and you are limited to being able to send only 1000 emails per month.
This may be perfect for most users, but if you need something more, this is where our custom email providers come in.
Let's set up our Sendgrid
email provider.
We are going to set up our custom email provider.
In this example, we are going to use our @strapi/provider-email-sendgrid
provider that you can find in our Strapi Marketplace.
1. Install the provider inside your Local Strapi Project:
Using the following command, let's install our provider:
1 # using yarn
2 yarn add @strapi/provider-email-SendGrid
3
4 # using npm
5 npm install @strapi/provider-email-sendgrid --save
2. Configure your provider:
Inside your code editor, navigate to your config
folder, if the plugins.js
file does not exist, go ahead and create one.
Inside the plugins.js
file add the following configuration:
1module.exports = ({ env }) => ({
2 // ...
3 email: {
4 config: {
5 provider: 'sendgrid',
6 providerOptions: {
7 apiKey: env('SENDGRID_API_KEY'),
8 },
9 settings: {
10 defaultFrom: env('SENDGRID_DEFAULT_FROM'),
11 defaultReplyTo: env('SENDGRID_DEFAULT_TO'),
12 },
13 },
14 },
15 // ...
16});
Now let's set up our variables inside the .env
file. You can find additional information on Strapi Providers here.
3 Adding your env variables:
Inside the .env
file, let's add our SendGrid api key
that we generated earlier and our domain varified
email.
1 SENDGRID_API_KEY=your_sendgrid_api_key
2 SENDGRID_DEFAULT_FROM=your_domain@your_domain.com
3 SENDGRID_DEFAULT_TO=your_domain@your_domain.com
Once the following is done, let's push our changes to Strapi Cloud.
4 Push the changes to Strapi Cloud
Let's commit and push our changes to the cloud.
git add .
git status
git commit -m "email provider setup"
git push -u origin main
This will trigger a redeployment, but our email will not work yet. We need to add our env variable
on Strapi Cloud.
You can do so by clicking on your project, going to setting
, and selecting the variables
menu option.
Go ahead and set your variables.
1 SENDGRID_API_KEY=your_sendgrid_api_key
2 SENDGRID_DEFAULT_FROM=your_domain@your_domain.com
3 SENDGRID_DEFAULT_TO=your_domain@your_domain.com
Once you update your variables, you may retrigger the deployment by clicking the Trigger Deploy
button.
Once the deployment is done, let's log into our Strapi Cloud instance and see if it worked.
Great, we can now use our SendGrid email provider to send emails. You can find the project repo here.
Hope you enjoyed this tutorial.
You can also watch the video tutorial that explains the step-by-step process we went through in this blog post.
Continue discussing this topic further or connect with more people using Strapi on our Discord community. It is a great place to share your thoughts, ask questions, and participate in live discussions.
And finally, if you have any additional topics around Strapi Cloud that you would like us to cover, let us know in the comments.