Assessment Dashboard

This project serves as an Admin Dashboard tailored to exhibit comprehensive statistics concerning assessment activities, encompassing creation, management, and user engagements within the platform's ecosystem. It was crafted as an essential component of the application process for the Unstop Frontend Developer role.

Overview

This React application serves as an Admin dashboard presenting statistics and data regarding assessments within the system. Some key features and aspects of this project include:

• Pixel-Perfect Design: The components have been meticulously designed to achieve a pixel-perfect appearance, barring a few minor and unnoticeable areas.
• Assessment Management: Adding a new assessment dynamically updates the state and reflects the newly added assessment in the list.
• Storage: Assessments are currently stored in the localStorage. In a real-world scenario, this would be replaced by a backend database to ensure data persistence and scalability.
• User-Based Features: The sidebar option "Admin Round Status" is implemented considering an Admin user perspective. Changing the user can alter or disable this feature accordingly.
• Enhanced UX: Simple hover states have been integrated into tabs/links to enhance the user experience.
• Transitions: Implementations of most transitions, as specified in the Figma prototype, have been incorporated for a more dynamic interface.

How to Run the Application

To run this React application locally, follow these steps:

1. Clone Repository: Clone this repository to your local machine using the command:

   git clone <repository-url>
   

2. Navigate to Project Directory: Move into the project directory:

cd <folder>

3. Install Dependencies: Use npm or yarn to install the necessary dependencies:

npm install
or
yarn install

4. Run the Application: Once the installation is complete, start the React application:

npm start
or
yarn start

5. Access the Application: Open your browser and go to http://localhost:3000 to view and interact with the Admin Dashboard.

Screenshots

Language and Framework

This project is developed using React, a JavaScript library for building user interfaces, and utilizes various front-end technologies to achieve the desired functionalities and user experience.