A custom template based on NextJS in Typescript.
It includes the following libraries/frameworks:
- Chakra UI (UI Framework)
- React Hook Form (Form Validation)
- Joi (Validation Schema)
- React Query (Data Handling)
The following are also setup:
- Added
useJoiForm
that assists in usinguseForm
with ajoiResolver
. This uses a custom classFormObject
that would also assist you in creating the default values and schemas of your form. - Addded
<QFormControl />
which can help createFormControl
s already integrated withreact-hook-form
. To use this:- you must wrap them in a
<FormProvider />
. More info here. - For nested or complex inputs (e.g, using
<InputGroup />
), use the control prop to set what component should be registered.
- you must wrap them in a
- Chakra UI theme extended with a custom scrollbar and a full-height html page.
- Custom Layout component that handles different layout options with a navbar and footer
- To include footers in the layout, uncomment them in
/components/Layout.tsx
- To include footers in the layout, uncomment them in
- ESLint setup using recommended rules
- Custom prettier rules that includes automatic sorting of imports
- Added
next-connect
andcreateApiHandler
for handling api calls