Netlify email function integration with Postmark

I have tried to use the Netlify email function with my Postmark account, so user in the website can send email with attachment by the web form.

I have followed the guide, however after I have run netlify dev and go to http://localhost:8888/.netlify/functions/emails

It shows:
‘{“message”:“Email templates directory ./emails does not exist”}’
Could you please advise what I have missed?

Is there a complete step by step guide to integrate the function with an example?

Thanks!

Regards,
Elina

@Elina The error indicates the ./emails directory doesn’t exist (or can’t be found where it expects it to be).

The relevant step in the documentation is here:

Which says:

  1. Create an emails directory in the base directory for your project.

There are also details on changing the location of that directory.

Have you ensured the directory exists in the right location?

@nathanmartin Thanks for your reply, indeed there was problem in the directory (it was mistakenly not in the base), I just corrected it and the link works.

I have just one more question, I have built a react website with a form in the homepage so after user fill in the form and submit the email will be automatically sent with their information, but all the variables are declared in that part, so in this case I should I use @netlify/emails or fetch?
And how to reuse the variables in the html form?

Sorry if my questions are basic level, actually I just started learning coding last year (I’m a designer before and now start building frontend website), I built and deployed the frontend website in Netlify and I found it’s really great that we could integrate the email function with Postmark in the frontend, and I am excited to test it out.

@Elina I can’t advise on which of the two options you should select, but your question is also somewhat addressed in the documentation here:

https://docs.netlify.com/integrations/email-integration/#create-a-function-to-send-the-email

Because the snippet generated in the preview contains an environment variable, NETLIFY_EMAILS_SECRET , we recommend pasting the code snippet into a Netlify Function to avoid sharing sensitive information in client-side code.

You probably don’t want to make the call directly from the frontend, but rather construct a function that you call from the frontend that in turn makes the actual call. The documentation provides an example function in that same section.

@nathanmartin

As I see in the Netlify function document:
’ To add a serverless function to your project, create a TypeScript file in your functions directory

However the website is not written in Typescript, is it still ok to install the @netlify/functions module and create the Typescript function file?

@Elina If you’re using Javascript, you can create your functions in Javascript, rather than Typescript. You can use the Typescript example as a reference for creating a Javascript function