Documentation Awesome Astro

Awesome Astro Documentation

Welcome to Awesome Astro!

A curated directory of the best Astro resources, starter templates, themes, and tools. This documentation covers setup, configuration, customization, and content management for your Awesome Astro site.

Getting Started

1. Download and Extract

Download the project zip and extract it
Navigate to the project directory: cd awesome-astro

2. Install Dependencies

yarn install

3. Start the Development Server

yarn dev

Visit http://localhost:4321 in your browser.

4. Build for Production

yarn build
yarn preview

Configuration

All main configuration is in src/config/config.json:

site — title, base URL, logo, favicon
settings — search, sticky header, theme switcher, pagination, summary length
announcement — enable/disable site-wide banner with expiry
params — contact form action, footer text, copyright
navigation_button — call-to-action button label and link (e.g. “Submit Project”)
google_tag_manager — GTM integration toggle and ID
metadata — default SEO meta author, image, and description

Theme Customization

Colors & Tokens — edit src/styles/theme.css
Components — edit src/styles/components.css and src/styles/navigation.css
UI Components — edit files in src/layouts/components/
Menu - edit file in src/config/menu.json

Managing Content

Content is stored as Markdown/MDX files in src/content/, organized by section:

Section	Path
Homepage	`src/content/homepage/-index.md`
Products	`src/content/products/`
Blog	`src/content/blog/`
Authors	`src/content/authors/`
About	`src/content/about/-index.md`
Pricing	`src/content/pricing/_index.md`
Changelog	`src/content/changelog/_index.md`
Submit	`src/content/submit/_index.md`
Contact	`src/content/contact/-index.md`
Sections	`src/content/sections/`

Add a Product Listing

Copy src/content/products/_template.md
Update frontmatter (title, description, image, category, tags, etc.)
Set draft: false to publish

Update the Homepage

Edit src/content/homepage/-index.md to change the banner, featured products, and popular products lists (referenced by product slug).

Scripts

Command	Description
`yarn dev`	Start dev server with JSON generation and theme watching
`yarn build`	Production build
`yarn preview`	Preview production build locally
`yarn generate-json`	Regenerate JSON data from Markdown content
`yarn check`	Run Astro type checks
`yarn format`	Format source with Prettier
`yarn deploy:cf-workers`	Build and deploy to Cloudflare Workers
`yarn preview:cf-workers`	Build and preview on Cloudflare Workers locally

Additional Notes

Images go in public/images/
Navigation configured in src/config/menu.json
SEO meta handled in src/layouts/partials/SeoMeta.astro
The scripts/jsonGenerator.js runs automatically during dev and build to sync content
The scripts/themeGenerator.js runs automatically to generate theme CSS tokens

For more help, consult the codebase or reach out to the project maintainers.