Example Description
In this example, we integrate the SendGrid 3rd-party service with our site, allowing you to send emails using a form directly from the browser.
Notes:
To use this example, you must first create a SendGrid account and get an API key.
You must store the API key and the sender email address that you associated with the SendGrid account in the Secrets Manager (see details below).
How We Built It
Page Elements
We added a form with the following elements:
3 text inputs: For the recipient’s email address, subject line, and body of the email.
Button: For sending the email.
Text element: For displaying success and error messages.
Secrets Manager
We saved the email address associated with our SendGrid account and our SendGrid API key in the Secrets Manager:
Secret name: sendGridSecret
Secret value:{"key": <my-sendgrid-api-key>, "senderEmail": <my-verified-sender-email>}
npm package
sendgrid/mail: For sending the emails.
Code
Our site code does the following:
When a site visitor clicks the Send button, check whether all input fields are valid.
If an input field is invalid, display an error message.
If the input fields are valid, call a backend function.
The backend function gets the secret from the Secrets Manager and then sends the email with the email data entered in the form.
Related Examples
Did this help?
|
Thanks for your feedback!
Save Data to a Google Sheet Using npm
Reveal sections of a hidden video on hover.
Intermediate
Send Email with the SendGrid REST Interface
Use the wix-fetch API to send an email using the SendGrid REST API.
Intermediate
Twilio Integration
Integrate with Twilio to make voice calls and send SMS messages
Advanced