Astro Blog
A modern, feature-rich blog system built with Astro, Vue 3, and Tailwind CSS.
Why Choose This Blog?
- Fast - Static site generation with near-instant page loads
- Modern - Built with the latest web technologies
- Flexible - Markdown, MDX, and rich component support
- Beautiful - Clean design with dark mode support
Get Started
New to Astro Blog? Start here:
| Chapter | Description |
|---|---|
| Introduction | What is Astro Blog and why use it |
| Installation | Set up your development environment |
| First Post | Create and publish your first article |
| Project Structure | Understand the file organization |
| Deployment | Build and deploy your blog |
Writing Guide
Learn how to write beautiful content:
| Guide | Description |
|---|---|
| Markdown Basics | Essential Markdown syntax |
| Containers | Tips, warnings, and callouts |
| Code Blocks | Syntax highlighting and more |
| Diagrams | Flowcharts and diagrams with Mermaid |
| Math Formulas | LaTeX math rendering |
| Videos | Embed YouTube, Bilibili, and more |
| Icons | Use icons from multiple libraries |
Configuration
Customize your blog:
| Config | Description |
|---|---|
| Site Settings | Title, description, and metadata |
| Sidebar | Navigation and document trees |
| Multi-language | Add multiple language support |
Quick Start
# Install dependencies
npm install
# Start development server
npm run dev
# Build for production
npm run buildThen visit http://localhost:4321 to see your blog!
Ready to begin? Start with the Introduction!