Kickoff

Where play starts faster.

Architecture

Getting Started

Ensure you have the following items installed on your machine:

• NodeJs.
  • Ensure you are running at least node version v22.21.1
• Docker Desktop
  • Scroll to the bottom of the page and select your OS, and follow the installation steps
• pnpm
  • This will be used as our primary package manager. Run the following command to install pnpm on your machine

    npm install -g pnpm

Running the Application (Docker)

Ensure you have the prerequisites installed.

Simply run:

docker-compose up -d postgres

This will start the postgres database only. The program can then be started with:

pnpm i

pnpm prisma db push

pnpm prisma db seed

pnpm gen

pnpm run dev

Ensure to copy over the required secrets into the .env

This will run the application in a docker container and should be accessible on localhost:3000.

Developing Locally

1. Ensure pnpm and docker is installed
2. Run the following commands

nvm use 20.20.0
# Create copy of the .env.example
cp .env.example .env

# Start Container
docker-compose up postgres -d

# Install dependencies
pnpm i

# Update db, schema, and codegen
pnpm prisma generate
pnpm prisma db push
pnpm prisma db seed
pnpm schema:gen
pnpm graphql-codegen

# Run the project
pnpm run dev

When creating a new branch ensure to follow the following naming convention:

name/feature/description
name/hotfix/description
name/patch/description
etc...

Common commands

1. Running pnpm prisma studio will open prisma studio. This will allow you to write/view the database while you are developing. This connects to the database connected in your .env
2. Running pnpm run dev will open the app in a dev server. If wanting to open the GraphiQL Yoga query viewer, you can access it through: http://localhost:3000/api/graphql.
3. If updating and needing types from the prisma schema, make sure to run:

pnpm gen

If you are getting errors, can be handy to just run pnpm gen to re-synchronize everything.

Using Stripe's Test Payment Cards

We connect to Stripe's API for this project. In order to save your payment method and simulate real-time payments, use the test cards provided in this Stripe documentation: https://docs.stripe.com/testing.

Stripe also provides an intuitive user interface (via Stripe Elements) when testing, that auto-populates payment information with one click. This autofill feature will show up when you are saving your payment method.