Compare commits
3 commits
d162989760
...
f2cda4bd1c
| Author | SHA1 | Date | |
|---|---|---|---|
| f2cda4bd1c | |||
| d710d6a448 | |||
| 2264e6487d |
4 changed files with 2 additions and 11 deletions
|
|
@ -4,15 +4,6 @@ description: ""
|
||||||
pubDate: "18 Feb 2026 21:07"
|
pubDate: "18 Feb 2026 21:07"
|
||||||
---
|
---
|
||||||
|
|
||||||
<!--
|
|
||||||
- what i learned about it
|
|
||||||
- astro components (similar to react components?)
|
|
||||||
- interactive components are difficult
|
|
||||||
- static dynamic routes (dynamically generated at build time, but static on the website)
|
|
||||||
- content collections
|
|
||||||
- mdx
|
|
||||||
-->
|
|
||||||
|
|
||||||
# What is Astro?
|
# What is Astro?
|
||||||
Astro is a static site generator that allows you to combine components together to quickly put together a website. It's somewhat similar to something like React, but instead of having the bloat of all the javascript it generates, Astro outputs a static HTML website. The only javascript it includes is what you write in `<script>` tags. It has bindings for those web frameworks, so you can use React components in your website alongside the astro ones. It will also still generate a static site that doesn't require any javascript other than what you put there yourself.
|
Astro is a static site generator that allows you to combine components together to quickly put together a website. It's somewhat similar to something like React, but instead of having the bloat of all the javascript it generates, Astro outputs a static HTML website. The only javascript it includes is what you write in `<script>` tags. It has bindings for those web frameworks, so you can use React components in your website alongside the astro ones. It will also still generate a static site that doesn't require any javascript other than what you put there yourself.
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -23,7 +23,7 @@ const hasPosts = (await getCollection("blog")).length > 0;
|
||||||
<Panel>
|
<Panel>
|
||||||
<span style="display: flex; flex-direction: row; justify-content: space-between; width: 200px;">
|
<span style="display: flex; flex-direction: row; justify-content: space-between; width: 200px;">
|
||||||
<a href="/">Home</a>
|
<a href="/">Home</a>
|
||||||
<a href="/blog">Blog</a>
|
<a href="/blog/">Blog</a>
|
||||||
</span>
|
</span>
|
||||||
</Panel>
|
</Panel>
|
||||||
)
|
)
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@ import { getCollection } from "astro:content";
|
||||||
import Main from "../../layouts/MainLayout.astro";
|
import Main from "../../layouts/MainLayout.astro";
|
||||||
import TransFlagPanel from "../../layouts/TransFlagPanel.astro";
|
import TransFlagPanel from "../../layouts/TransFlagPanel.astro";
|
||||||
import Panel from "../../layouts/Panel.astro";
|
import Panel from "../../layouts/Panel.astro";
|
||||||
import "./index.scss";
|
import "../../styles/blogIndex.scss";
|
||||||
|
|
||||||
const latestPosts = (await getCollection("blog")).sort(
|
const latestPosts = (await getCollection("blog")).sort(
|
||||||
(a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf(),
|
(a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf(),
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue