evopark_coding_challenge.md

Evopark Coding Challenge – Trainline Connections UI

Goal

Build a Single Page Application (SPA) using a modern frontend framework (Vue.js, Svelte, or React) that displays train connections between two cities using thetrainline.com as a data source.

Note: Candidates can either:

• Use a public Trainline API if accessible, or
• Use a local JSON file simulating real train connection data.

---

1. Input

• A form with the following fields:
  • from – Departure station
  • to – Arrival station
  • departureAt – Desired departure date
• Optional: Autocomplete for station names (nice-to-have).

---

2. Data Source

• Option 1 (preferred, if allowed): Fetch real data from a public Trainline API.
• Option 2 (fallback): Use a local JSON file with a structure similar to real train connections.

Segment Data Format (JSON):

{
  "departure_station": "Ashchurch For Tewkesbury",
  "departure_at": "2025-12-08T08:00:00",
  "arrival_station": "Ash",
  "arrival_at": "2025-12-08T10:30:00",
  "duration_in_minutes": 150,
  "changeovers": 2,
  "products": ["train"],
  "fares": [
    {
      "name": "Advance Single",
      "price_in_cents": 1939,
      "currency": "GBP",
      "comfort_class": 1
    }
  ]
}

3. Functionality

Display Connections

• Show all segments in a table or list.
• Include key information for each segment:
  • Departure station
  • Arrival station
  • Departure and arrival times
  • Duration
  • Number of changeovers
  • Price of the fare

Example Table Row:

Departure	Arrival	Departure Time	Arrival Time	Duration	Changeovers	Price
Ashchurch For Tewkesbury	Ash	08:00	10:30	150 min	2	£25.99

---

Filtering

• Show only direct connections (0 changeovers)

---

Responsiveness

• Application should be mobile-friendly and look good on desktop.
• Use a clean and readable layout for lists or tables.

---

4. Bonus

• Fetch real-time data from Trainline.com if an API is available.
• Smooth animations when expanding segment details.
• Sorting by departure time, duration, price
• Tests

---

5. Submission

• GitHub repository or ZIP file.
• Short README with setup and run instructions.
• Frontend-only implementation; backend is not required.