Skip to content
The easiest way to generate forms for your static site
JavaScript
Branch: master
Clone or download
Latest commit d562a37 Jan 24, 2020

README.md

**This is the repo for Super Easy Forms 2.0. The First Version has been moved to this other repo Super Easy Forms



Super Easy Forms is a tool that generates serverless web forms (front-end and back-end) in seconds. it leverages CloudFormation templates to create all of your necessary resources in the AWS cloud including a A Dynamo DB table, an API Gateway endpoint, and a Lambda function. It also automatically generates a ready-to-go html contact form that you can copy-paste into your site. the tool is very easy to use and completely free as all the AWS resources created have a free tier.

New Features

  • Updated to node 10.X
  • Easier installation Built in commands have been added to further facilitate installation/configuration/setup
  • Documentation: Detailed documentation includes an API method glossary, CLI commands and everything else you need to use/integrate/collaborate with super-easy-forms.
  • Support for multiple Forms: Create and monitor as many forms as you want.
  • Export your form submissions: Command that lets you export the database table of your form as either JSON or CSV.
  • Reusable methods: Easily integrate super-easy-forms into your own project or build your own workflows using components from super-easy-forms.
  • Local config files: Allow you to easily monitor and update each of your forms
  • Independent multi CLI: A separate package (super-easy-forms-cli) with multiple commands that have several options and flags allowing you to customize and create/update/delete any of the components in a form individually or together.
  • CloudFormation template: Easily keep track of the multiple AWS resources for each one of your forms. You can also modify the templates directly to customize the resources in your form.
  • Input sanitation: Uses an AWS API Gateway Model and API validator to insure that the parameters supplied are the correct ones before the call even reaches the lambda function.
  • Support for all html types: Check W3schools for a list of all the valid html types
  • Support for html select with options: Add Select lists to your form and supply the options
  • Support for required attributes: Choose which fields in your form you want to make required
  • Smart labels: The parser will read your input fields and create labels for you by separating camel cased values and sepparating dashes/underscores and capitalizing first letters. E.g. first_name → First Name or firstName → First Name

Pre-requisites

  • Make sure you have node.js (10.x +) and npm installed. You can checkout this tutorial to install npm and node in mac, linux (debian/ubuntu).
  • Have an AWS account. If you don't have an AWS account, you can easily create one here. Don't worry, everything you do with this project will fall within the AWS free tier limit!

Installation

  1. Open up your terminal and create a new directory mkdir project-name replace project-name with the desired name for your project.

  2. Go into your project's directory cd project-name and install super easy forms npm install super-easy-forms

  3. Install the super easy forms CLI globally npm install -g super-easy-forms-cli

  4. Run the build command Run $ sef build -r=your-aws-region -p=profile-name from the root of your project's directory. replace profile-name with the desired name of the IAM user and your-aws-region with the desired AWS region code.

  5. Finish creating your IAM user in the AWS Console and hold on to the access keys. If you had already created your IAM user you can ignore this step and close the browser window.

  6. Update the local profile in your machine. The local profiles are stored in ~/.aws/credentials in mac/linux or in C:\Users\USER_NAME\.aws\credentials in windows. you can create/edit this file by runing sudo nano ~/.aws/credentials. add the profile keys in the format shown bellow.

     [profilename]
     aws_access_key_id = <YOUR_ACCESS_KEY_ID>
     aws_secret_access_key = <YOUR_SECRET_ACCESS_KEY>
    

Usage

    const SEF = require('super-easy-forms')

    SEF.CreateForm(formName, options, function(err, data){
            if(err) console.error(err)
            else{
                    //Do Something
            }
    })

Create a serverless contact form

  1. open up the terminal and go to the root of your project cd your-project-name

  2. run the command bellow

  3. Copy-paste the created form directly into your static website’s body wherever you want it.

    sef fullform formname --email=your@email.com --fields=fullName=text=required,email=email=required,paymentMethod=select=required=visa/master_card/cash,paymentAmount=number=required --recipients=recipient1@email.com,recipient2@email.com
    

This command creates the stack and the html for a form called formname. the form will have the fields Full Name, Email, Payment method (with options Visa, Master Card, or Cash) and payment amount. Whenever someone submits the form an email will be sent from your@email.com to recipient1@email.com and recipient2@email.com.

You can’t perform that action at this time.