https://github.com/rohitchourey0809/travel-corporation-assignmnent

The Group Management Application is a React-based web application designed to manage groups of numeric ranges. It allows users to add, delete, and update groups dynamically, with validation to ensure no overlaps or gaps between consecutive groups.
https://github.com/rohitchourey0809/travel-corporation-assignmnent

chakraui framer-motion react

Last synced: about 16 hours ago
JSON representation

The Group Management Application is a React-based web application designed to manage groups of numeric ranges. It allows users to add, delete, and update groups dynamically, with validation to ensure no overlaps or gaps between consecutive groups.

• Host: GitHub
• URL: https://github.com/rohitchourey0809/travel-corporation-assignmnent
• Owner: rohitchourey0809
• Created: 2024-06-14T20:00:19.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-06-15T12:22:55.000Z (5 months ago)
• Last Synced: 2024-06-15T21:26:13.619Z (5 months ago)
• Topics: chakraui, framer-motion, react
• Language: JavaScript
• Homepage: https://travel-corporation-assignmnent.vercel.app/
• Size: 364 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
Group Management Application

# Overview

```

The Group Management Application is a React-based web application designed to manage groups of numeric ranges. It allows users to add, delete, and update groups dynamically, with validation to ensure no overlaps or gaps between consecutive groups.

```

# Demo

![image](https://github.com/rohitchourey0809/Travel-Corporation-Assignmnent/assets/97465195/bf15a5b1-0bfe-4d0b-8242-cebaa04b71a0)

# Features

```

Add Group: Users can add a new group with a specified numeric range.

Delete Group: Users can delete an existing group.

Update Group: Users can update the numeric range of an existing group.

Validation: The application ensures that:

Groups cover the entire range from 1 to 10.

There are no gaps between consecutive groups.

There are no overlaps between consecutive groups.

```

# Technologies Used

```

React

Redux (for state management)

Chakra UI (for UI components)

Framer Motion (for animations)

```

Installation

To run this project locally, follow these steps:

Clone the repository:

```

git clone https://github.com/rohitchourey0809/Travel-Corporation-Assignmnent.git

```

Navigate into the project directory:

cd travel-corporation

Install dependencies:

npm install

Start the development server:

npm start

Open http://localhost:3000 to view it in the browser.

# Usage

```

Adding a Group: Enter a numeric range (from and to) in the input fields and click "Add Group".

Updating a Group: Modify the numeric range directly in the input fields of the existing groups.

Deleting a Group: Click the delete icon (trash can) next to the group to remove it from the list.

```