Project

The project is bootstrapped with Create React App, as mentioned in the README.md.

Main Technologies

• React: A JavaScript library for building user interfaces.
• Material UI: A popular React UI framework.
• Leaflet: An open-source JavaScript library for mobile-friendly interactive maps.
• Axios: A promise-based HTTP client for making HTTP requests.

Key Components

App Component

The App.tsx serves as the root component, wrapping the Header and MainContent components.

Header Component

The Header Component is defined in index.tsx and displays the application's header with styling and layout.

MainContent Component

The MainContent Component, located in index.tsx, is the central part of the application, integrating various subcomponents like MapContainer, Heatmap, and FilterSection.

FilterSection Component

The FilterSection.tsx allows users to filter maritime traffic data based on ship ID and name.

Heatmap Component

The Heatmap Component, found in index.tsx, visualizes data in a heatmap format on the map.

TextField Component

A custom styled text field component for input, located in index.tsx.

Services and Types

API Service

The API Service, defined in index.ts, sets up the Axios instance for API requests.

Type Definitions

Type Definitions for ship data and API responses are in index.ts.

Additional Information

• Scripts: Includes standard scripts like npm start, npm test, npm run build, and npm run eject, as outlined in the README.
• Deployment and Customization: Instructions for deployment and customization are provided in the README.

This repository is a comprehensive example of a modern React application with a focus on data visualization and user interaction.