WATcloud website

The website for WATcloud.

Contributing

Important

The website is deployed via an internal monorepo (you may get a 404 if you are not a WATcloud team member), and the code is mirrored to a public repo. Pull requests from the public repo should be applied to the internal repo by a WATcloud team member.

Getting started

1. Clone the repo
2. Install dependencies:

   pip install -r requirements.txt
   npm install

3. Run the development server:

   # This line is optional if you are using the internal monorepo
   export FETCH_FIXTURES_FROM=http://cloud.watonomous.ca/fixtures
   npm run dev

Images

Images should be uploaded to WATcloud Assets, and the watcloud:// URI should be placed in ./scripts/generate-assets.js to be resolved during the build process.

During the build process, multiple versions (e.g. WebP, AVIF, etc.) of the image are generated and a TypeScript file is created in ./build/fixtures/images.ts. This file can be imported and used in the website:

import Picture from '@/components/picture'
import { ComputerDark } from '@/build/fixtures/images'

<Picture alt="Abstract Computer (Dark)" image={ComputerDark} />

The Picture component will tell the browser to automatically choose the best image format for the user's device.