Packages

Styling

• Tailwind CSS
• CSS Modules
• Bootstrap CSS

Build Admin Dashboard

• Ant.design - https://ant.design/ (We will be using this to build the dashboards)
• use-query-params - To parse query params
• Next Query Params - https://www.npmjs.com/package/next-query-params (Will be used in pagination for Datatables. It's based on use-query-params but for next.js )

Lightweight Development

If we are supposed to build landinage pages or some speed critical pages then use these packages as replacement for above packages.

• React Hook Form - https://react-hook-form.com/
• React Select - https://react-select.com/home
• Tailwind Headless UI - https://headlessui.com/

State Managemetn

• jotai - https://jotai.org/
  • Youtube: How to do State management in React using Jotai by building a Shopping cart
  • Youtube: State Management for React: Jotai From Beginners to Masters

Utility Functions

• @muft/dailyfns - https://www.npmjs.com/package/@muft/dailyfns (These package contains everyday use functions.)
• @muft/dot - https://www.npmjs.com/package/@muft/dot (dot makes it possible to transform javascript objects using dot notation or array of strings.)

Communication

• React Query - https://tanstack.com/query
• Graphql Request - https://github.com/prisma-labs/graphql-request
• Graphql - https://github.com/graphql/graphql-js

Others

• React Toastify - https://www.npmjs.com/package/react-toastify

Icons

• React FontAwesome - https://fontawesome.com/v5/docs/web/use-with/react