Why Astro?

Recreating my blog with Astro

• Write my posts in Markdown and not worry about how they end up on the site; I just want to write, upload to the cloud, and Astro's build should update the listing and generate the links accordingly;
• Have the site in two or more languages.

Starting the project

pnpm create astro@latest

Listing all posts

const blog = defineCollection({
  loader: glob({ base: "posts", pattern: "**/*.{md,mdx}" }),
});

export const collections = { blog };

```astro

if (!posts) return Astro.redirect("/404");

Blog

{posts.map((post) => (

<li>
  <a href={post.id}>{post.data.title}</a>
</li>

))}

Andddd that worked? That's too easy!

In Astro, any code executed inside the "fences" (`---`) runs only at build time. This means our application so far has a grand total of zero Javascript!
### Generating pages dynamically
After creating the post listing page, I wanted to create a page for each post. For this, I needed a dynamic route, meaning I would need Astro to generate the pages for me.

I would like to take this moment to say that Astro's documentation is very good! It would definitely be a lot more work to do this without it.

Anyway, I created a `[slug].astro` file. This file accepts any value as input, and I can use this value via code.
```astro
---
const { slug } = Astro.params;
---
<p>Slug: {slug}</p>

```astro

const { Content } = await render(post);

And in theory, it was supposed to work super well... But Astro cannot know all the possible routes for `[slug].astro`, which prevented it from keeping the site clean of Javascript. To circumvent this, we have to tell Astro all the possible routes. We do this by exporting a `getStaticPaths` function, which fortunately can be async, where we return a list with all the completed variables. We can also pass props to each page, which means we can pass all the posts directly!
```astro
---
import { getCollection, render } from "astro:content"; // we now fetch the whole collection!

export async function getStaticPaths() {
  const posts = await getCollection("blog");
  return posts.map((post) => ({
    params: { slug: post.id },
    props: { post }, // we can pass the post directly to the page!
  }));
}

const { post } = Astro.props; // and the post is guaranteed to exist!
const { Content } = await render(post);
---
<Content />

function createCollection(suffix: string) {
  return defineCollection({
    loader: glob({ base: `posts/${suffix}`, pattern: "**/*.{md,mdx}" });
  });
}

export const collections = {
  "blog-en": createCollection("en"),
  "blog-pt": createCollection("pt"),
};

const entries = {
  en: {
    "all-posts": "All posts",
  },
  pt: {
    "all-posts": "Todos os posts",
  },
};

export type Locales = keyof typeof entries;
export const locales = Object.keys(entries) as Locale[];
export const defaultLocale: Locale = "en" as const;

import { getCollection as getContentCollection } from "astro:content";

export function getCollection(locale: Locale = defaultLocale) {
	return getContentCollection(`blog-${locale}`);
}

src/
├── content.config.ts
├── i18n.ts
├── pages/
│   ├── [lang]/
│   │   ├── [slug].astro
│   │   └── index.astro
│   ├── [slug].astro
└── └── index.astro

What is Nix?

/nix/store/b6gvzjyb2pg0kjfwrjmg1vfhh54ad73z-firefox-33.1/

What is NixOS?

• hardware-configuration.nix: Auto-generated by the operating system. You will probably never have to touch here (at least I hope so!)
• configuration.nix: Where your system configuration actually lives. Here's where you tell nix what packages should be installed, what services or daemons should be running, what desktop environment it should use, etc.

# configuration.nix
{
    # ...
	environment.systemPackages = [pkgs.git];
}

nixos-rebuild switch

nixos-rebuild test

Should you migrate to NixOS?

Pros

Developers

Enthusiasts

Cons

Just want things to work fast

Are new to Linux

Conclusion

Clear Domain Modeling

enum DownloadStatus {
    Inactive,
    Processing { progress: u32 },
    Error(String)
    Done,
}

Extremely Powerful Switch Statements

let value = 5;
match value {
    0..=10 => println!("Number is between 0 and 10!"),
    11 | 13 | 17 | 19 => println!("Prime number!"),
    n if n % 2 == 0 => println!("Even number!"),
    n => println!("I don't know what to do with {n}"),
}

let status = DownloadStatus::Error("Failed to download".into());
if let DownloadStatus::Error(error) = status {
    eprintln!("Download error: {}", error);
}

Explicit Mutability

let x = 10;
x = x * 2; // Code fails here

let mut x = 10;
x = x * 2;

let mut myText = String::from("Hello, world");
printText(&myText);
changeText(&mut myText);

Macros!

Configuration in TOML

Not everything is sunshine and rainbows

Conclusion

How did I make this blog

What am I gonna do over here?