Array Analyzer is a React web application that allows users to manage and analyze numerical arrays. Users can add elements to the array, identify duplicated elements, view their occurrence count, and highlight occurrences and indexes.
- Demo :
https://6mzhmd-3000.csb.app/
-
State Management:
- Utilizes the
useReducer
hook for efficient state management. - Initializes state using
initialState
and a reducer function from thereducer
module.
- Utilizes the
-
Duplicate Detection:
- Implements a
findDuplicates
function to identify duplicated elements within the array. - Displays duplicated elements along with their occurrence count.
- Implements a
-
Rendering Lists:
- Defines a
renderList
function for rendering arrays with optional borders. - Renders arrays and indexes with optional titles for a clear and organized display.
- Defines a
-
User Input Handling:
- Allows users to add numerical elements to the array via an input field.
- Validates input and displays an error message for invalid inputs.
-
Interactive Duplicates Display:
- Displays duplicated elements with occurrence counts in a visually appealing layout.
- Highlights the selected duplicated element, updating the state accordingly.
-
Technologies Used:
- React
- Mantine Hooks (for
useShallowEffect
) - Styled Components (for styling)
-
Install dependencies:
npm install # or yarn install
-
runing the project:
npm start # or yarn start