Managing multiple form projects with uniforms
What you will learn from this article:
- What is a uniforms library?
- How does it work?
- What are the main benefits of its use?
- What’s unique about the solution?
- What types of projects will benefit from uniforms use?
- How have we implemented it in commercial projects?
- Why do we use it in (almost) each and every production app?
What is uniforms and how does it work?
uniforms is a React, open-source library designed for building forms from any schema. In other words, if an application comes with a standardized data format, uniforms can generate a form that reifies that. The library integrates with a wide range of themes, such as Ant Design, Material-UI, Bootstrap 3, and 4. It was carried out by a large developer community. As it is easy and ready to implement a solution, it has been downloaded over 500,000 times.
Why yet another form package, you may wonder. If you’ve created a more complex Meteor/React app before, then you know that managing forms can be a really tedious task. A good few years ago, when we were switching from Blaze to React, we stumbled upon a real problem – the lack of a good form library in the React ecosystem; which by the way holds true till today. So we’ve decided to create the solution ourselves, and that is how the first version of uniforms came into life in 2016. The new package allowed us to manage forms in Meteor/React apps with ease, from simple scenarios to most complex cases.
What are the benefits of uniforms use?
Writing form templates and the logic to it manually might be fine when you need just a contact form. However, in large applications, it can be a time-consuming task. Managing multiple forms might involve adding advanced functionalities, such as data binding, validation, and submission. Thus, uniforms can greatly reduce the time needed especially in the initial stages of the project as one can prototype a schema and create the form instantly. A unified way of doing it saves us a good amount of time for other features. But for ready-to-implement solutions such as uniforms, fast prototyping wouldn’t be possible at all.
The use of uniforms helps to keep your code simple. Usually, it cuts down the length of a form code by over 50%. As a result of a complete separation of logic/data and user interface, it reduces the amount of technical debt and provides better abstraction. You can display the same form correctly using other frameworks as well, such as Bootstrap or Material-UI. Usually, our competition doesn’t provide those functionalities out of the box.
Generally, developers consider managing multiple forms to be exceedingly tedious. You might not often wonder about that, but less exciting tasks always take more time than needed and leave the team exhausted. We believe that it’s far better to save your developers’ energy (and precious hours) for more demanding tasks.
Finally, at Vazco we truly believe in Open Source solutions. It helps our clients to avoid vendor lock-in. We can also cut the costs of development and testing, which in that case is partially provided by the community.
The main benefits of uniforms:
- fast and easy form development
- keeps your code simple
- improves team morale by getting rid of tedious tasks
- open-source solution – independent and available for free
Why is our solution unique?
In our view, the biggest difference is a declarative approach to building forms. Most of the solutions that serve the same purpose consist of UI components, such as blocks in the view layer (name field, pick the date, etc.). As a result, a form is generated. We can do it with uniforms as well, but the emphasis is put on building a schema in the data layer (i.e. that we need to collect the name and the date) and the package will build the form itself.
To our knowledge, uniforms is the only UI and schema independent library out there. It means that you can plug different schemas, such as JSON Schema or GraphQL, with different UIs, like Bootstrap or Material-UI, without coupling.
Software Architect at Vazco
It is the only library that combines all the following features:
- manual and automatic form layout
- manual and automatic state management
- manually trigger validation
- synchronous and asynchronous validation
- Ant Design, Bootstrap 3, Bootstrap 4, Material-UI, and Semantic-UI themes
- JSON, GraphQL, SimpleSchema, and your custom schema support.
What kind of projects will benefit from uniforms implementation?
As uniforms is just – and as much as – a library, it can be used in any kind of project. However, it is most useful where there is a need to display many complex forms that evolve along with the app development. That is, all administrative, reservation, and data flow management applications. It stands out when the forms are created by the clients, either directly (polls, questionnaires) or indirectly – user interfaces for dynamic data, such as content management systems or admin panels.
The benefits of our approach are negligible if we plan to build a contact form only. However, we start to see profits clearly while developing more complex systems that handle for example credit or insurance applications.
CTO at Vazco
uniforms use in commercial projects
Our greatest example of uniforms use is a workflow management platform Onyx. It features a very extensive panel that allows anyone to create any, even a very complex form. By saying anyone I mean every employee – even a non-technical one because we used uniforms as a citizen development framework. This approach allowed us to deliver a proof-of-concept flat out.
Onyx’s core feature is to build any kind of form and link it to an adequate graphical representation defining business processes – roles, tasks, steps, permissions, gateways, and decision tables. The Form Builder is integrated with the Camunda Business Process Management System. It allows the team to manage forms in tabs, sections, pictures, etc., and add advanced field features, such as visibility, calculations, and read-only mode.
You can also check up Clozer, a cross-platform mobile application for sellers. Here, we’ve used uniforms to simplify data collection and synchronization across various platforms and sources – email, calendar, sales bot, speech commands, and many more.
At Vazco we’re using uniforms in all our production apps...
That might not be 100% true, but we use it wherever we can. That is actually not so difficult since in almost every application there has to be a form of this or other kinds. The main reason, however, is that we truly believe in the solution we’ve created – and the active community gathered around it. A unified way of creating forms helps our clients to save a lot of time for the more demanding tasks. Last but not least, we truly place confidence in Open Source.