Using the SendGrid Email API with Node.js
You did it! You made a portfolio site to show off your skills and projects. A great way to have your impressed viewers get in touch with you is to use the SendGrid Email API. Integrating the API is fun, useful, and free if you’re receiving less than 100 emails per day. I chose to integrate the API with Node.js, however there are several languages available (including Python, PHP, Java and more). Assuming you have a frontend portfolio site completed with a contact form that will send your user’s information to the API, you can have SendGrid’s email service up and running with only a few simple steps. Let’s get started.
First you’ll need to start by downloading Node (keep in mind, the SendGrid API supports back to Node version 6, however they recommend using the latest version. Check which version you have by running node -v in the terminal). Next, run npm init in your project folder to spin up a new Node application and complete the set up. This project requires the following packages: @sendgrid/mail (helper library for the email API), body-parser (allows us to add a body onto our HTTP request), cors (cross origin resource sharing allows our server to handle requests from outside origins), express (framework for Node), and nodemon (automatically restarts your node application after saving your changes). Run npm install @sendgrid/mail body-parser cors express nodemon to complete the installation.
After installing your packages, you’ll need to bring them into your project and initialize your application.
const express = require("express");
const cors = require("cors");
const bodyParser = require("body-parser");
const sendgrid = require("@sendgrid/mail");const app = express();
app.use(cors());
app.use(bodyParser.json())
Next, you’ll have to set your headers. This is allowing HTTP requests from any source. If you decide to deploy your application, you’ll want to replace the * with the URL for your frontend.
app.use((req, res, next) => {
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, PATCH, DELETE");
res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
next();
});To make sure your server is running correctly, write a sample get request. Make sure you specify the port you want your application to run on. Then go to localhost:2000/backend to ensure your message is displayed.
app.get("/backend", (request, response, next) =>{
response.send("It's working")
});app.listen(2000)
It’s now time to create your SendGrid account. Go to their website and click ‘Email API’ followed by ‘Start for Free’. Follow the steps to create your account and verify your email address and your Single Sender Identity. Next go to ‘Integrate using our Web API or SMTP Relay’ and choose ‘Web API’. Choose your integration language, which in our case is Node.js. Next create your API key (take note of this key, as you will not be able to access it again) and follow the steps to create an environment variable. This is creating an environment for your API key that will be stored in the .gitignore folder, meaning it will not be displayed in your GitHub repository. SendGrid will provide the code to implement into your application, allowing you to send your first email.
app.post("/backend", (request, response, next) => { sendgrid.setApiKey(process.env.SENDGRID_API_KEY);const message = {
to: "test@mail.com",
from: "test@mail.com",
subject: "Website Contact",
text: request.body.message
}sendgrid.send(message);
Finally, go to the frontend of your application and test your contact form. If you receive an email (check your spam!), it worked. Confirm your integration with SendGrid and viola! Happy sending.
