For a simple contact form, I am utilizing Nuxt, Sendgrid, and Firebase. Netlify is being used for hosting the project. The contact form works perfectly fine locally and sends emails without any issues. However, once I push the project to Netlify, the emails are not being sent out. This discrepancy occurs because I have hard-coded the Sendgrid API key directly into the NODEMAILER createTransport function when working locally:
LOCAL CODE: (functions flawlessly)
const transporter = nodemailer.createTransport({
host: 'smtp.sendgrid.net',
port: 587,
secure: false,
auth: {
user: 'apikey',
pass: 'MY API NUMBER IS HERE',
},
})
Upon pushing the code to Github / Netlify, I made sure to include the actual API number in my gitignore file to prevent exposure. The updated code now looks like this:
const transporter = nodemailer.createTransport({
host: 'smtp.sendgrid.net',
port: 587,
secure: false,
auth: {
user: 'apikey',
pass: process.env.SENDGRID_API_KEY,
},
})
I have stored the API key in the .env file located at the root of the project, while the sendgrid functions folder resides at /functions/index.js. My concern lies in whether the functions folder can access the information within the .env file.