Introduction
It's official, I have completed another application using REACT as the frontend framework, and Rails on the backend. Inside Rails, I used ActiveRecord as my ORM framework. My project "has many" (no pun intended) forms throughout. A form for a user to log in with a username and password, a form for a user to create new content, a form for a user to create new projects within the new content, and a form for the user to edit a project they already created. To say the least, there are a lot of forms, and I needed validations to prevent a user from submitting bad data. Data that could harm the database, or blow up the frontend. Thus, I wanted to write about validations, why we need them, and which validations are better, frontend or backend.
FrontEnd Validations
Frontend validations are great for many reasons, but they also have some downsides. One reason they are great is some frontend validations are easy to implement. For example, in REACT, I simply added the required property to the end of my form input field like so:
<form onSubmit={ handleSubmit }>
<input type="text" placeholder="Username" name="username" value={ signInForm.username } onChange={ handleChange } required/>
<input type="text" placeholder="Password" name="password" value={ signInForm.password } onChange={ handleChange } required/>
<button>Sign In</button>
</form>
This property caused each of my input fields to require data before the form could be submitted.
Another reason why frontend validations are great, is they prevent any need for a request to the backend and this saves a user valuable time. For instance, if the user of our app is at home, hooked up to blazing-fast internet speeds, this might not be an issue. However, as we all know, many people use mobile devices in today's world. Mobile internet speeds have increased, but often slow down due to many factors. A user on a mobile device may become irritated at the slow form submission and give up using our app altogether. To prevent this, it's simple to set up frontend validations so our users can immediately see any errors they might have made.
On the other side of the coin, I have found two large issues with only using frontend validations. First, validations can become very complex and cause our app to not be as optimized as it could be. Second, frontend validations still leave our database exposed to users submitting bad data. For example, we could easily use an application like Postman to submit bad data to our backend without the frontend validations looking at the data. Without backend validations, our database can easily become corrupt.
BackEnd Validations
As stated above, backend validations have bonuses and drawbacks. The bonuses are that backend validations prevent users on the frontend, and users who circumvent the frontend, from sending bad data to our app's database. The downside is a user must wait for a request to be sent to the database, and returned, before they know if the data they entered will be accepted.
Although there are downsides, backend validations are crucial. Outside of preventing bad data from entering our database, the greatest bonus I found is that they are incredibly simple. I used ActiveRecord as an ORM Framework in Rails and this made the job even easier.
To briefly summarize how easy validations are, let me provide a screenshot of my users model. It is titled contractors since a contractor is the user of the app.
class Contractor < ApplicationRecord
has_secure_password
has_many :projects
has_many :houses, through: :projects
validates :name, presence: true
validates :specialty, presence: true
validates :company, presence: true
validates :city, presence: true
validates :state, presence: true
validates :username, presence: true, uniqueness: true
validates :password_digest, presence: true
end
For a contractor(user) to sign up for an account using the form I provided on the frontend, I wanted to verify that all fields contained some sort of data. I did this simply by requiring the presence: to be true. For the username, I desired each user to first have a username, and second, to have a unique username. I simply added uniqueness: true to require this and boom, my validations were created in the backend. No sophisticated logic, or endless functions on the frontend. I could have added many more validations to my app, but for my simple app, I decided to simply validate the presence of data for all of the fields.
A developer could easily validate the number of characters, uniqueness, email, or dates within a specific range. These and so many more validations can be quickly implemented on the backend. Not only is the validation process super easy, but errors can usually be shown on the frontend to a user who may have provided wrong information. Combined, these features show the power of backend validations.
For more ActiveRecord validations, I would encourage you to visit the ActiveRecord validations page.
So, BackEnd or FrontEnd Validations?
Frontend or backend? Which area of validation should you choose? In my opinion, you should use both frontend and backend! At the very least, you should always validate data on the backend to protect your database. Some frontend validations are easy to create. Thus, they are an easy solution to overcome the downside of using backend-only validations. By using both, a user does not need to wait for a server request for most of the validations to appear. However, if the use manages to enter bad data on the frontend, our backend validations should catch any errors.
Give validations a shot, and see what you can come up with to protect your database!
