Skip to content

Commit 9200cae

Browse files
authored
Merge pull request #292 from Web-Dev-Path/replace-sendgrid-with-mailjet
swap sendgrid for mailjet
2 parents bf9099f + 8fb747d commit 9200cae

5 files changed

Lines changed: 77 additions & 33 deletions

File tree

.env-template

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,5 +7,6 @@ MAILCHIMP_API_KEY={Add the key}
77
MAILCHIMP_AUDIENCE_ID={Add the ID}
88
NEXT_PUBLIC_RECAPTCHA_SITE_KEY={Add the key}
99
RECAPTCHA_SECRET_KEY={Add the key}
10-
SENDGRID_API_KEY={Add the key}
11-
NEXT_PUBLIC_GA_MEASUREMENT_ID={Add the key}
10+
NEXT_PUBLIC_GA_MEASUREMENT_ID={Add the key}
11+
MAILJET_API_KEY={Add the key}
12+
MAILJET_API_SECRET={Add the key}

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -209,4 +209,5 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
209209
- Fixed active state bug on the navigation.
210210
- Integrate Mailchimp Marketing API instead of react-mailchimp-subscribe dependency.
211211
- Removed unused props from Hero layout component
212+
- Replace sendgrid with mailjet for sending contact email
212213
- Replace mailto:hello@webdevpath.co button links with /contact

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
"html-entities": "^2.3.2",
2424
"next": "^15.3.2",
2525
"next-pwa": "^5.6.0",
26+
"node-mailjet": "^6.0.9",
2627
"react": "^19.1.0",
2728
"react-dom": "^19.1.0",
2829
"react-google-recaptcha": "^3.1.0",

pages/api/sendEmail.js

Lines changed: 35 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,48 @@
11
// Sends email to hello@webdevpath.co when user submit the form in "Contact Us" page
2-
import sendgrid from '@sendgrid/mail';
32

4-
sendgrid.setApiKey(process.env.SENDGRID_API_KEY);
3+
import { Client } from 'node-mailjet';
4+
5+
const mailjet = new Client({
6+
apiKey: process.env.MAILJET_API_KEY,
7+
apiSecret: process.env.MAILJET_API_SECRET,
8+
});
59

610
export default async (email, name, subject, message, subscribe) => {
7-
try {
8-
// receiverEmail: The email will be sent here
9-
const receiverEmail = 'hello@webdevpath.co';
10-
// sendgridEmail: This is the email verfied by sendgrid
11-
// the email will appear to be sent from this email
12-
// If a non verified email is used, we get a 403 error
13-
const sendgridEmail = 'support@webdevpath.co';
11+
// receiverEmail: The email will be sent here
12+
const receiverEmail = 'hello@webdevpath.co';
1413

15-
const emailContent = `
16-
<b>Name:</b> ${name} <br/>
17-
<b>Email:</b> <a href='mailto:${email}'>${email}</a><br/><br/>
18-
<u><b>Subject:</b> ${subject}</u><br/>
19-
<b>Message:</b> ${message} <br/>
20-
<b>Subscribe?:</b> ${subscribe ? 'Yes' : 'No'}
21-
`;
14+
// mailJetEmail: This is the email verified by mailjet
15+
// the email will appear to be sent from this email
16+
// If a non-verified email is used, it just fails silently
17+
const mailjetEmail = 'support@webdevpath.co';
2218

23-
const emailMessage = {
24-
to: receiverEmail,
25-
from: {
26-
email: sendgridEmail,
27-
name: 'Web Dev Path',
28-
},
29-
replyTo: {
30-
email,
31-
name,
32-
},
33-
subject: `New message from ${name} via webdevpath.co 'Contact Us' Form`,
34-
content: [
19+
try {
20+
const data = {
21+
Messages: [
3522
{
36-
type: 'text/html',
37-
value: emailContent,
23+
From: {
24+
Email: mailjetEmail,
25+
name: 'Web Dev Path',
26+
},
27+
To: [
28+
{
29+
Email: receiverEmail,
30+
},
31+
],
32+
Subject: `New message from ${name} via webdevpath.co 'Contact Us' Form`,
33+
HTMLPart: `
34+
<b>Name:</b> ${name} <br/>
35+
<b>Email:</b> <a href='mailto:${email}'>${email}</a><br/><br/>
36+
<u><b>Subject:</b> ${subject}</u><br/>
37+
<b>Message:</b> ${message} <br/>
38+
<b>Subscribe?:</b> ${subscribe ? 'Yes' : 'No'}
39+
`,
3840
},
3941
],
4042
};
41-
await sendgrid.send(emailMessage);
43+
44+
await mailjet.post('send', { version: 'v3.1' }).request(data);
45+
4246
return {
4347
status: 'okay',
4448
};

yarn.lock

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1638,6 +1638,11 @@ big.js@^5.2.2:
16381638
resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
16391639
integrity sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==
16401640

1641+
bignumber.js@^9.0.0:
1642+
version "9.3.1"
1643+
resolved "https://registry.yarnpkg.com/bignumber.js/-/bignumber.js-9.3.1.tgz#759c5aaddf2ffdc4f154f7b493e1c8770f88c4d7"
1644+
integrity sha512-Ko0uX15oIUS7wJ3Rb30Fs6SkVbLmPBAKdlm7q9+ak9bbIeFf0MwuBsQV6z7+X768/cHsfg+WlysDWJcmthjsjQ==
1645+
16411646
brace-expansion@^1.1.7:
16421647
version "1.1.12"
16431648
resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.12.tgz#ab9b454466e5a8cc3a187beaad580412a9c5b843"
@@ -2233,6 +2238,17 @@ form-data@^4.0.4:
22332238
hasown "^2.0.2"
22342239
mime-types "^2.1.12"
22352240

2241+
form-data@^4.0.4:
2242+
version "4.0.4"
2243+
resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.4.tgz#784cdcce0669a9d68e94d11ac4eea98088edd2c4"
2244+
integrity sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==
2245+
dependencies:
2246+
asynckit "^0.4.0"
2247+
combined-stream "^1.0.8"
2248+
es-set-tostringtag "^2.1.0"
2249+
hasown "^2.0.2"
2250+
mime-types "^2.1.12"
2251+
22362252
fs-extra@^9.0.1:
22372253
version "9.1.0"
22382254
resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-9.1.0.tgz#5954460c764a8da2094ba3554bf839e6b9a7c86d"
@@ -2775,6 +2791,13 @@ jsesc@~3.0.2:
27752791
resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-3.0.2.tgz#bb8b09a6597ba426425f2e4a07245c3d00b9343e"
27762792
integrity sha512-xKqzzWXDttJuOcawBt4KnKHHIf5oQ/Cxax+0PWFG+DFDgHNAdi+TXECADI+RYiFUMmx8792xsMbbgXj4CwnP4g==
27772793

2794+
json-bigint@^1.0.0:
2795+
version "1.0.0"
2796+
resolved "https://registry.yarnpkg.com/json-bigint/-/json-bigint-1.0.0.tgz#ae547823ac0cad8398667f8cd9ef4730f5b01ff1"
2797+
integrity sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==
2798+
dependencies:
2799+
bignumber.js "^9.0.0"
2800+
27782801
json-parse-even-better-errors@^2.3.1:
27792802
version "2.3.1"
27802803
resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
@@ -3064,6 +3087,15 @@ node-addon-api@^7.0.0:
30643087
resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-7.1.1.tgz#1aba6693b0f255258a049d621329329322aad558"
30653088
integrity sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==
30663089

3090+
node-mailjet@^6.0.9:
3091+
version "6.0.9"
3092+
resolved "https://registry.yarnpkg.com/node-mailjet/-/node-mailjet-6.0.9.tgz#6ae26b3192f66c49c8536ed98a80b755afe28b26"
3093+
integrity sha512-WGovS3g+2R/02IkD9/EWNvItRVhei7ltmh40JN53cozna41Ug/T3oKOAehBnV0B6Egx1H6L565HbeffUE7DYWg==
3094+
dependencies:
3095+
axios "^1.8.1"
3096+
json-bigint "^1.0.0"
3097+
url-join "^4.0.0"
3098+
30673099
node-releases@^2.0.21:
30683100
version "2.0.21"
30693101
resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.21.tgz#f59b018bc0048044be2d4c4c04e4c8b18160894c"
@@ -4051,6 +4083,11 @@ uri-js@^4.2.2:
40514083
dependencies:
40524084
punycode "^2.1.0"
40534085

4086+
url-join@^4.0.0:
4087+
version "4.0.1"
4088+
resolved "https://registry.yarnpkg.com/url-join/-/url-join-4.0.1.tgz#b642e21a2646808ffa178c4c5fda39844e12cde7"
4089+
integrity sha512-jk1+QP6ZJqyOiuEI9AEWQfju/nB2Pw466kbA0LEZljHwKeMgd9WrAEgEGxjPDD2+TNbbb37rTyhEfrCXfuKXnA==
4090+
40544091
watchpack@^2.4.1:
40554092
version "2.4.4"
40564093
resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-2.4.4.tgz#473bda72f0850453da6425081ea46fc0d7602947"

0 commit comments

Comments
 (0)