Inventory App React Project

A web app for save and list your products based on your categories, developed using React.js library.

Table of Contents

• Installation
• Features
• Key Concepts
• Project Structure
• Contact Information

Installation

Prerequisites

• Node.js and npm should be installed on your machine.

Steps

1. Clone the repository:

   git clone https://github.com/mahdi-q/Inventory-App-React-Project.git

2. Navigate to the project directory:

   cd Inventory-App-React-Project

3. Install the dependencies:

   npm install

4. Run the app:

   npm run dev

5. Click on the link provided in the terminal to open the app in your browser.

Features

• Create different Categories and Products
• Edit any of the Categories
• Edit and Delete any of the Products
• Search and Sort the Products at the same time

Key Concepts

This project explores several important concepts from the React library and JS:

• Context: Manage the states of project with contexts.
• Event Handler Function: Handle user interactions and events in React.
• useEffect Hook: Manage side effects in functional components using the useEffect hook.
• Local Storage: Store and retrieve data in the browser's local storage.
• Custom Hook: Reusable function that encapsulates logic using hooks.

Project Structure

• src/ - Contains the main source code for the project.
  • components/ - Components representing the project's main features.
  • contexts/ - Provides dynamic props for use across multiple components.
  • hooks/ - Custom hooks used throughout the project.
  • providers/ - All of the providers that used in project.
  • ui/ - Reusable UI components frequently used in the project.

Contact Information

For any questions or feedback, please contact me at [email protected].

---

Thank you for using the Inventory App!