Build contact us page using serverless function (email function) — Part2

Published in

Red Gold

3 min readJul 17, 2020

In this series of working with OpenFaaS I want to show you will learn how to Learn how to host your own website using OpenFaaS serverless function. Also learn how to use serverless function to receive user/customer feedback from contact us page.

In previous article we learned how to deploy a serverless function to host our contact us page. In this article we learn how to connect our contact us page to a serverless function, receiving user/customer feedback in our email inbox!

Ingredients🍲🍜

You read and implemented the first part!

Get Started🏃🏻

Start with creating a serverless function for sending email using OpenFaaS.

1) Follow commands below to create your function.

# Change current directory to the contact us project directory
$ cd $HOME/openfaas-contactus# Pull OpenFaaS templates
$ faas template pull https://github.com/openfaas-incubator/node10-express-template# Create a function from nodejs language template
$ faas-cli new email-fn --lang node10-express-service

Now you should have directory name email-fn which contains your app files and handler.js file. And the stack.yml file that keeps all configuration for your function.

Add email-fn function in stack.yml file. Edit stack.yml file following below file.

email-fn:   lang: node10-express-service   handler: ./email-fn   image: email-fn:latest   labels:      com.openfaas.scale.zero: false

2) Implement email handler

First we need to install some node module package:

$ cd $HOME/openfaas-contactus/email-fn
$ npm install --save nodemailer formidable

Then edit handler.js file

Creating secret 🙊

Follow command below to create secrets on your K8S cluster. Replace {your_gmail_password} with your gmail password, {your_gmail} with your gmail then execute command.

$ cd $HOME/openfaas-contactus
$ faas-cli secret create gmail-pass --from-literal "{your_gmail_password}" 
$ faas-cli secret create gmail --from-literal "{your_gmail}"

In the case using Gmail follow nodemailer instruction enabling access to email from your your function.

Then add secret name in stack.yml file as below.

secrets:      
  - gmail-pass
  - gmail

Connect contact us page to email handler

Open ui/index.html file and edit <form> tag as below.

Replace red-gold with your Github username in action attribute.

<form action="http://127.0.0.1:31112/function/email-fn" method="post">
...
</form>

Doploy to OpenFaaS Cloud Community cluster

To deploy email function, we just need to run command below.

$ git add .
$ git commit -sm 'Add email handler.'$ faas up --tag=sha

After less than one minute your OpenFaaS API should be ready.

Let’s try with contact us page

From your browser, navigate to http://127.0.0.1:31112/function/contactus-fn. Try to post a message. Now you should receive that message in your email inbox.