Blogs/micro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

sync: update content from obsidian vault

Browse source
This commit is contained in:
Obsidian Sync 2026-02-20 05:42:47 +05:30
parent 84749c8d9b
commit b82752c120
12 changed files with 233 additions and 208 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/content/blog/00-micro-changelog/index.mdx
View file

@ -1,9 +1,10 @@
--- ---
title: "Everything new in Astro Micro" title: Everything new in Astro Micro
description: "Features, enhancements, and changes." description: Features, enhancements, and changes.
date: "2024-05-09" date: '2024-05-09'
--- ---
import Callout from "@/components/Callout.astro"; import Callout from "@/components/Callout.astro";
--- ---
@ -17,7 +18,7 @@ Press <kbd>/</kbd> or <kbd>CTRL</kbd> + <kbd>K</kbd> to open the search dialog.
### Build and develop ### Build and develop
<Callout type="error"> <Callout type="error">
The site **must** be built at least once so Pagefind can index the content. The site **must** be built at least once so Pagefind can index the content.
</Callout> </Callout>
```bash ```bash
@ -38,23 +39,23 @@ When developing you can continue to use `npm run dev` and Pagefind will use the
## Callout component 🆕 ## Callout component 🆕
<Callout> <Callout>
Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation
labore consequat ullamco nostrud non. labore consequat ullamco nostrud non.
</Callout> </Callout>
<Callout type="info"> <Callout type="info">
Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation
labore consequat ullamco nostrud non. labore consequat ullamco nostrud non.
</Callout> </Callout>
<Callout type="warning"> <Callout type="warning">
Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation
labore consequat ullamco nostrud non. labore consequat ullamco nostrud non.
</Callout> </Callout>
<Callout type="error"> <Callout type="error">
Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation Adipisicing et officia reprehenderit fugiat occaecat cupidatat exercitation
labore consequat ullamco nostrud non. labore consequat ullamco nostrud non.
</Callout> </Callout>
--- ---
@ -79,7 +80,7 @@ When developing you can continue to use `npm run dev` and Pagefind will use the
- Change formatted date to use "long" option for month - Change formatted date to use "long" option for month
- Minor spacing changes throughout - Minor spacing changes throughout
- Remove "work" collection and components - Remove "work" collection and components
- If desired, you can get the code from [Astro Nano](https://github.com/markhorn-dev/astro-nano) - If desired, you can get the code from [Astro Nano](https://github.com/markhorn-dev/astro-nano)
- Slightly increased link decoration offset - Slightly increased link decoration offset
- Slightly sped-up animations - Slightly sped-up animations
- Reversed animation - Reversed animation
@ -110,3 +111,4 @@ No active issues!
- Fixed by [anaxite](https://github.com/anaxite): [Update Astro to 5.0](https://github.com/trevortylerlee/astro-micro/issues/73) - Fixed by [anaxite](https://github.com/anaxite): [Update Astro to 5.0](https://github.com/trevortylerlee/astro-micro/issues/73)
- Fixed by [MoyaF](https://github.com/MoyaF): [Table of Contents links not working](https://github.com/trevortylerlee/astro-micro/issues/75) - Fixed by [MoyaF](https://github.com/MoyaF): [Table of Contents links not working](https://github.com/trevortylerlee/astro-micro/issues/75)
- Fixed by [antoniovalentini](https://github.com/antoniovalentini): [Possible bugs due to outdated Astro version 5.0.3](https://github.com/trevortylerlee/astro-micro/issues/78) - Fixed by [antoniovalentini](https://github.com/antoniovalentini): [Possible bugs due to outdated Astro version 5.0.3](https://github.com/trevortylerlee/astro-micro/issues/78)

143
src/content/blog/01-getting-started/index.md
View file

@ -1,7 +1,7 @@
--- ---
title: "Getting started" title: Getting started
description: "Hit the ground running." description: Hit the ground running.
date: "2024-03-22" date: '2024-03-22'
tags: tags:
- tutorial - tutorial
--- ---
@ -40,21 +40,21 @@ To change the website metadata, edit `src/consts.ts`.
// src/consts.ts // src/consts.ts
export const SITE: Site = { export const SITE: Site = {
NAME: "Astro Micro", NAME: "Astro Micro",
DESCRIPTION: "Astro Micro is an accessible theme for Astro.", DESCRIPTION: "Astro Micro is an accessible theme for Astro.",
EMAIL: "trevortylerlee@gmail.com", EMAIL: "trevortylerlee@gmail.com",
NUM_POSTS_ON_HOMEPAGE: 3, NUM_POSTS_ON_HOMEPAGE: 3,
NUM_PROJECTS_ON_HOMEPAGE: 3, NUM_PROJECTS_ON_HOMEPAGE: 3,
}; };
``` ```
| Field | Req | Description | | Field | Req | Description |
| :----------- | :-- | :--------------------------------------------------- | | :----------- | :-- | :--------------------------------------------------- |
| TITLE | Yes | Displayed in header and footer. Used in SEO and RSS. | | TITLE | Yes | Displayed in header and footer. Used in SEO and RSS. |
| DESCRIPTION | Yes | Used in SEO and RSS. | | DESCRIPTION | Yes | Used in SEO and RSS. |
| EMAIL | Yes | Displayed in contact section. | | EMAIL | Yes | Displayed in contact section. |
| NUM_POSTS | Yes | Limit number of posts on home page. | | NUM_POSTS | Yes | Limit number of posts on home page. |
| NUM_PROJECTS | Yes | Limit number of projects on home page. | | NUM_PROJECTS | Yes | Limit number of projects on home page. |
--- ---
@ -64,15 +64,15 @@ export const SITE: Site = {
// src/consts.ts // src/consts.ts
export const ABOUT: Metadata = { export const ABOUT: Metadata = {
TITLE: "About", TITLE: "About",
DESCRIPTION: "Astro Micro is a fork of Astro Nano.", DESCRIPTION: "Astro Micro is a fork of Astro Nano.",
}; };
``` ```
| Field | Req | Description | | Field | Req | Description |
| :---------- | :-- | :--------------------------------------------- | | :---------- | :-- | :--------------------------------------------- |
| TITLE | Yes | Displayed in browser tab. Used in SEO and RSS. | | TITLE | Yes | Displayed in browser tab. Used in SEO and RSS. |
| DESCRIPTION | Yes | Used in SEO and RSS. | | DESCRIPTION | Yes | Used in SEO and RSS. |
--- ---
@ -82,37 +82,37 @@ export const ABOUT: Metadata = {
// src/consts.ts // src/consts.ts
export const SOCIALS: Socials = [ export const SOCIALS: Socials = [
{ {
NAME: "twitter-x", NAME: "twitter-x",
HREF: "https://twitter.com/boogerbuttcheeks", HREF: "https://twitter.com/boogerbuttcheeks",
}, },
{ {
NAME: "github", NAME: "github",
HREF: "https://github.com/trevortylerlee", HREF: "https://github.com/trevortylerlee",
}, },
{ {
NAME: "linkedin", NAME: "linkedin",
HREF: "https://www.linkedin.com/in/trevortylerlee", HREF: "https://www.linkedin.com/in/trevortylerlee",
}, },
]; ];
``` ```
| Field | Req | Description | | Field | Req | Description |
| :---- | :-- | :-------------------------------------- | | :---- | :-- | :-------------------------------------- |
| NAME | Yes | Displayed in contact section as a link. | | NAME | Yes | Displayed in contact section as a link. |
| HREF | Yes | External url to social media profile. | | HREF | Yes | External url to social media profile. |
## Deploy the site ## Deploy the site
To set up RSS and Giscus, it's easier if the site is deployed and has a URL for you to use. Instantly deploy to Vercel or Netlify by clicking the buttons below. To set up RSS and Giscus, it's easier if the site is deployed and has a URL for you to use. Instantly deploy to Vercel or Netlify by clicking the buttons below.
<div class="flex gap-2"> <div class="flex gap-2">
<a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/trevortylerlee/astro-micro"> <a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/trevortylerlee/astro-micro">
<img src="/deploy_vercel.svg" /> <img src="/deploy_vercel.svg" />
</a> </a>
<a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/trevortylerlee/astro-micro"> <a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/trevortylerlee/astro-micro">
<img src="/deploy_netlify.svg" /> <img src="/deploy_netlify.svg" />
</a> </a>
</div> </div>
To deploy manually see [Astro's docs](https://docs.astro.build/en/guides/deploy/). To deploy manually see [Astro's docs](https://docs.astro.build/en/guides/deploy/).
@ -125,13 +125,13 @@ Change the `site` option to the deployed site's URL.
// astro.config.mjs // astro.config.mjs
export default defineConfig({ export default defineConfig({
site: "https://astro-micro.vercel.app", site: "https://astro-micro.vercel.app",
integrations: [tailwind(), sitemap(), mdx(), pagefind()], integrations: [tailwind(), sitemap(), mdx(), pagefind()],
markdown: { markdown: {
shikiConfig: { shikiConfig: {
theme: "css-variables", theme: "css-variables",
}, },
}, },
}); });
``` ```
@ -143,22 +143,22 @@ Follow the steps at [giscus.app](https://giscus.app). Once you get your custom G
// src/components/Giscus.astro // src/components/Giscus.astro
<script <script
is:inline is:inline
src="https://giscus.app/client.js" src="https://giscus.app/client.js"
data-repo="trevortylerlee/astro-micro" data-repo="trevortylerlee/astro-micro"
data-repo-id="R_kgDOL_6l9Q" data-repo-id="R_kgDOL_6l9Q"
data-category="Announcements" data-category="Announcements"
data-category-id="DIC_kwDOL_6l9c4Cfk55" data-category-id="DIC_kwDOL_6l9c4Cfk55"
data-mapping="pathname" data-mapping="pathname"
data-strict="0" data-strict="0"
data-reactions-enabled="1" data-reactions-enabled="1"
data-emit-metadata="0" data-emit-metadata="0"
data-input-position="top" data-input-position="top"
data-theme="preferred_color_scheme" data-theme="preferred_color_scheme"
data-lang="en" data-lang="en"
data-loading="lazy" data-loading="lazy"
crossorigin="anonymous" crossorigin="anonymous"
async async
></script> ></script>
``` ```
@ -168,15 +168,16 @@ To change the Giscus themes used, edit the `setGiscusTheme` function in `Head.as
// src/components/Head.astro // src/components/Head.astro
const setGiscusTheme = () => { const setGiscusTheme = () => {
const giscus = document.querySelector(".giscus-frame"); const giscus = document.querySelector(".giscus-frame");
const isDark = document.documentElement.classList.contains("dark"); const isDark = document.documentElement.classList.contains("dark");
if (giscus) { if (giscus) {
const url = new URL(giscus.src); const url = new URL(giscus.src);
// Change "dark" and "light" to other Giscus themes // Change "dark" and "light" to other Giscus themes
url.searchParams.set("theme", isDark ? "dark" : "light"); url.searchParams.set("theme", isDark ? "dark" : "light");
giscus.src = url.toString(); giscus.src = url.toString();
} }
}; };
``` ```

28
src/content/blog/02-blog-collection/index.md
View file

@ -1,11 +1,12 @@
--- ---
title: "Blog Collection" title: Blog Collection
description: "How to add posts to the blog." description: How to add posts to the blog.
date: "2024-03-21" date: '2024-03-21'
tags: tags:
- tutorial - tutorial
--- ---
--- ---
## Working with the `blog` collection: ## Working with the `blog` collection:
@ -15,9 +16,9 @@ The `blog` collection is found in `src/content/blog`.
``` ```
📁 /src/content/blog 📁 /src/content/blog
└── 📁 post-1 └── 📁 post-1
└── 📄 index.md └── 📄 index.md
└── 📁 post-2 └── 📁 post-2
└── 📄 index.mdx └── 📄 index.mdx
``` ```
In the above example, two blog posts will be generated with the folder name representing the id. In the above example, two blog posts will be generated with the folder name representing the id.
@ -38,17 +39,17 @@ description: "How to add posts to the blog.";
date: "2024-03-21"; date: "2024-03-21";
draft: false; draft: false;
tags: tags:
- tutorial - tutorial
--- ---
``` ```
| Field | Req | Type | Remarks | | Field | Req | Type | Remarks |
| :---------- | :-- | :------ | :----------------------------------------------- | | :---------- | :-- | :------ | :----------------------------------------------- |
| title | Yes | string | Title of the content. Used in SEO and RSS. | | title | Yes | string | Title of the content. Used in SEO and RSS. |
| description | Yes | string | Description of the content. Used in SEO and RSS. | | description | Yes | string | Description of the content. Used in SEO and RSS. |
| date | Yes | string | Must be a valid date string (able to be parsed). | | date | Yes | string | Must be a valid date string (able to be parsed). |
| draft | No | boolean | If draft: true, content will not be published. | | draft | No | boolean | If draft: true, content will not be published. |
| tags | No | string array | Tags to organize content | | tags | No | string array | Tags to organize content |
--- ---
@ -61,9 +62,10 @@ description: "How to add posts to the blog.";
date: "2024-03-21"; date: "2024-03-21";
draft: false; draft: false;
tags: tags:
- tutorial - tutorial
--- ---
## Working with the blog collection ## Working with the blog collection
<!-- content --> <!-- content -->
``` ```

26
src/content/blog/03-projects-collection/index.md
View file

@ -1,11 +1,12 @@
--- ---
title: "Projects Collection" title: Projects Collection
description: "How to add projects to your portfolio." description: How to add projects to your portfolio.
date: "2024-03-20" date: '2024-03-20'
tags: tags:
- tutorial - tutorial
--- ---
--- ---
## Working with the `projects` collection ## Working with the `projects` collection
@ -15,9 +16,9 @@ The `projects` collections is found in `src/content/projects`.
``` ```
📁 /src/content/projects 📁 /src/content/projects
└── 📁 project-1 └── 📁 project-1
└── 📄 index.md └── 📄 index.md
└── 📁 project-2 └── 📁 project-2
└── 📄 index.mdx └── 📄 index.mdx
``` ```
In the above example, two project posts will be generated with the folder name representing the id. In the above example, two project posts will be generated with the folder name representing the id.
@ -38,14 +39,14 @@ draft: false;
--- ---
``` ```
| Field | Req | Type | Remarks | | Field | Req | Type | Remarks |
| :---------- | :-- | :------ | :----------------------------------------------- | | :---------- | :-- | :------ | :----------------------------------------------- |
| title | Yes | string | Title of the content. Used in SEO and RSS. | | title | Yes | string | Title of the content. Used in SEO and RSS. |
| description | Yes | string | Description of the content. Used in SEO and RSS. | | description | Yes | string | Description of the content. Used in SEO and RSS. |
| date | Yes | string | Must be a valid date string (able to be parsed). | | date | Yes | string | Must be a valid date string (able to be parsed). |
| draft | No | boolean | If draft: true, content will not be published. | | draft | No | boolean | If draft: true, content will not be published. |
| demoURL | No | string | Link to live project demo, if available. | | demoURL | No | string | Link to live project demo, if available. |
| repoURL | No | string | Link to project repo, if available. | | repoURL | No | string | Link to project repo, if available. |
--- ---
@ -62,3 +63,4 @@ draft: false;
## Astro Micro 🔬 ## Astro Micro 🔬
<!-- content --> <!-- content -->
``` ```

52
src/content/blog/04-markdown-syntax/index.mdx
View file

@ -1,11 +1,12 @@
--- ---
title: "Markdown syntax guide" title: Markdown syntax guide
description: "Get started writing content in Markdown." description: Get started writing content in Markdown.
date: "2024-03-17" date: '2024-03-17'
tag: tag:
- reference - reference
--- ---
import Callout from "@/components/Callout.astro"; import Callout from "@/components/Callout.astro";
--- ---
@ -15,8 +16,8 @@ import Callout from "@/components/Callout.astro";
To create headings, use hash symbols (#) followed by a space. The number of hash symbols indicates the heading level. To create headings, use hash symbols (#) followed by a space. The number of hash symbols indicates the heading level.
<Callout> <Callout>
Use `h2` tags instead of `h1` tags in the post. Too many `h1` tags on a single Use `h2` tags instead of `h1` tags in the post. Too many `h1` tags on a single
page can impact SEO. The post title serves as the `h1`. page can impact SEO. The post title serves as the `h1`.
</Callout> </Callout>
```md ```md
@ -146,15 +147,15 @@ To create an ordered list, add line items with numbers followed by periods. Use
```md ```md
1. Item 1 1. Item 1
2. Item 2 2. Item 2
1. Sub item 1 1. Sub item 1
2. Sub item 2 2. Sub item 2
3. Item 3 3. Item 3
``` ```
1. Item 1 1. Item 1
2. Item 2 2. Item 2
1. Sub item 1 1. Sub item 1
2. Sub item 2 2. Sub item 2
3. Item 3 3. Item 3
--- ---
@ -166,15 +167,15 @@ To create an unordered list, add a hyphen \(\-\), an asterisk \(\*\), or a plus
```md ```md
- Item 1 - Item 1
- Item 2 - Item 2
- Sub item 1 - Sub item 1
- Sub item 2 - Sub item 2
- Item 3 - Item 3
``` ```
- Item 1 - Item 1
- Item 2 - Item 2
- Sub item 1 - Sub item 1
- Sub item 2 - Sub item 2
- Item 3 - Item 3
--- ---
@ -328,18 +329,18 @@ Combine a list with square brackets ([]) representing a checkbox. Typing `x` ins
Use three or more hyphens (-) for the column headers and use pipes (|) to separate each column. You can align text in the columns to the left, right, or center by adding a colon (:) to the left, right, or on both side of the hyphens. Use three or more hyphens (-) for the column headers and use pipes (|) to separate each column. You can align text in the columns to the left, right, or center by adding a colon (:) to the left, right, or on both side of the hyphens.
```md ```md
| Item | Count | | Item | Count |
| :----- | ----: | | :----- | ----: |
| X-Wing | 1 | | X-Wing | 1 |
| Y-Wing | 2 | | Y-Wing | 2 |
| A-Wing | 3 | | A-Wing | 3 |
``` ```
| Item | Count | | Item | Count |
| :----- | ----: | | :----- | ----: |
| X-Wing | 1 | | X-Wing | 1 |
| Y-Wing | 2 | | Y-Wing | 2 |
| A-Wing | 3 | | A-Wing | 3 |
--- ---
@ -379,15 +380,15 @@ Denote a code block by wrapping a section of valid code in triple backticks (`).
```` ````
```js ```js
function hello() { function hello() {
console.log("hello world"); console.log("hello world");
} }
``` ```
```` ````
```js ```js
function hello() { function hello() {
console.log("hello world"); console.log("hello world");
} }
``` ```
@ -398,3 +399,4 @@ function hello() {
Refer to [markdownguide.org](https://www.markdownguide.org/) for best practices as well as extended syntax. Refer to [markdownguide.org](https://www.markdownguide.org/) for best practices as well as extended syntax.
--- ---

24
src/content/blog/05-mdx-syntax/index.mdx
View file

@ -1,11 +1,14 @@
--- ---
title: "MDX syntax guide" title: MDX syntax guide
description: "Use interactive components in Markdown." description: Use interactive components in Markdown.
date: "2024-03-16" date: '2024-03-16'
tags: tags:
- reference - reference
- client-directives
- markdown-and-mdx-pages
--- ---
import Callout from "@/components/Callout.astro"; import Callout from "@/components/Callout.astro";
--- ---
@ -22,12 +25,12 @@ Importing a component from the `/components` directory.
This component accepts a Javascript date object and format it as a string. This component accepts a Javascript date object and format it as a string.
```astro ```astro
import DateComp from "../../../components/FormattedDate.astro"; import DateComp from "@/components/FormattedDate.astro";
<DateComp date={new Date()} /> <DateComp date={new Date()} />
``` ```
import FormattedDate from "../../../components/FormattedDate.astro"; import FormattedDate from "@/components/FormattedDate.astro";
<FormattedDate date={new Date()} /> <FormattedDate date={new Date()} />
@ -54,9 +57,9 @@ import RelativeComponent from "./component.astro";
By default Micro has zero frameworks installed. If you install a framework, components of that framework can be used in MDX files. By default Micro has zero frameworks installed. If you install a framework, components of that framework can be used in MDX files.
<Callout> <Callout>
Don't forget to use [client Don't forget to use [client
directives](https://docs.astro.build/en/reference/directives-reference/#client-directives) directives](https://docs.astro.build/en/reference/directives-reference/)
to make framework components interactive. to make framework components interactive.
</Callout> </Callout>
```astro ```astro
@ -69,5 +72,6 @@ By default Micro has zero frameworks installed. If you install a framework, comp
- [MDX Syntax Documentation](https://mdxjs.com/docs/what-is-mdx) - [MDX Syntax Documentation](https://mdxjs.com/docs/what-is-mdx)
- [Astro Framework Integrations](https://docs.astro.build/en/guides/integrations-guide) - [Astro Framework Integrations](https://docs.astro.build/en/guides/integrations-guide)
- [Astro Usage Documentation](https://docs.astro.build/en/guides/markdown-content/#markdown-and-mdx-pages) - [Astro Usage Documentation](https://docs.astro.build/en/guides/markdown-content/)
- [Client Directives](https://docs.astro.build/en/reference/directives-reference/#client-directives) - [Client Directives](https://docs.astro.build/en/reference/directives-reference/)

8
src/content/blog/06-year-sorting-example/index.md
View file

@ -1,9 +1,11 @@
--- ---
title: "Year sorting example" title: Year sorting example
description: "Nano groups posts by year." description: Nano groups posts by year.
date: "2023-12-31" date: '2023-12-31'
tags: tags:
- example - example
--- ---
This post is to demonstrate the year sorting capabilities. This post is to demonstrate the year sorting capabilities.

8
src/content/blog/07-draft-example/index.md
View file

@ -1,12 +1,14 @@
--- ---
title: "Draft example" title: Draft example
description: "Setting draft flag to true to hide this post." description: Setting draft flag to true to hide this post.
date: "2022-12-31" date: '2022-12-31'
draft: false draft: false
tags: tags:
- example - example
--- ---
This post also demonstrates the year sorting capabilities. This post also demonstrates the year sorting capabilities.
Try setting this file's metadata to `draft: true`. Try setting this file's metadata to `draft: true`.

8
src/content/blog/08-prev-next-order-example/index.md
View file

@ -1,11 +1,13 @@
--- ---
title: "Chronological pagination example" title: Chronological pagination example
description: "Pagination works regardless of folder name." description: Pagination works regardless of folder name.
date: "2024-03-21" date: '2024-03-21'
tags: tags:
- example - example
--- ---
This post should show up in proper chronological order even though its folder comes last in the `content/blog` directory. This post should show up in proper chronological order even though its folder comes last in the `content/blog` directory.
The `Previous Post` and `Next Post` buttons under each blog post should also keep the proper chronological order, based on the frontmatter `date` field. The `Previous Post` and `Next Post` buttons under each blog post should also keep the proper chronological order, based on the frontmatter `date` field.

44
src/content/projects/project-1/index.md
View file

@ -1,11 +1,12 @@
--- ---
title: "Astro Sphere" title: Astro Sphere
description: "Portfolio and blog build with astro." description: Portfolio and blog build with astro.
date: "03/18/2024" date: 03/18/2024
demoURL: "https://astro-sphere-demo.vercel.app" demoURL: https://astro-sphere-demo.vercel.app
repoURL: "https://github.com/markhorn-dev/astro-sphere" repoURL: https://github.com/markhorn-dev/astro-sphere
--- ---
![Astro Sphere](/astro-sphere.jpg) ![Astro Sphere](/astro-sphere.jpg)
Astro Sphere is a static, minimalist, lightweight, lightning fast portfolio and blog theme based on Mark Horn's personal website. Astro Sphere is a static, minimalist, lightweight, lightning fast portfolio and blog theme based on Mark Horn's personal website.
@ -15,12 +16,12 @@ It is primarily Astro, Tailwind and Typescript, with a very small amount of Soli
## 🚀 Deploy your own ## 🚀 Deploy your own
<div class="flex gap-2"> <div class="flex gap-2">
<a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/markhorn-dev/astro-sphere"> <a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/markhorn-dev/astro-sphere">
<img src="/deploy_vercel.svg" /> <img src="/deploy_vercel.svg" />
</a> </a>
<a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/markhorn-dev/astro-sphere"> <a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/markhorn-dev/astro-sphere">
<img src="/deploy_netlify.svg" /> <img src="/deploy_netlify.svg" />
</a> </a>
</div> </div>
## 📋 Features ## 📋 Features
@ -62,18 +63,19 @@ All commands are run from the root of the project, from a terminal:
Replace npm with your package manager of choice. `npm`, `pnpm`, `yarn`, `bun`, etc Replace npm with your package manager of choice. `npm`, `pnpm`, `yarn`, `bun`, etc
| Command | Action | | Command | Action |
| :------------------------ | :------------------------------------------------ | | :------------------------ | :------------------------------------------------ |
| `npm install` | Installs dependencies | | `npm install` | Installs dependencies |
| `npm run dev` | Starts local dev server at `localhost:4321` | | `npm run dev` | Starts local dev server at `localhost:4321` |
| `npm run sync` | Generates TypeScript types for all Astro modules. | | `npm run sync` | Generates TypeScript types for all Astro modules. |
| `npm run build` | Build your production site to `./dist/` | | `npm run build` | Build your production site to `./dist/` |
| `npm run preview` | Preview your build locally, before deploying | | `npm run preview` | Preview your build locally, before deploying |
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | | `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
| `npm run astro -- --help` | Get help using the Astro CLI | | `npm run astro -- --help` | Get help using the Astro CLI |
| `npm run lint` | Run ESLint | | `npm run lint` | Run ESLint |
| `npm run lint:fix` | Auto-fix ESLint issues | | `npm run lint:fix` | Auto-fix ESLint issues |
## 🏛️ License ## 🏛️ License
MIT MIT

48
src/content/projects/project-2/index.md
View file

@ -1,11 +1,12 @@
--- ---
title: "Astro Nano" title: Astro Nano
description: "Minimal portfolio and blog build with astro and no frameworks." description: Minimal portfolio and blog build with astro and no frameworks.
date: "2024-03-26" date: '2024-03-26'
demoURL: "https://astro-nano-demo.vercel.app" demoURL: https://astro-nano-demo.vercel.app
repoURL: "https://github.com/markhorn-dev/astro-nano" repoURL: https://github.com/markhorn-dev/astro-nano
--- ---
![Astro Nano](/astro-nano.png) ![Astro Nano](/astro-nano.png)
Astro Nano is a static, minimalist, lightweight, lightning fast portfolio and blog theme. Astro Nano is a static, minimalist, lightweight, lightning fast portfolio and blog theme.
@ -17,12 +18,12 @@ It was designed as an even more minimal theme than Mark Horn's popular theme [As
## 🚀 Deploy your own ## 🚀 Deploy your own
<div class="flex gap-2"> <div class="flex gap-2">
<a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/markhorn-dev/astro-nano"> <a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/markhorn-dev/astro-nano">
<img src="/deploy_vercel.svg" /> <img src="/deploy_vercel.svg" />
</a> </a>
<a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/markhorn-dev/astro-nano"> <a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/markhorn-dev/astro-nano">
<img src="/deploy_netlify.svg" /> <img src="/deploy_netlify.svg" />
</a> </a>
</div> </div>
## 📋 Features ## 📋 Features
@ -63,20 +64,21 @@ All commands are run from the root of the project, from a terminal:
Replace npm with your package manager of choice. `npm`, `pnpm`, `yarn`, `bun`, etc Replace npm with your package manager of choice. `npm`, `pnpm`, `yarn`, `bun`, etc
| Command | Action | | Command | Action |
| :------------------------ | :------------------------------------------------ | | :------------------------ | :------------------------------------------------ |
| `npm install` | Installs dependencies | | `npm install` | Installs dependencies |
| `npm run dev` | Starts local dev server at `localhost:4321` | | `npm run dev` | Starts local dev server at `localhost:4321` |
| `npm run dev:network` | Starts local dev server on local network | | `npm run dev:network` | Starts local dev server on local network |
| `npm run sync` | Generates TypeScript types for all Astro modules. | | `npm run sync` | Generates TypeScript types for all Astro modules. |
| `npm run build` | Build your production site to `./dist/` | | `npm run build` | Build your production site to `./dist/` |
| `npm run preview` | Preview your build locally, before deploying | | `npm run preview` | Preview your build locally, before deploying |
| `npm run preview:network` | Preview build on local network | | `npm run preview:network` | Preview build on local network |
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | | `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
| `npm run astro -- --help` | Get help using the Astro CLI | | `npm run astro -- --help` | Get help using the Astro CLI |
| `npm run lint` | Run ESLint | | `npm run lint` | Run ESLint |
| `npm run lint:fix` | Auto-fix ESLint issues | | `npm run lint:fix` | Auto-fix ESLint issues |
## 🏛️ License ## 🏛️ License
MIT MIT

24
src/content/projects/project-3/index.md
View file

@ -1,11 +1,12 @@
--- ---
title: "Astro Micro" title: Astro Micro
description: "Astro Micro is an accessible and lightweight blog." description: Astro Micro is an accessible and lightweight blog.
date: "2024-05-26" date: '2024-05-26'
demoURL: "https://astro-micro.vercel.app" demoURL: https://astro-micro.vercel.app
repoURL: "https://github.com/trevortylerlee/astro-micro" repoURL: https://github.com/trevortylerlee/astro-micro
--- ---
![Astro Micro](/astro-micro.jpg) ![Astro Micro](/astro-micro.jpg)
Astro Micro is an accessible theme for Astro. It's a fork of Mark Horn's popular theme Astro Nano. Like Nano, Micro comes with zero frameworks installed. Astro Micro is an accessible theme for Astro. It's a fork of Mark Horn's popular theme Astro Nano. Like Nano, Micro comes with zero frameworks installed.
@ -19,12 +20,12 @@ Visit [Astro Micro on Github](https://github.com/trevortylerlee/astro-micro) to
## 🚀 Deploy your own ## 🚀 Deploy your own
<div class="flex gap-2"> <div class="flex gap-2">
<a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/trevortylerlee/astro-micro"> <a target="_blank" aria-label="Deploy with Vercel" href="https://vercel.com/new/clone?repository-url=https://github.com/trevortylerlee/astro-micro">
<img src="/deploy_vercel.svg" /> <img src="/deploy_vercel.svg" />
</a> </a>
<a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/trevortylerlee/astro-micro"> <a target="_blank" aria-label="Deploy with Netlify" href="https://app.netlify.com/start/deploy?repository=https://github.com/trevortylerlee/astro-micro">
<img src="/deploy_netlify.svg" /> <img src="/deploy_netlify.svg" />
</a> </a>
</div> </div>
## 📋 Features ## 📋 Features
@ -43,3 +44,4 @@ and [more](/blog/00-micro-changelog).
## 💯 Lighthouse score ## 💯 Lighthouse score
![Astro Nano Lighthouse Score](/astro-nano-lighthouse.jpg) ![Astro Nano Lighthouse Score](/astro-nano-lighthouse.jpg)