Super Easy Forms

An open source module that generates responsive html forms with serverless backends in an instant. Now featuring increased security, felixibility and usability.

All the serverless resources are automatically deployed and linked to your form

  • Install in seconds
  • Create and deploy your serverless form with one command
  • Customize the html form however you like
  • Recieve email notifications of form submissions
  • Have full control of your form submission data
Try it Out!

Features

  • 100% customizable html forms (No iframes)
  • Unlimited forms
  • Unlimited form submissions
  • Register an unlimited amount of emails
  • Detailed Documentation New
  • Easy installation with npm New
  • Easy Integration New
  • Individual configuration for each form New
  • Complete Command line Interface New
  • Export form submissions as CSV or JSON New
  • Input sanitation New
  • Support for select lists, required attributes and all html types New
  • Custom email notification message New
  • Smart labels New
  • Optional CAPTCHA New

Have Any Questions?

made with Super Easy Forms

The CLI New

A complete command line interface for Super Easy Forms that lets you use each of the methods individually, or all together by using the sef fullform command.

You can install the CLI globally to use it in all of your Super Easy Forms projects by running npm i -g super-easy-forms-cli.

For a list of available commands you can run sef help. You can also run sef COMMAND --help to list available args/flags.

To collaborate or learn more about the CLI check out it's repository

Getting Started

  • 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!
  1. Create a new directorey mkdir project-name and/or go into your desired project's directory cd project-name
  2. 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 sef build -r=your-aws-region -p=profile-name replace profile-name with the desired name for the IAM profile 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
    7. 
[profilename]
aws_access_key_id = YOUR_ACCESS_KEY_ID
aws_secret_access_key = YOUR_SECRET_ACCESS_KEY
  7. Create your form by running the command bellow. You can run sef fullform --help to see all the available flags
    8. 
sef fullform formname --email=your@email.com --fields=fullName=text=required,email=email=required,message=text=required

Customize your Form

The form/fullform commands generates and saves an html file that contains your ready-to-use form with default bootstrap classes and an inline JQuery handler.

You can open the html file and add custom CSS or modify the forms HTML layout. Allowing you to adapt it to your project however you like.

If you need inpiration you can check out this collection of bootstrap html contact forms in codepen.

See the Pen super-easy-form by gkpty (@gkpty) on CodePen.

Built With

node js logo
bootstrap logo
AWS logo

How it Works

Super Easy forms makes use of AWS's IaC service, Cloudformation, to define and deploy the necessary infrastructure for your forms. When you run sef fullform some resources will be created in the AWS cloud and some files/folders will be created locally including a responsive HTML form with an inline JQuery handler.

Resources Created
  1. A Dynamodb table to store your submissions
  2. An s3 bucket to store your lambda deployment package
  3. A lambda function that will add the form output to the database and send an email to stakeholders.
  4. A REST API endpoint for the lambda function with a POST method.
The Form
  1. Responsive bootsrap 4 layout
  2. Automatic form fields with labels
  3. JQuery CDN
  4. JQuery handler connected to your API endpoint
AWS architecture diagram of super easy forms

Want to know more about Super Easy Forms?

made with super easy forms

Price

Super Easy Forms and the Super Easy Forms CLI are both completely free and open source under the MIT license. All of the AWS services used by Super Easy Forms have a generous free tier that is hard exceed; however if you do exceed these free tier limits you will be charged by AWS. Please refer to the list bellow for more information.

AWS Services used by Super Easy Forms
  • SES Simple Email Service. 1,000 emails/month for free then $.10 for every 1,000 emails recieved.
  • DynamoDB Fully managed NoSQL database. 25GB of storage free for always.
  • Lambda Let’s you run code without managing servers. 1M requests/month free always. Then $.20 per 1M requests.
  • API Gateway 1M REST API requests/month for 12months then $3.50/1M requests.
  • S3 Bucket Object storage for your file submissions (Coming soon!). 5Gb free for 12 months then $0.023 for GB.

Need more info? https://aws.amazon.com/free

How to Collaborate

Like any other Open Source project, our success depends completely on the support of the community. If you think you can give us a hand please feel free to fork the repo and work on any of the issues in the project board

If you use Super Easy Forms and want it to continue improving but you dont feel like writing the code yourself, you can send us a donation in BTC or USD by using the form bellow. Thanks!

Donate

Main Collaborators

gabriel kardonski

Gabriel Kardonski

lucas kardonski

Lucas Kardonski

Roadmap

Super Easy Forms doesn't stop here. We have a bunch of features planned. To stay up tp date with everything that is planned check out our project board and sign up to our newsletter

Some Upcoming Features
  • File submissions (images, videos, PDFs and more!)
  • Direct integration with the gmail API
  • Payment forms (integrations with leading solution providers)
Anything else you'd like us to consider?