Back to Portfolio

Sports Event Landing Page

Case study: developing a landing page and admin panel for the SPORTFEST 2024 sports event

The Challenge

The project delivers a digital platform for announcing, managing and covering a major sports event. The client's key goals: build an attractive, responsive landing page with a strong focus on visuals and usability; create an admin panel for managing content (athletes, schedule, sponsors, FAQ, general settings); connect the frontend and backend through an API for flexibility and scalability.

Our Solution

Project: a modern web application for organising and promoting an international sports championship.

Sports event landing page — 1

Delivered functionality

Public website

  • Hero section — a banner with event information and registration buttons.
  • About the event — a section describing the championship, disciplines, number of participants and contacts.
  • Athletes — interactive cards with photos, achievements and countries.
  • Schedule — tabs by day, showing events, times and venues.
  • Sponsors — a grid of partner logos and a call for cooperation.
  • FAQ — a dynamic accordion with frequently asked questions.
  • Registration — a form for participants and guests.
  • Footer — contacts and social media links.

Admin panel

  • Authentication and access protection (JWT tokens, Symfony Security).
  • General settings: editing event information, contact details and the banner.
  • Athletes: adding, editing and deleting entries, uploading photos and achievements.
  • Schedule: flexible management of days and events.
  • Sponsors: uploading logos, configuring display order.
  • FAQ: CRUD operations for questions and answers.
  • Publishing: domain, SSL, caching and compression configuration.

MacBook Mockup, Floating.jpeg

Technology stack

Frontend:

  • React 18 (UI)
  • TypeScript 5.7
  • Vite 6 (fast builds)
  • Tailwind CSS + HeroUI (interface)
  • Framer Motion (animations)

Backend:

  • PHP 8.1+ (Symfony 6)
  • API Platform (REST API)
  • Doctrine ORM
  • Symfony Security / Validator / Serializer

Database:

  • MySQL 8.0

Infrastructure and tools:

  • PostCSS / ESLint / Babel
  • Composer / Symfony CLI

Architecture highlights

  • Component-based React UI with reusable blocks.
  • Automatic REST API generation with API Platform.
  • Frontend-backend integration through secured CORS requests.
  • Data validation and JWT authentication.
  • Doctrine ORM — safe database access and migrations.
  • Tailwind — responsive, utility-first styling.

Mobile App Screen Mockup, Mosaic.jpeg

Development stages

Week 1 — Analysis and design

  • Architecture and interface prototype.
  • Environment setup and project structure.

Week 2 — Landing page and API development

  • Frontend implementation in React.
  • REST API built with Symfony.
  • Entity setup: athletes, schedule, FAQ, sponsors.

Week 3 — Integration and launch

  • Connecting the frontend to the API.
  • Testing and performance optimisation.
  • Deployment to the production server.

Total duration: 3 weeks.

Project team

  • Project manager: 1
  • Frontend developer: 1
  • Backend developer: 1

The Result

The project was successfully delivered to the client. The work was completed in 2025.