This is a nice example because every web app has this workflow! Marshmallow schema Additionally we'll also check that the email address given is not already in use. On the backend, we'll again check all the required fields are there, and verify the length of the password. We'll check the password is at least 8 characters. On the frontend, we'll check that the name, email address and password are not null, and correctly formatted. To show you how all the pieces connect together, we're going to build a simple signup form. We're also going to use webargs which allows us to 'connect' Marshmallow to Flask, and valid the request data using a Marshallow schema. The backend will use Marshmallow, it's a library for serialization of objects, but it also contains support for validation - which we'll be using. The documentation for it is excellent, it's well designed, and easy to add customise everything. I'm a Python 3 & React developer, so we're going to be using Flask as our backend framework, and React for our frontend.įor building the forms on the frontend I'm going to use Formik, it's the best library out there to build forms in React at the moment. The tools/libraries that we're going to be using for this

If there are any errors in the data, we'll send back a response that can be parsed by the frontend and displayed next to the correct form field that is the cause of the error. We'll follow the princple of not trusting user data, which is why we run a second set of validations on the backend to verify that everything is as expected. The goal of this how-to post is to walk you through how you can add client side validation to forms on the frontend, and when it's posted to the backend, run a second set of validations on the data to make sure it's valid.

Best email clients marshmallow