Datamade challenge

[Ibarra11]

Overview

This repository contains my submission for the DataMade Junior Developer position.

Demo

Screen.Recording.2026-03-13.at.8.11.07.PM.mov

Notes

Frontend Data Fetching

If this application were expanded further, I would likely introduce something like TanStack Query for data fetching instead of using useEffect.

TanStack Query provides:

• Request caching
• Background refetching
• Built-in loading and error states

Loading States

In this implementation, the data is fetched from a local file, so latency is negligible.

If the data were retrieved from a database or external API, I would add:

• Loading indicators
• Skeleton states

Error Handling

In a production application, I would add an Error Boundary to catch unexpected rendering errors and prevent the entire React application from crashing.

Map Visualization

Some of the map colors were difficult to distinguish. Increasing the contrast between color ranges would improve readability and accessibility of the map.

Data Validation

I would add validation for the GeoJSON data to ensure it matches the expected schema before rendering.

In TypeScript projects I typically use Zod for schema validation to catch malformed data before it reaches the UI.

URL State / Shareability

Another improvement would be storing filter state (for example the selected year) in URL search parameters.

• Users can share links with the current map state
• The UI state persists across page refreshes
• Improves bookmarking and navigation