skorphil / nextjs-form

Educational NextJs project to build a complex mobile-first form

Educational project to practice React form handling.

Stack

• nextjs
• chakra chose chakra because seemed to be simpler than Mantine. But from my experience - the community is less supportive, than Mantine's.
• react-icons/css.gg
• react-hook-form
• storybook (8.0 alpha to play with RSC)
• npm-run-all (to run nextjs and storybook simultaneously)
• Comparing Schema Validation Libraries: AJV, Joi, Yup, and Zod (not choosen yet)
• framer-motion
• react-number-format to format inputs
• mongoose and mongodb-atlas

Table Of Contents

• Project Task
• App Architecture
• Project Structure
• Learned topics
• Project Management

Components preview

• Chromatic