DEV Community

Budibase
Budibase

Posted on • Updated on • Originally published at budibase.com

The 5 best open-source form builders to add to your tech stack in 2021

5 Form Builders

My name is Joe, and I have been building online forms for the last 10 years of my life. I have developed forms in several different ways; with html5 form builders, with Javascript form builders, to niche React form builders and more. From my experience, I can conclude that the best open-source form builders make it quick and easy to create beautiful, functional, and accessible forms.

Forms are a critical construct of the digital age. They're used across the internet, including social media, email, and internal tools. There are many reasons to use an online form. Whether you're collecting user feedback, setting up a contact form, or surveying staff.

On the face of it, forms seem like a simple construction of labels and inputs. But as you dive deeper, things begin to grow in complexity.

Online forms come in two formats:

  1. the standard vertical design, and
  2. the stepped/wizard format.

My advice is to use a standard form for under 5 inputs. Anything over 5 inputs, use the stepped format.

From a design perspective, it is safe to say forms have progressed a lot. A decade ago, online forms primarily consisted of grey, square blocks with Times New Roman labels. Thankfully this has changed... a lot. And, I believe form builders play a considerable role in this transformation.

Before diving into the 5 best open source form builders, let's understand what exactly a form builder is.

A form builder is a software-based tool that helps users build online forms with little to no code.

Most of the open-source form builders within this post accommodate both types of formats. Out of the box, an excellent open-source form builder should provide you with features such as:

  • accessible components
  • built-in validation
  • design flexibility
  • linked database
  • GUI

When selecting an open-source form builder, I suggest you think long and hard about your use case. Some form builders will come with additional features you simply do not need. Always pick the right tool for the job.

To help you pick the right tool, we tested over 20 open-source form builders to identify those critical differences and help you choose the right one. We've reviewed and scored each of the open-source form builders using the following 3 categories; ease of use, functionality, and design.

Here are the 5 best open-source form builder apps:

  1. Budibase
  2. Kinto form builder
  3. form.io
  4. Alpaca
  5. Ohmyform

1. Budibase

Best all-in-one open source form builder

Budibase is a form builder and more. It's an open-source low code platform that gives you a database, automation workflows, authentification, and many more features out of the box. It can also connect to external data sources such as MongoDB, MySQL, PostgreSQL, Airtable, and more. You can also connect to a Rest API.

The compilation of functionality makes it the go-to tool for building data-centric internal tools and forms. You can also create public and private forms (authentification). This is essential if you are building apps such as CRMs, approval apps, inventory lists.

What's unique about Budibase, is how you build the form using a GUI. The GUI strikes a good balance of being opinionated and flexible, allowing you to build beautiful-looking forms with ease. For example, each input comes with built-in validation, accessible styling, and theming.

Ease of use - ⭐⭐⭐⭐

Getting started with Budibase involves you downloading the builder. This provides you with a desktop application that allows you to focus on the task at hand. Some people might find downloading the platform a slight pain, but the reward is worth it.

Functionality - ⭐⭐⭐⭐

With Budibase, you can either build forms from scratch or auto-generate them from a data schema. Budibase is opinionated compared to other form builders on the list. Out of the box, you get form validation, a resize prop, lightest, light, dark and darkest themes, accessible inputs, a database, and responsiveness.

Design - ⭐⭐⭐⭐⭐

The design of the builder is superior to other builders on this list. It's not even close. The outputted forms come with themes and built-in validation. The components are modern, and users can change fonts, sizes, spacing, add text/images/tables to the forms.

Pros
  • Design
  • Accessibility
  • Flexibility
  • Simplest of all form builders to get started and use
  • Power to generate forms from a schema
  • Database attached
Cons
  • You have to download the builder

Conclusion

If you are building a web app/internal tool, Budibase is the best option hands-down. It comes with a database and plugs into other databases, making it a complete form builder. Budibase is a powerful/flexible builder, precisely why it is not the best option if you have a pre-existing codebase to which you would like to add a form.

Budibase Github link


2. Kinto form builder

Best open source form builder - React.
Kinto form builder

Kinto Form builder is an open-source form builder built with React on top of Kinto.

Kinto is a unique project, and the form builder is very flexible in nature. I felt it deserved a place in my top 5 because of its flexibility. This flexibility comes at a cost - it is the hardest of all the form builders to get started and use.

Ease of use - ⭐⭐

The Kinto form builder requires you to set up a Kinto instance. It also involves you knowing how to code. I expect this to be a blocker for many readers. They offer a sandbox that highlights the power of the builder.

Functionality - ⭐⭐⭐⭐

Kinto offers a tonne of functionality out of the box, and if you are in the React ecosystem, it could be a precious asset. The builder was performant and felt snappy, which was nice.

Design - ⭐⭐⭐

The design is not very opinionated but functional. The forms outputted from Kinto are a notch above basic, which will suffice for many users. The design of the form generated within the sandbox has a Material design feel to it.

Pros
  • Sandbox
  • Performance
Cons
  • Lack of database out of the box
  • Getting started proved to be a pain
  • React focused

Conclusion

If you know how to code and React is a part of your tech stack, this is a great option. If you do not know how to code and you would like a more comfortable/quicker option, the others on this list are better.

Kinto Github Link


3. form.io

The form builder for enterprise
form.io

Form.io is an enterprise-class combined form and API data management platform for developers building their own complex form-based business process applications.

Form.io was easy to set up and get started. From the first few minutes of using Form.io, it was easy to identify who this platform is for - enterprise. It has a wealth of functionality with very little design.

Ease of use - ⭐⭐⭐

I personally loved how Form.io comes with many input types out of the box. These are available to users within their drag and drop interface. The drag and drop flow is quick and user-friendly, but it led to some confusion around responsiveness. One of the advantages Budibase has over form.io is how it can generate forms automatically from a database schema. I didn't realize how much I loved that feature until I used Form.io.

Functionality - ⭐⭐⭐⭐⭐

Form.io provides a wealth of functionality out of the box. I liked how easy it was to add conditions and logic to inputs/forms without coding. I enjoyed how the created forms could be linked to a React / Angular application, but this might not be a positive for all readers. Its multi-tenant functionality is excellent if you have multiple forms for various environments/customers.

Design - ⭐⭐

The platform's overall design is a little dated, and the inputs and forms available are also not visually appealing. The outputted form was the least attractive of all 5 of the mentioned open-source form builders, but I feel I could have made the inputs prettier with more time.

Pros
  • Flexibility
  • Functionality
  • Conditional and logic functionality out of the box
  • Multi-tenancy
Cons
  • Design of the platform
  • Design of the form components
  • Enterprise feel

Conclusion

If you are a developer, short of time, working in an enterprise org, I would definitely check out form.io. Its functionality range is arguably the best in this list, but if you are concerned about user experience/design, it's possibly not the best choice.

Formio Github link


4. Alpaca

The HTML5 open source form builder

Alpaca provides the easiest way to generate interactive HTML5 forms for web and mobile applications. It uses JSON Schema and simple Handlebars templates to create great-looking, dynamic user interfaces on top of Twitter Bootstrap, jQuery UI, jQuery Mobile, and HTML5.

Alpaca has been around for several years and offers a bare-bones framework for building forms. It is not as opinionated as the other platforms but has extensive functionality for those willing to put the effort in.

Ease of use - ⭐⭐

It involves coding, but the documentation is fantastic. I admit Alpaca is on the more difficult side compared to some of the builders on this list. It takes longer to set up and is dramatically less opinionated, leading to more work but more flexibility on the user side.

Functionality - ⭐⭐⭐⭐⭐

Its functionality, from a frontend perspective, is extensive, but it comes without a database.

Design - ⭐

The components which come out of the box are basic HTML5 components with zero styling. You can hook up CSS frameworks to help with the styling.

Pros
  • Flexibility
  • Documentation
  • Lightweight
Cons
  • Design
  • You need to know how to code
  • Lack of database

Conclusion

Alpaca is a great option if you want to create a no-nonsense form. But, critically, it does not have a database. Alpaca is fun, and if you have time, I am sure you can design a great-looking form - but this would take more time and effort than the other platforms on this list.

Alpaca Github link


5. Ohmyform

One for the future
ohmyform

OhMyForm describes itself as the free, open-source form builder similar to Google Forms or TypeForm.

This is not the first time OhMyForm creators have developed a form builder. Before OhMyForm, there was Tellform. That project has since been deprecated.

Ease of use - ⭐⭐⭐

For me, OhMyForm is more akin to Typeform. It comes with a stepped approach which is really lovely, and the UI/UX is better than several others on this list. What I didn't like about OhMyForm, was the lack of sandbox/trial to simply try out the tool. The documentation is minimal.

Functionality - ⭐

OhMyForm is a young project, so the functionality is limited, but the direction is right. The stepped-form approach is admirable and feels premium.

Design - ⭐⭐⭐

The early design signs are good. With a little polish, the team could be on to a real winning. The UI and UX are not as good as Budibase, but it does offer a quick (after installation) way to build well-designed forms.

Pros
  • Design
  • Stepped approach
Cons
  • Project is young
  • Lack of documentation
  • No sandbox
  • Lack of functionality

Conclusion

It's too early to tell for OhMyForm, but the future is bright if they can deliver on what is already a good foundation. This project is one to watch rather than one to use right now.

Ohmyform Github link


Conclusion

Forms are a critical component of the internet. As our need and demand for software increases, so does our need for great forms. Each of the open-source form builders above offers something unique. If you are building a form/web app / internal tool from scratch - use Budibase. If you have a pre-existing React codebase, use Kinto. If you are in an enterprise org with a pre-existing Angular codebase, use Form.io. If you need a lightweight html5 form builder, have coding experience, Alpaca is brilliant. If you are interested in what is the next up-and-coming open-source form builder, check out OhMyForm.

Thanks for reading, and good luck on your form-building journey.

Top comments (5)

Collapse
 
aalphaindia profile image
Pawan Pawar

Thanks for the information!!

Collapse
 
budibase profile image
Budibase

Anytime! Thanks for reading!

Collapse
 
ra1nbow1 profile image
Matvey Romanov

Good one

Collapse
 
budibase profile image
Budibase

Thank you!

Collapse
 
budibase profile image
Budibase

Such kind words. Thank you