https://github.com/ebazhanov/multi-steps-form-formik-mui

An example of "Multi steps Form" with "Progress bar" based on Formik and Material UI library 🎉
https://github.com/ebazhanov/multi-steps-form-formik-mui

formik material-ui mui react typescript yup

Last synced: about 1 month ago
JSON representation

An example of "Multi steps Form" with "Progress bar" based on Formik and Material UI library 🎉

• Host: GitHub
• URL: https://github.com/ebazhanov/multi-steps-form-formik-mui
• Owner: Ebazhanov
• Created: 2022-07-10T16:12:43.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-07-26T05:53:31.000Z (over 2 years ago)
• Last Synced: 2023-03-03T20:09:35.960Z (over 1 year ago)
• Topics: formik, material-ui, mui, react, typescript, yup
• Language: TypeScript
• Homepage: https://multi-steps-form-formik-mui.vercel.app/
• Size: 502 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React "Form" with multiple step 1,2,

> Create Multi steps form using [Formik](https://formik.org/docs/api/formik) and [MaterialUI](https://mui.com/) 

#### TODO:

- [x] use Formik as state management

- [x] add Yup library as validation

- [x] navigate between two pages

- [x] add progress bar with steps

👉 [find this code in codesandbox.io](https://codesandbox.io/s/multi-steps-form-formik-mui-injdb6?file=/src/App.tsx)

![gif](multi-steps-form.gif)