Zero to Nix

Zero to Nix is your guide to learning Nix and flakes. It was created and is maintained by Determinate Systems.

Setup

Make sure that you have Nix and direnv installed, then:

# Activate Nix development environment
direnv allow

Developing the site

Run locally

To run the site in development mode (with live reload when you make changes):

dev

To run the site in preview mode (with a static web server and no live reload):

preview

# Alternatively
nix run

Then open your browser to http://localhost:3000.

Run checks locally

The site has some CI checks that run in GitHub Actions, like link checking. To run the whole CI suite locally:

ci

Build locally

To ensure that the site can build properly in response to changes:

build

As an alternative, you can run the whole CI suite, which also builds the site.

Format code

To ensure that everything is properly formatted:

format

Publishing

The Zero to Nix site is automatically published on Vercel, which also provides deploy previews for pull requests.

Technologies

Zero to Nix's "stack" 🥞:

• Astro for content management and site generation
• MDX for content
• Tailwind for CSS

Suggested VS Code settings

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

• astro-build.astro-vscode
• unifiedjs.vscode-mdx
• bradlc.vscode-tailwindcss
• esbenp.prettier-vscode
• vscode.vscode-typescript-next

We also recommend adding these settings to your local .vscode/settings.json:

{
  "[mdx]": {
    // By default, this extension overwrites our one-sentence-per-line policy
    "editor.formatOnSave": false,
    // This is a nice helper for longer sentences
    "editor.wordWrapColumn": 100,
    "editor.wordWrap": "wordWrapColumn",
  },
  // Format everything using the Prettier config
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  // Keep junk out of your search results
  "search.exclude": {
    "**/.direnv": true,
    "**/.git": true,
    "**/node_modules": true,
    "dist": true,
    "package-lock.json": true,
    "*.d.ts": true,
    "tmp": true,
  },
}