This repo contains the source code for the main website of the 📈 UNSW Quantitative Finance and Trading Society (QuantSoc), live at quantsoc.org.
It is a single-page React app built with Vite. Articles and job listings are read from a Firebase Firestore database; everything else is static.
Deploying: Read DEPLOYMENT.md first. The live site is built from the dev branch.
You need Node.js 20 or newer (the dev container uses Node 20) and npm.
npm ci # install the exact dependency versions from package-lock.json
npm run prepare # install the git hooks (husky) - only needed once per clone
npm run start # start the dev server at http://localhost:5173The dev server reloads automatically when you save a file. Nothing you do locally affects the live website.
Note: the site reads articles and job listings from the real Firestore database, even locally. The site only ever reads data, so this is safe, but anything you see in those sections is live data.
| Command | What it does |
|---|---|
npm run start |
Dev server at http://localhost:5173 |
npm run build |
Production build into dist/ |
npm run preview |
Serves the dist/ build at http://localhost:4173 - use this to check a build locally |
npm run lint |
Runs ESLint |
npm run prepare |
Installs the husky git hooks |
There is currently no automated test suite (there is no npm run test). Testing is done by building and checking the site by hand - see DEPLOYMENT.md.
src/
├── App.jsx # Routes: /, /articles, /resources, /contact, /mathsprint
├── firebase.config.js # Firebase/Firestore client setup (see below)
├── assets/ # Images; sponsor logos live in assets/sponsor-logos/
├── components/ # Components shared by more than one page (NavBar, Footer, ...)
├── routes/ # One folder per page. Components used by only one page live in that page's folder
├── hooks/
└── styles/ # Global .less styles and colour constants (styles/constants.less)
legacy/ # Old Python backend - not used by the current site
Import aliases (components/..., routes/..., assets/..., styles/..., hooks/...) are defined in vite.config.js.
Sponsors are hard-coded in src/routes/LandingPage/SponsorshipSection/SponsorshipSection.jsx.
- Put the logo in
src/assets/sponsor-logos/. Prefer an SVG, otherwise a PNG with a transparent background. The site has a white background, so use a dark/coloured version of the logo, not a white one. - Import the logo at the top of
SponsorshipSection.jsx. - Add a
<Sponsor logoSrc={...} sponsorLink="https://..." />line under the right tier (principalormajor). Logos appear in the order they are listed. - Run
npm run startand check the Sponsors section on both desktop and a narrow (mobile) window.
Workshop slides and code are published in the QuantSoc/workshop-materials repo.
The executives shown on /team are listed in src/routes/TeamPage/executives.js, newest year first. The first year in the list is shown as the current executive. For a new year, copy a year's block to the top of the list and fill in the names, roles and (optional) LinkedIn links.
The /constitution page is generated from src/routes/ConstitutionPage/constitution.txt. It can be updated directly from constitution.txt, or you can open it up on Google Docs, choose File -> Download -> Plain text (.txt), and insert the new file instead of the old constitution.text.
All the Job Listings are stored in the Firebase Firestore database. Simply log into Firebase Hosting using quantsoc email OAuth, and then end it manually from there.
src/firebase.config.js connects the site to the quantsoc-website-admin Firebase project. It is only used to read the articles and jobs Firestore collections. The site is not hosted on Firebase (see DEPLOYMENT.md).
The API key in that file is a public client identifier, not a secret (every visitor's browser downloads it). What actually protects the data is the project's Firestore security rules, which are managed in the Firebase console. They should allow public reads of articles and jobs only, and no public writes.