https://github.com/blackvoidx/User-management
simple User management CRUD with next-js react framework, typescript for type checking, redux-toolkit for state management, chakra ui for component ui library and mongoDb for database 🕘👤
https://github.com/blackvoidx/User-management
chakra-ui database formik mongodb mongoose nextjs react redux redux-toolkit rtk-query typescript yup
Last synced: 6 months ago
JSON representation
simple User management CRUD with next-js react framework, typescript for type checking, redux-toolkit for state management, chakra ui for component ui library and mongoDb for database 🕘👤
- Host: GitHub
- URL: https://github.com/blackvoidx/User-management
- Owner: mamad-1999
- Created: 2023-01-06T12:11:53.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-07-11T09:07:14.000Z (about 1 year ago)
- Last Synced: 2024-07-11T10:36:04.270Z (about 1 year ago)
- Topics: chakra-ui, database, formik, mongodb, mongoose, nextjs, react, redux, redux-toolkit, rtk-query, typescript, yup
- Language: TypeScript
- Homepage: https://user-management-kappa.vercel.app
- Size: 586 KB
- Stars: 6
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## User management
This is a User Management CRUD (Create, Read, Update, Delete) project built with Next.js, React framework, TypeScript for type checking, Redux Toolkit for state management, Chakra UI for component UI library, and MongoDB for the database. It also utilizes Formik for form handling and validation fields with Yup.
The main purpose of this project is to gain a better understanding of API routes and start working with the backend in Next.js as a full-stack React framework. Additionally, it provides an opportunity to work with RTK Query alongside Redux Toolkit. TypeScript is used as a powerful type checker for the project, ensuring type safety and better development experience.
### Features
- User registration: Create new user accounts with required fields and validation.
- User list: Display a list of all users in the system.
- User details: View detailed information about a specific user.
- User update: Edit and update user information.
- User deletion: Delete user accounts from the system.
### Technologies Used
- Next.js: A React framework for building server-side rendered and static web applications.
- React: A JavaScript library for building user interfaces.
- TypeScript: A statically typed superset of JavaScript for enhanced developer productivity.
- Redux Toolkit: A simplified state management solution for React applications.
- Chakra UI: A modular and accessible component library for building user interfaces.
- MongoDB: A popular NoSQL database for storing and retrieving data.
- Formik: A form handling library for React applications.
- Yup: A schema validation library for form field validation.
### Installation
- Clone the repository or download the project files.
- Install the required dependencies by running npm install or yarn install.
- Configure the MongoDB connection in the project's configuration files.
- Start the development server with npm run dev or yarn dev.
- Open your web browser and visit http://localhost:3000 to access the user management application.
### Usage
- Register a new user account with the required fields.
- Update user profile information, including name, email, and password.
- View a list of all users and their details.
- Edit and update user information, such as name, email, and role.
- Delete user accounts as needed.
---
this project deploy on vercel
[](https://user-management-kappa.vercel.app/)
---
If you clone and intend to run it locally, you must change the database connection address to local mongodb address
and change production url in the redux api to localhost url
