Using Formik and Material-UI to Build Better Forms in React (Hooks) with Yup Validation

Subscribe: https://bit.ly/399gbok

Learn how to build better forms in React using Formik, Material-UI and Yup Validation. In this tutorial we will be building a Booking Form.

Timestamps

0:00 - Intro
0:40 - Let's get familiar with the app we will be working on
1:10 - Initialize Formik
3:45 - Form Layout - Material-UI Grid Component
5:34 - Material-UI TextField Component
10:56 - Formik Initial Form State
11:23 - Yup Validation
14:49 - Render Reusable Textfield Component
22:48 - Material-UI Select Component
31:09 - Render Reusable Select Component
32:57 - Material-UI Date Picker Component
36:51 - Render Reusable Date Picker Component
39:10 - Material-UI Textarea Component
40:42 - Material-UI Checkbox Component
47:01 - Render Reusable Checkbox Component
49:22 - Material-UI Submit Button
52:57 - Render Reusable Submit Button
53:33 - Test in the browser
54:25 - Outro

GitHub Project Repo: https://bit.ly/39WV7lr

Countries JSON File: https://bit.ly/2YaHFoE

Don't forget to comment, like and subscribe

My Website:
https://simpletut.com

Social Media:
Follow me on GitHub: https://github.com/simpletut
Follow me on FaceBook:   / simpletut  


#reactjs #formik #materialui #reacthooks #developer #javascript #programming