# idris-p/f1-strategy-analyser architecture

> Architecture diagram of the GitHub repository idris-p/f1-strategy-analyser, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/idris-p/f1-strategy-analyser
- Repository: https://github.com/idris-p/f1-strategy-analyser

## Overview

The product is an interactive F1 race-strategy explorer: users select a season and Grand Prix, then inspect race information, available tyres, finishing order and driver stint strategies. The React app obtains season and round choices from a FastAPI backend, which serves filtered data from two CSV files. The README also identifies FastF1 and Jupyter as part of the data stack, and the tree contains strategy-related notebooks; their implementation details and connections to the served CSVs are not established by the sampled source.

Main entry points: [`backend/server/server.py`](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/server/server.py) (FastAPI endpoints), [`frontend/src/App.jsx`](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/App.jsx) (App), [`frontend/src/components/Carousels.jsx`](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/Carousels.jsx) (Season and round selectors), [`frontend/src/components/AvailableCompounds.jsx`](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/AvailableCompounds.jsx) (Available compounds)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Race explorer UI"]
  node_app["App<br/>[App.jsx]"]
  node_selectors["Season and round selectors<br/>[Carousels.jsx]"]
  node_yearcarousel["Year carousel<br/>[CarouselYear.jsx]"]
  node_roundcarousel["Round carousel<br/>[CarouselRounds.jsx]"]
  node_compounds["Available compounds"]
  node_results["Race results table<br/>[Table.jsx]"]
  node_strategyview["Stint strategy view<br/>[StrategyTable.jsx]"]
end

subgraph group_backend["API and data"]
  node_api["FastAPI endpoints<br/>[server.py]"]
  node_strategies[("Strategy dataset")]
  node_grandprix[("Grand Prix dataset")]
  node_compoundmap["Compound data"]
end

subgraph group_preparation["Data preparation"]
  node_strategy_notebook["Strategy notebook<br/>[get_strategy.ipynb]"]
  node_update_notebook["Update notebook"]
end

node_visitor(("User"))
node_fastf1["FastF1"]

node_visitor -->|"uses"| node_app
node_app -->|"renders"| node_selectors
node_app -->|"renders"| node_compounds
node_app -->|"renders"| node_results
node_app -->|"renders"| node_strategyview
node_selectors -->|"renders"| node_yearcarousel
node_selectors -->|"renders"| node_roundcarousel
node_selectors -->|"fetches years and rounds"| node_api
node_compounds -->|"fetches Grand Prix"| node_api
node_results -->|"fetches strategies"| node_api
node_strategyview -->|"fetches race data"| node_api
node_api -->|"reads"| node_strategies
node_api -->|"reads"| node_grandprix
node_fastf1 -.->|"data source"| node_strategy_notebook
node_fastf1 -.->|"data source"| node_update_notebook

click node_app "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/App.jsx"
click node_selectors "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/Carousels.jsx"
click node_yearcarousel "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/CarouselYear.jsx"
click node_roundcarousel "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/CarouselRounds.jsx"
click node_compounds "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/AvailableCompounds.jsx"
click node_results "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/Table.jsx"
click node_strategyview "https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/StrategyTable.jsx"
click node_api "https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/server/server.py"
click node_strategies "https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/f1_strategy_data.csv"
click node_grandprix "https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/f1_grand_prix_data.csv"
click node_compoundmap "https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/available_compounds.py"
click node_strategy_notebook "https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/get_strategy.ipynb"
click node_update_notebook "https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/update_strategy.ipynb"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app,node_selectors,node_yearcarousel,node_roundcarousel,node_compounds,node_results,node_strategyview,node_visitor toneBlue
class node_api,node_strategies,node_grandprix,node_compoundmap toneAmber
class node_strategy_notebook,node_update_notebook toneMint
class node_fastf1 toneIndigo
```

## Components

### Race explorer UI

- [App](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Season and round selectors](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/Carousels.jsx): `frontend/src/components/Carousels.jsx`
- [Year carousel](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/CarouselYear.jsx): `frontend/src/components/CarouselYear.jsx`
- [Round carousel](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/CarouselRounds.jsx): `frontend/src/components/CarouselRounds.jsx`
- [Available compounds](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/AvailableCompounds.jsx): `frontend/src/components/AvailableCompounds.jsx`
- [Race results table](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/Table.jsx): `frontend/src/components/Table.jsx`
- [Stint strategy view](https://github.com/idris-p/f1-strategy-analyser/blob/master/frontend/src/components/StrategyTable.jsx): `frontend/src/components/StrategyTable.jsx`

### API and data

- [FastAPI endpoints](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/server/server.py): `backend/server/server.py`
- [Strategy dataset](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/f1_strategy_data.csv): `backend/f1_strategy_data.csv`
- [Grand Prix dataset](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/f1_grand_prix_data.csv): `backend/f1_grand_prix_data.csv`
- [Compound data](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/available_compounds.py): `backend/available_compounds.py`

### Data preparation

- [Strategy notebook](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/get_strategy.ipynb): `backend/get_strategy.ipynb`
- [Update notebook](https://github.com/idris-p/f1-strategy-analyser/blob/master/backend/update_strategy.ipynb): `backend/update_strategy.ipynb`

### Other components

- **User**
- **FastF1**

## Connections

- User → App: uses
- App → Season and round selectors: renders
- App → Available compounds: renders
- App → Race results table: renders
- App → Stint strategy view: renders
- Season and round selectors → Year carousel: renders
- Season and round selectors → Round carousel: renders
- Season and round selectors → FastAPI endpoints: fetches years and rounds
- Available compounds → FastAPI endpoints: fetches Grand Prix
- Race results table → FastAPI endpoints: fetches strategies
- Stint strategy view → FastAPI endpoints: fetches race data
- FastAPI endpoints → Strategy dataset: reads
- FastAPI endpoints → Grand Prix dataset: reads
- FastF1 → Strategy notebook: data source
- FastF1 → Update notebook: data source