diff --git a/README.md b/README.md index 87b813a..bc737c8 100644 --- a/README.md +++ b/README.md @@ -1,43 +1,138 @@ -# Astro Starter Kit: Minimal +# radie-help + +Content-driven help site built with Astro and MDX. + +## Requirements + +- `node >= 22.12.0` +- `npm` + +## Basic Setup + +1. Install dependencies: ```sh -npm create astro@latest -- --template minimal +npm install ``` -> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun! +2. Start the local dev server: -## 🚀 Project Structure +```sh +npm run dev +``` -Inside of your Astro project, you'll see the following folders and files: +3. Open `http://localhost:4321`. + +## Available Commands + +| Command | What it does | +| --- | --- | +| `npm run dev` | Start the local Astro dev server | +| `npm run build` | Build the site for production | +| `npm run preview` | Preview the production build locally | + +## How Content Works + +- Each top-level folder inside `src/content/` is a content section. +- The current site includes one section: `src/content/website/`. +- Files in a section can be `.md` or `.mdx`. +- Each content file must include frontmatter with: + +```md +--- +title: Page Title +description: Short summary +--- +``` + +- `index.mdx` becomes the landing page for that section. + Example: `src/content/website/index.mdx` maps to `/website` +- Any other file becomes a subpage under that section. + Example: `src/content/website/registration.mdx` maps to `/website/registration` + +## Adding A New Content Subpage + +To add a new page inside an existing section: + +1. Create a new `.md` or `.mdx` file in the relevant folder under `src/content/`. +2. Add the required frontmatter: + +```md +--- +title: New Page +description: What this page covers +--- +``` + +3. Add the page body content. + +Example: ```text -/ -├── public/ -├── src/ -│ └── pages/ -│ └── index.astro -└── package.json +src/content/website/account-recovery.mdx ``` -Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. +This page will be available at: -There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. +```text +/website/account-recovery +``` -Any static assets, like images, can be placed in the `public/` directory. +## Adding A New Content Section -## 🧞 Commands +If you want a new group of subpages, create a new folder in `src/content/` and then register it in config. -All commands are run from the root of the project, from a terminal: +### 1. Create the folder and files -| Command | Action | -| :------------------------ | :----------------------------------------------- | -| `npm install` | Installs dependencies | -| `npm run dev` | Starts local dev server at `localhost:4321` | -| `npm run build` | Build your production site to `./dist/` | -| `npm run preview` | Preview your build locally, before deploying | -| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | -| `npm run astro -- --help` | Get help using the Astro CLI | +Example: -## 👀 Want to learn more? +```text +src/content/mobile-app/ +├── index.mdx +└── notifications.mdx +``` -Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat). +`index.mdx` should describe the section landing page. Any additional files become subpages for that section. + +### 2. Update `src/content.config.ts` + +Add a collection for the new folder and export it: + +```ts +const mobileApp = defineCollection({ + loader: glob({ base: "./src/content/mobile-app", pattern: "**/*.{md,mdx}" }), + schema: articleSchema, +}); + +export const collections = { + website, + mobileApp, +}; +``` + +### 3. Update `src/config/content.ts` + +Add the new collection name so routing and navigation include it: + +```ts +export const collectionNames = ["website", "mobileApp"] as const; +``` + +### 4. Run the site locally + +```sh +npm run dev +``` + +Verify that: + +- the new section appears on the home page +- the section index page loads +- the new subpages resolve under the expected URL path + +## Contributor Notes + +- Keep one topic per file. +- Use `index.mdx` only for a section landing page. +- Prefer lowercase, hyphenated filenames for clean URLs. +- If you create a new top-level content folder, update both `src/content.config.ts` and `src/config/content.ts`.