https://github.com/gaurav091100/manufac_frontend_data_analysis_task

This project is designed to analyze agricultural data from India and display it in an interactive, user-friendly format using Mantine v7 and TypeScript. The task is to perform some basic analytics over the dataset, aggregating crop production and average yield and area information over the years (1950-2020).
https://github.com/gaurav091100/manufac_frontend_data_analysis_task

mantine-v7 reactjs typescript

Last synced: 20 days ago
JSON representation

This project is designed to analyze agricultural data from India and display it in an interactive, user-friendly format using Mantine v7 and TypeScript. The task is to perform some basic analytics over the dataset, aggregating crop production and average yield and area information over the years (1950-2020).

• Host: GitHub
• URL: https://github.com/gaurav091100/manufac_frontend_data_analysis_task
• Owner: gaurav091100
• Created: 2024-11-30T10:30:18.000Z (about 1 month ago)
• Default Branch: main
• Last Pushed: 2024-11-30T10:50:30.000Z (about 1 month ago)
• Last Synced: 2024-11-30T11:26:51.160Z (about 1 month ago)
• Topics: mantine-v7, reactjs, typescript
• Language: TypeScript
• Homepage: https://manufac-frontend-data-analysis-task.vercel.app
• Size: 0 Bytes
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
Frontend Deployed Link :- https://manufac-frontend-data-analysis-task.vercel.app/

# Frontend Data Analysis Task (Indian Agriculture Dataset)

# Project Overview

This project is designed to analyze agricultural data from India and display it in an interactive, user-friendly format using Mantine v7 and TypeScript. The task is to perform some basic analytics over the dataset, aggregating crop production and average yield and area information over the years (1950-2020).

The project uses a Vite Min Template as the starting point, which is already configured with TypeScript.

# Tech Stack Used

Languages/Libraries/Tools:

TypeScript

Mantine v7 (for table components)

React.js

Vite (for fast development environment)

# Tasks:

Aggregating crop production data to display the crop with maximum and minimum production per year.

Aggregating crop yield and cultivation area to display average values for each crop over the years 1950-2020.

Display the results in two tables:

  1. Crop Production Overview: Maximum and Minimum production per crop for each year.

  2. Average Metrics per Crop: Average yield and average cultivation area per crop.

To get started, clone the repository and install dependencies using Yarn:

git clone https://github.com/gaurav091100/manufac_Frontend_data_analysis_task.git

cd manufac_Frontend_data_analysis_task

yarn install

To run the project locally, execute the following command:

yarn dev

This will start the development server, and your browser will open with the rendered data tables.

# Here are screenshots of the final output:

Crop Production Overview by Year  and Average Metrics per Crop (1950-2020)

![Screenshot 2024-11-30 161437](https://github.com/user-attachments/assets/7bf00ebc-dab8-4c2f-88ff-bdb4b82ddac6)

Crop Production Overview by Year

![Screenshot 2024-11-30 161314](https://github.com/user-attachments/assets/f7ffaeb0-251e-43cb-8065-5d7b696f39dd)

Average Metrics per Crop (1950-2020)

![Screenshot 2024-11-30 161410](https://github.com/user-attachments/assets/d88bfe16-f0a2-4604-b7ac-ad5f12311bcf)