I have followed the Ben Holmes and whitep4nth3r session on Astro on her Youtube channel. And here is the Github repo of the project used in this video.

**Tip: ** find nice projects on astro.new.

Add .npmrc if using pnpm with the following content:

// expose Astro dependencies for 'pnpm' users
shamefully-hoist=true

Astro calls integrations what most other componies call plugins.

Add Github gh CLI:

brew install gh
gh auth login
# make the initial commit and then create and add the remote
gh repo create

First, install Netlify CLI:

pnpm i -g netlify-cli
netlify --version

Now open the ~/.zshrc with nano and add the ntl alias

alias ntl='netlify'

Authorize with Github and create a new Netlify website:

ntl login # if expired run "ntl logout" first
ntl init # follow the dialog
git push
ntl open

Next step, let us try and fetch some Markdown file from Github and show it on the page. We create a src/components/Readme.astro file and add this code:

---
import { marked } from 'marked'
const response = await fetch('https://raw.githubusercontent.com/madrus/mdocs/master/README.md')
const markdown = await response.text()
const content = marked.parse(markdown)
---
<section set:html={content}></section>

Several notes:

1. we have to add marked as a dependency and @types/marked as a devDependency for this to work
2. as marked.parse() generates HTML, we need to add it via set:html={} attribute

Install the @astrojs/netlify devDependency.

🧑‍🚀 Seasoned astronaut? Delete this file. Have fun!

Inside of your Astro project, you'll see the following folders and files:

/
├── public/
│   └── favicon.svg
├── src/
│   ├── components/
│   │   └── Card.astro
│   ├── layouts/
│   │   └── Layout.astro
│   └── pages/
│       └── index.astro
└── package.json

Astro looks for .astro or .md files in the src/pages/ directory. Each page is exposed as a route based on its file name.

There's nothing special about src/components/, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.

Any static assets, like images, can be placed in the public/ directory.

All commands are run from the root of the project, from a terminal:

Feel free to check our documentation or jump into our Discord server.