A couple of days ago, I launched Iodine. A micro client-side validation library for verifying the integrity of your data. In this article, I’ll explore how it works and I why I decided to build it given the plethora of options already available.
You’re probably wondering, why create a validation library when there are so many packages out there? Well, to understand that, you need to consider the two schools of thought that exist when it comes to client-side data validation:
You should apply as much data validation at the client-side as you possibly can because your servers are extremely fragile and cannot possibly handle the extra responsibility of having to handle all those failed validation requests.
No matter how much validation you apply at the client-side, a malicious user can still bypass all of it and send any data they want to the server. As a result, you cannot trust any incoming data, which means you have to validate it once it reaches the server. Therefore, why bother validating at the client-side?
Both schools have valid points, leading me to end up sitting in the middle. The problem is, many of the libraries that exist are firmly rooted in the school #1 belief system and are therefore heavy, complex and require a learning curve.
I didn’t want that. Instead, I wanted something simple, usable on the fly, not limited to forms and free of unnecessary setup. I also wanted it to feel a lot like Laravel, which is the server-side framework I like to use.
I’ve also been very much inspired by the minimal, light and straightforward paradigm that Caleb Porzio has been using to build amazing projects like Alpine and Livewire. In 2020, it now feels, at least to me, that we shouldn’t be building anything that seems “heavy”, unless there is no practical alternative.
When building the library, I wanted to be able to take advantage of it at any time (and without any setup) to verify a single piece of data.
For example, suppose that somewhere in your app you had an email address you needed to verify. I didn’t want to have to create a validation object, pass it through and interpret the result. Instead, I just wanted to able to check it and know whether it was valid. Iodine does that:
Iodine.isEmail('[firstname.lastname@example.org](mailto:email@example.com)'); // true Iodine.isEmail('fake\_email\_address'); // false
I also wanted to be able to verify that a piece of data satisfies multiple rules, without having to create rule objects loaded with meta data. Iodine does that:
Iodine.is(7, ['required', 'integer', 'minimum:5']); // true Iodine.is('hello', ['required', 'integer', 'minimum:5']); // false
Finally, I wanted an easy way to get an error message if a particular rule failed to pass. Since Iodine returns the rule name when validation fails e.g. ‘integer’ or ‘minimum:7’, you can simply pass it to the getErrorMessage method:
Iodine.getErrorMessage('minimum:7'); // string Iodine.getErrorMessage('minimum', 7); // string
Iodine also supports optional values and includes functionality to replace the default set of error messages e.g. with your own localisation. Out of the box, it includes 27 rules and more will be added over time. I’m also hoping to add support for custom rules that you can define yourself.
I encourage you to check out the readme for more details and examples.
If you’d like to keep up to date with news about Iodine and other projects, then please follow me on Twitter. Thanks for reading and have a great day!