Image by IO-Images from Pixabay

If you’re here, you’re probably having problems customizing the input[type=file] tag to match your designs. It would be much easier if it were a button instead.

In this tutorial, we’ll be looking just at that. This one, in particular, is done using bootstrap, so for the rest of the tutorial, I’ll assume you have bootstrap installed.


“Build forms in React without the tears.” Considering all the tears that typing in all the separate states for each form variable would bring, Formik is not lying with their tagline. This article will go through how to build a Formik form in a more React-(ive) way in React Native coupled with Yup for validation.

By the end of the article, you will have a basic reusable sign-up form using the best code practices. And to achieve that, we will go through these steps:

  1. Create a new react-native project
  2. Install Formik and Yup dependencies
  3. Build a sign-up form
  4. Add Yup…

Prince Shrestha

Junior Dev && struggling writer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store