A Form app with best practices for form validation & form handling including basic form validation, complex form validation, form handling with FormData API, custom hooks also with comments.
About Me πΒ»
π« How to reach me
-
Clone the repo
git clone
-
Install NPM packages
npm install
-
Run the project
npm run dev
-
Open the project on your browser
http://localhost:8080/
In this project, I built a Form app with best practices for form validation & form handling including basic form validation, complex form validation, form handling with FormData API, custom hooks also with comments. Used React and TypeScript with the help of RS Build. I used the RS Build instead of Webpack to make the project more poweful with the help of RS Build's features. For more information about RS Build, you can check the RS Build documentation.
- Project Setup
- Implementing RS Build
- Implementing Tailwind CSS
- Implementing React Router
- Create a basic Login component
- Implement form validation and explain it with comments
- Refactor constants in constants.ts
- Refactor form component
- Create custom Tailwind CSS classes
- Create ComplexForm component
- Implement form validation in ComplexForm component
- Implement FormData API in ComplexForm component
- Explain ComplexForm walkthrough with comments
- Create LoginValidate component
- Implement 4 different validation methods in LoginValidate component
- Create Custom Hook for form validation in useInput
- Explain LoginValidate walkthrough with comments
- Implement useInput hook in ComplexForm component and explain it with comments
- Finish the project π
- Deploy the project on Vercel π
- Additionally, 3rd party libraries are at least I know;
To learn more about RS Build, take a look at the following resources:
- RS Build Documentation - learn about RS Build features and more tools.
- RS Build Reacy - documentation about RS Build React features.