# DRP 48

## Developing

### Prerequisites

- You must have Docker installed.
- You must have NodeJS installed (version doesn't matter too much, but ideally make sure it's not something insanely old like v16).
    - Also make sure you have `npm` installed (this usually, but not always, comes with nodejs).
- Use vscode for the smoothest experience, otherwise you'll need to configure your IDE manually.
    - VSCode will prompt you to "Install recommended extensions". Allow it to do so.

### Getting started

1. Install dependencies with `npm install`.
2. Start the local Supabase (Database + Authentication) with `npx supabase start`.
    - You must have Docker installed **and running**.
    - Visit the dashboard at http://127.0.0.1:54323
3. Copy `.env.example` into `.env`, and replace "`your-anon-key-here`" with the anon key from step 2.
4. Start a local development server with `npm run dev`.

### Useful commands

- `npm run dev` to run a local development server.
- `npm run build` to build a production server (output in `build/`).
- `npm run check` will type-check the codebase.
- `npm run lint` will style-check the codebase.
- `npm run format` will auto-format the codebase.
    - Note that if you're using VSCode with all the suggested extensions, VSCode should be formatting all your files on save.
- `npm run gen:types` will generate the types for the database.

### Database management

- `npx supabase start` wil start a local dev database
- `npx supabase stop` will stop the local dev database (data is persisted unless you do a reset).
- `npx supabase db push --local` will apply migrations to your local dev database. Useful if someone else has made new SQL migrations.
- `npx supabase db reset` will completely reset the local dev database.
- `npx supabase diff db -f <migration-name>` will generate a new migration file based on the current state of the database. This isn't 100% foolproof, so don't use it blindly.

### What's where?

- `supabase/` contains Supabase configurations and database schemas. See the READMEs in there fore more info.
- `static/` contains static files. This will probably only ever be favicon.
    - The favicon is the small icon you can see for the website in its browser tab.
- `e2e/` contains end-to-end tests. We'll start looking into these a little later.
- `.gitlab-ci.yml` contains CI scripts.
- `src/app.html` is the base template HTML file for ALL pages.
- `src/lib/` contains any code that isn't specific to some page.
- `src/routes/` contains page-specific code.

The reset are just config files that you shouldn't need to read/edit.