Skip to content

qiubee/setrack

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

The letter "S" with a tail going straight up. It's divided into 5 sections showing the following colors from start to tail: blue, green, purple, orange and pink.

Setrack

Setrack (Sporting event tracker) is an app where you can track a sporting event yourself, save it and/or share it.

Contents

  1. How to install
  2. Concept
  3. Features
  4. Browser compatibility
  5. Accessability
  6. License

How to install

To install the repository and run the app, follow these steps in your terminal:

  1. Choose a directory and clone the repository:
git clone https://github.com/qiubee/setrack.git
  1. Navigate to the cloned repository and install the dependencies:
# Navigate to repository
cd setrack

# Install dependencies
npm install
  1. Run the app either in development mode or normal mode:
# Normal mode
npm run start

# Development mode
npm run dev

Concept

The app is made based on the 4th use case of the list of available Use cases. The use case is described as follows:

Ik wil de scores of tijden van een sportwedstrijd kunnen bijhouden tijdens de wedstrijd en opslaan en doorsturen.

Translated:

I want to be able to keep track of scores or times of a sporting event during the event, save it and share it.

Wireflow

Based on the use case I've made a wireflow of the app (see below). It shows how the app should work, which elements are interactive and where the user will navigate to or what the user will see when a button or link has been pressed.

Wireflow showing 14 screens of the Setrack website

Layers

Functional

Reliable

Usable

Pleasurable

Features

Browser compatibility

Accessability

I've taking into account the contrast-ratio of the colors, to be most accessible for those who are colorblind, by using the color contrast checker tool from WebAIM and the built-in Accessability Inspector in Firefox. These tools help to meet the WCAG AAA standards for color contrast.

License

MIT

About

App to track sporting events yourself.

Topics

Resources

License

Stars

Watchers

Forks

Languages

  • HTML 41.2%
  • CSS 34.2%
  • JavaScript 24.6%