Astro Blog
A Fast, Small & Powerful Blog Template For Developer.
Inspired by leerob.io
Demo neko-astro-blog.vercel.app/
⭐ Features
-
Fast & Small
🏎️ - Static site generation
- Auto-compress all static files
- Built with Astro, Solid.js and Tailwind CSS
- Image optimized (local/remote images auto compress to
Webp
format) with lazy loading - Partial hydration
-
Powerful
🚀 - MDX support
- Syntax highlighting
- copy button
- line number
- line highlight
- dark mode
- Twemoji support
- Comments system
- SEO friendly
- RSS feed
-
Responsive
📱 - Mobile-first
- Dark mode
- Customizable
📂 Project Structure
astro-blog
├─ site.config.ts
├─ astro.config.ts
├─ tailwind.config.cjs
├─ postcss.config.cjs
├─ prettier.config.cjs
├─ public
│ └─ favicon.svg
├─ src
│ ├─ assets
│ ├─ components
│ │ └─ MDX
│ ├─ images
│ ├─ layouts
│ ├─ lib
│ ├─ pages
│ │ ├─ index.astro
│ │ ├─ blog.astro
│ │ ├─ blog
│ │ │ ├─ _frontmatter.yaml
│ │ │ └─ _template.mdx
│ │ ├─ tags
│ │ │ ├─ index.astro
│ │ │ └─ [tag].astro
│ │ ├─ snippets.astro
│ │ ├─ snippets
│ │ │ ├─ _frontmatter.yaml
│ │ │ └─ _template.mdx
│ │ ├─ guestbook.astro
│ │ ├─ 404.astro
│ │ └─ rss.xml.ts
│ ├─ plugins
│ ├─ styles
│ ├─ types
│ └─ _components.ts
└─ package.json
🧞 Commands
Command | Action |
---|---|
pnpm i |
Installs dependencies |
pnpm dev |
Starts local dev server at localhost:3000 |
pnpm build |
Build your production site to ./dist/ |
pnpm preview |
Preview your build locally, before deploying |
pnpm update |
Update all the dependencies to latest |
pnpm format |
Format project with Prettier |