UOA Volleyball Club Website

A centralized website for the University of Auckland Volleyball Club (UOAVC). The platform will handle event and social session sign-ups, member accounts, waitlists, and an admin dashboard for club executives to manage events and registrations.

• Node.js 22+
• pnpm
• MongoDB running locally (or a remote connection URI)

Clone the repository:

git clone https://github.com/UoaWDCC/uoavc.git
cd uoavc

Install dependencies:

corepack enable
pnpm install

Start the development server:

pnpm dev

Open http://localhost:3000 for the frontend and http://localhost:3000/admin for the Payload CMS admin panel.

Copy the example file:

cp .env.example .env

Then fill in each variable in .env:

We use Biome for linting and formatting. Lefthook is set up to run pre-commit hooks that automatically check your code before committing. CI will also run Biome checks to ensure code quality.

To manually run Biome:

pnpm lint          # Check linting
pnpm lint:fix      # Auto-fix issues

If you are using VSCode, extensions will be recommended to you (namely Biome's extension). You can open the extensions sidebar and install the recommended extensions. VSCode files have already been set up as part of the repository and will assist with Biome formatting.

Otherwise, you are responsible for figuring out how to configure those plugins for yourself. We encourage you to contribute any configuration files back to the repository to help others.

src/
├── app/
│   ├── (frontend)/              # Public website pages
│   │   ├── layout.tsx           # Main layout
│   │   └── page.tsx             # Homepage
│   ├── (payload)/               # Payload CMS admin
│   │   ├── admin/               # Admin panel
│   │   ├── api/                 # API routes
│   │   └── layout.tsx           # Admin layout
├── components/                  # Reusable components
├── lib/                         # Utility functions and helpers
├── payload/
│   ├── collections/             # Payload collections
│   └── payload-types.ts         # Generated types
├── payload.config.ts            # Payload CMS configuration
└── ...

public/                          # Static assets

package.json                     # Project metadata and scripts
next.config.mjs                  # Next.js configuration
tsconfig.json                    # TypeScript configuration
biome.json                       # Biome linter configuration
lefthook.yml                     # Git hooks configuration

• Next.js - Powers the frontend using the App Router architecture. You will need some understanding of React to work on this project.
• Payload CMS - Our headless CMS that manages content and defines our data structure. Familiarise yourself with Payload's local API.
• Tailwind CSS - Utility-first CSS framework for styling.
• MongoDB - Our database, accessed through Payload's MongoDB adapter.
• Biome - Fast formatter and linter.
• Lefthook - Git hooks manager.

The app is deployed on Fly.io via Docker.

• Region: Sydney (syd)
• Runtime: Node.js 22, standalone Next.js output
• Trigger: Automatic on push to main, or manual via workflow dispatch

GitHub Actions runs on every push to main and on pull requests:

1. Lint - Biome checks with error-on-warnings
2. Build - Full Next.js production build

Deployment to Fly.io triggers automatically after a successful push to main.

To contribute to this project please refer to the CONTRIBUTING.md guidelines.