Tournament Tree

A tournament tree app to show knockout stages

Table Of Content

• About
• Built With
• Project Overview
• Getting Started
  • Prerequisites
  • Installation
• Usage
• Project Status
• Roadmap
• License

About

This is a project that aims to create a single elimination tournament tree for sports tournament matchups.

Built With

Used following resources for the project:

• 
• 
• 
• 

(back to top)

Project Overview

The project consists of the following components:

• Matchups
• Tournament Tree

(back to top)

Getting Started

To get a local copy up and running follow these simple steps.

Prerequisites

You need to have following prerequisites.

• Node.js 16.14 or later

Installation

Please follow the below instructions to install and setup the tool.

1. Clone the repo with HTTPS

   git clone https://github.com/ozanisgor/tournament-tree.git

2. Or clone the repo with SSH

   git clone git@github.com:ozanisgor/tournament-tree.git

3. Install NPM packages

   npm install

4. Run the app in development mode

   npm run dev

(back to top)

Usage

Prepare a JSON file in the following format:

[
  {
    "id": 1,
    "round": 1,
    "match": 1,
    "players": [
      {
        "id": 1,
        "name": "TEAM A",
        "seed": 1
      },
      {
        "id": 2,
        "name": "TEAM P",
        "seed": 16
      }
    ],
    "score": [
      [3, 2],
      [4, 3],
      [5, 7]
    ]
  },
  ...
]

Get the data and pass to the Bracket

export default function Home({ matches }) {
  return (
    <div>
      <Bracket matches={matches} />
    </div>
  );
}

export async function getStaticProps() {
  const matches = await getLocalData();

  return {
    props: { matches },
  };
}

(back to top)

Project Status

• Development Stage: Beta

  • Project is currently in the beta phase, with most of the core features implemented and tested.

• Maintenance: Active

  • Actively maintaining and updating the project with bug fixes, performance enhancements, and new features.

• Future Plans:

  • Planning to improve the user interface based on user feedback.

(back to top)

Roadmap

• Colored connector lines for the highlighted player
• More details about matchups
• Add images

(back to top)

License

The project is licensed under the MIT License.

(back to top)