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 uoavcInstall dependencies:
corepack enable
pnpm installStart the development server:
pnpm devOpen http://localhost:3000 for the frontend and http://localhost:3000/admin for the Payload CMS admin panel.
Copy the example file:
cp .env.example .envAfter doing this you can edit each variable in the .env file with the appropriate values.
| Script | Description |
|---|---|
pnpm dev |
Start the development server |
pnpm build |
Build for production |
pnpm start |
Start the production server |
pnpm lint |
Run Biome linter |
pnpm lint:fix |
Auto-fix linting issues |
pnpm lint:fix:unsafe |
Auto-fix with unsafe fixes |
pnpm typegen |
Generate Payload CMS types |
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 issuesIf 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:
- Lint - Biome checks with error-on-warnings
- 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.
| Name | Role |
|---|---|
| Aleck Shen | Tech Lead |
| Ashlee Shum | Project Manager |
| Seolina Cho | Designer |
| William Huang | Developer |
| Ela Yildiz | Developer |
| Youdao Xing | Developer |
| Hajun Kim | Developer |
| Shimpei Yumiba | Developer |
| Jason Lim | Developer |
| Hayden Law | Developer |