Netlify Forms with FaunaDB

It's nice to see the form data to be stored in netlify.

Jamstack Registration Form

Vishang ・ Apr 8 '20

#javascript #jamstack #serverless #webdev

Now, what's next. I am going to store my form data to FaunaDB.

Create a db-schema

• Create a Db-schema folder with registration.gql

Create DB with FaunaDB

• Login to FaunaDB Console
• Create new DB with FaunaDB
• Import schema (DB Console -> GraphQL -> Import Schema)
• Create a new FUANA_DB_SECRET with security tab in console

Create Environment Variable

• In netlify console.
  • Go to Deploy Settings -> Environment -> Edit variable Add FAUNA_DB_SECRET -> Copy paste your secret here. This is used for authentication purpose.

Create Nelify Functions

Create netlify functions manually

• create a functions folder at root level
• within functions folder create your netlify functions i.e for the form submission create submission-created.js under the functions folder. The functions name also needs to match the specific event name with netlify events. The available event triggers available here on netlify docs

Folder structure will look something like this.

Create netlify functions with netlify-cli

$ netlify functions:create submission-created

$ To deploy netlify function via netlify-cli

$ netlify deploy --prod

Now, in netlify console in functions tab all available netlify functions will be listed. Click on function for debug purposes.

Netlify Config

Functions to run in netlify we need a netlify.toml (configuration) file

Now the data which is pushed on netlify forms will also be available in FuanaDB for use.