43 lines
2.0 KiB
Markdown
43 lines
2.0 KiB
Markdown
# FictionArchive React Starter
|
|
|
|
A minimal React + Vite + Apollo Client scaffold ready to connect to the FictionArchive Fusion gateway. Point it at your own endpoint by changing `VITE_GRAPHQL_URI`.
|
|
|
|
## Getting started
|
|
|
|
```bash
|
|
cd fictionarchive-web
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
Then open the printed local URL. Update `.env` (create it if missing) with your endpoint:
|
|
|
|
```
|
|
VITE_GRAPHQL_URI=https://localhost:5001/graphql
|
|
VITE_OIDC_AUTHORITY=https://your-idp
|
|
VITE_OIDC_CLIENT_ID=fictionarchive-web
|
|
VITE_OIDC_REDIRECT_URI=http://localhost:5173
|
|
VITE_OIDC_POST_LOGOUT_REDIRECT_URI=http://localhost:5173
|
|
# Optional: token used only by codegen if your gateway requires auth
|
|
VITE_CODEGEN_TOKEN=your_api_token
|
|
```
|
|
|
|
## Scripts
|
|
|
|
- `npm run dev`: start Vite dev server.
|
|
- `npm run build`: type-check + production build.
|
|
- `npm run codegen`: generate typed hooks from `src/**/*.graphql` into `src/__generated__/graphql.ts`. **Run this manually after changing GraphQL operations or when the gateway schema changes.**
|
|
|
|
## Project notes
|
|
|
|
- `src/apolloClient.ts` configures the Apollo client with `InMemoryCache`, reads `VITE_GRAPHQL_URI`, and attaches an `Authorization: Bearer` header when an OIDC user is present.
|
|
- GraphQL code generation is configured via `codegen.ts` (loads `.env`/`.env.local` automatically); run `npm run codegen` to emit typed hooks to `src/__generated__/graphql.ts` (ignored by git) or rely on the `prebuild` hook.
|
|
- Routing is handled in `src/App.tsx` with `react-router-dom`; `/` renders the novels listing and `/novels/:id` is stubbed for future detail pages.
|
|
- Styles live primarily in `src/index.css` alongside the shared UI components.
|
|
|
|
## Codegen tips
|
|
|
|
- Default schema URL: `CODEGEN_SCHEMA_URL` (falls back to `VITE_GRAPHQL_URI`, then `https://localhost:5001/graphql`).
|
|
- Add `VITE_CODEGEN_TOKEN` (or `CODEGEN_TOKEN`) if your gateway requires a bearer token during introspection.
|
|
- Generated outputs land in `src/__generated__/graphql.ts` (committed to git). Run `npm run codegen` after schema/operation changes.
|