❓ This repository hosts my full-stack project, Cropland CROS POC. The aim of this project is to explore whether we can develop and deploy the Cropland CROS site in-house using available open data, rather than relying on USDA resources.
All the code in frontend and backend are made with TypeScript, Python and GDAL and with latest libraries and standards.
- Frontend powered by React, Vite, and Material UI for components.
- Routing by React Router, state management by Tanstack Query (React Query).
- Map powered by Mapbox.
- Backend powered by Python using FastAPI and pixi framework. Here is the API document
- GDAL used for raster manipulation
-
Create a simple UI that allows users to draw a polygon on a map and calculate cropland statistics for the polygon.
-
The backend API currently takes only the 2022.tif file for calculations, but the year can be adjusted using a slider on the front end.
-
Display the JSON response in a draggable data table. The results will filter crop with 0 acres
-
In the area of interest, provide a list of U.S. states and display counties for the selected state.
-
For a chosen state or county, fetch the shape (GeoJSON) from tigerweb.geo.census.gov and show a notification for success or failure.
-
Note that the button in the area of interest is non-functional at the moment. In the future, it will call the backend API to retrieve county/state GeoJSON and compute crop statistics.
-
A custom hook (useHook) has been created for data fetching
-
Clone down this repository. You will need node
and npm
installed globally on your machine.
Installation:
npm install
To Start Server:
npm start
To Run Test Suite:
npm test
Note : App runs on port 5173 - this is port added in CORS origin list. If you different port, please update
Note 2: Download the 2022 Cropland Raster from USDA and rename to 2022.tif Download-link. Due to github size limit. Dummy file has been uploaded , please delete and use from USDA .Thanks!