Skip to content

update-docs #471

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
+11 −25
Open

update-docs #471

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8998e6f
replace Vue with Astro, update components, rm unused links
spacjalex Sep 30, 2025
ebc53cd
rm outdated docs links
spacjalex Sep 30, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 11 additions & 25 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,7 @@ The Zero to Nix site is automatically published on [Vercel], which also provides

Zero to Nix's "stack" 🥞:

- [îles][iles] for content management and site generation
- [Vue] for templating
- [Astro] for content management, templating and site generation
- [MDX] for content
- [Tailwind] for CSS

Expand All @@ -84,25 +83,20 @@ The site uses a number of custom [MDX] components to spice up the usual Markdown

| Component | What it does |
| :----------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------- |
| [`Admonition`](./src/components/mdx/Admonition.vue) | An admonition block of type `danger`, `info`, `success`, or `warning`.<br /><br />Adding an `id` makes it a stateful callout dropdown. |
| [`Concept`](./src/components/mdx/concepts/Concept.vue) | Add a hoverable tool tip for a concept |
| [`Language`](./src/components/mdx/stateful/Language.vue) | Displays which (programming) language the user has selected |
| [`Languages`](./src/components/mdx/stateful/Languages.vue) | Provides a (programming) language selector |
| [`NixStorePath`](./src/components/concepts/NixStorePath.vue) | Provides a colorful visualization of Nix store path components |
| [`Shell`](./src/components/code/Shell.vue) | Provides language- and system-specific shell commands |
| [`SpecificLanguage`](./src/components/mdx/stateful/SpecificLanguage.vue) | Displays the enclosed content only if the user has selected a specific language |
| [`System`](./src/components/mdx/stateful/System.vue) | Displays the currently selected system (Linux vs. macOS) |
| [`Systems`](./src/components/stateful/Systems.vue) | Provides a system selector (Linux vs. macOS) |
| [`Admonition`](./src/components/mdx/Admonition.astro) | An admonition block of type `danger`, `info`, `success`, or `warning`.<br /><br />Adding an `id` makes it a stateful callout dropdown. |
| [`Language`](./src/components/mdx/Language.astro) | Displays which (programming) language the user has selected |
| [`Languages`](./src/components/mdx/Languages.astro) | Provides a (programming) language selector |
| [`NixStorePath`](./src/components/mdx/NixStorePath.astro) | Provides a colorful visualization of Nix store path components |
| [`SpecificLanguage`](./src/components/mdx/SpecificLanguage.astro) | Displays the enclosed content only if the user has selected a specific language |

## Directory structure

| Directory | What it contains |
| :------------------------------------ | :----------------------------------------------------------------------------- |
| [`src/assets`](./src/assets/) | Assets to be processed (only CSS for now) |
| [`src/components`](./src/components/) | [Vue] components used throughout the site |
| [`src/layouts`](./src/layouts/) | [Vue] layouts for specific page types |
| [`src/logic`](./src/logic/) | TypeScript helper stuff for state and content management |
| [`src/pages`](./src/pages/) | The content of the site (all [MDX]) plus some Vue templates for specific pages |
| [`src/components`](./src/components/) | [Astro] components used throughout the site |
| [`src/layouts`](./src/layouts/) | [Astro] layouts for specific page types |
| [`src/pages`](./src/pages/) | The content of the site (all [MDX]) plus some Astro templates for specific pages |
| [`public`](./public/) | Assets that won't be processed (favicon, etc.) |

## Page metadata
Expand All @@ -124,17 +118,13 @@ For [concept pages](./src/pages/concepts/):

There are a few other important files you should be aware of when working on the site:

- [`src/app.ts`](./src/app.ts) defines global page metadata
- [`src/site.ts`](./src/site.ts) defines site-level values, like the title, description, navbar links, and more.
- [`src/logic/content.ts`](./src/logic/content.ts) provides the content management logic for the site (type-safe page frontmatter, functions to fetch and sort documents, and more)
- [`src/logic/state.ts`](./src/logic/state.ts) defines all stateful logic using the [nanostores] library
- [`src/logic/theme.ts`](./src/logic/theme.ts) provides logic for the light/dark theme switcher
- [`src/content/`](./src/content/) provides the content management logic for the site (type-safe page frontmatter, functions to fetch and sort documents, and more)

## Suggested VS Code settings

If you happen to use VS Code as your editor, we recommend adding these extensions:

- [`Vue.volar`][vsc-vue]
- [`unifiedjs.vscode-mdx`][vsc-mdx]
- [`bradlc.vscode-tailwindcss`][vsc-tailwind]
- [`esbenp.prettier-vscode`][vsc-prettier]
Expand Down Expand Up @@ -166,14 +156,12 @@ We also recommend adding these settings to your local `.vscode/settings.json`:
}
```

[astro]: https://astro.build
[ci]: ./.github/workflows/test.yml
[client-load]: https://iles.pages.dev/guide/hydration#clientload
[detsys]: https://determinate.systems
[direnv]: https://direnv.net
[flakes]: https://zero-to-nix.com/concepts/flakes
[gha]: https://github.com/features/actions
[hydration]: https://iles.pages.dev/guide/hydration#hydration-directives
[iles]: https://github.com/elMassimo/iles
[mdx]: https://mdxjs.com
[nanostores]: https://github.com/nanostores/nanostores
[nix]: https://nixos.org
Expand All @@ -184,5 +172,3 @@ We also recommend adding these settings to your local `.vscode/settings.json`:
[vsc-prettier]: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
[vsc-tailwind]: https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss
[vsc-tsc]: https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next
[vsc-vue]: https://marketplace.visualstudio.com/items?itemName=Vue.volar
[vue]: https://vuejs.org
Loading