Introduction
AstroPaper is a minimal, responsive, accessible, and SEO-friendly blog theme built with Astro. It's designed to provide a clean and efficient blogging experience while adhering to best practices in web development. The theme is self-documented, meaning that the blog posts within the theme serve as documentation.
Main Features
- Type-safe markdown support
- High-performance optimization
- Accessibility features for keyboard and screen reader users
- Responsive design for various devices
- SEO-friendly structure
- Light and dark mode
- Fuzzy search functionality
- Draft post support and pagination
- Sitemap and RSS feed generation
- Customizable color schemes
- Dynamic OG image generation for blog posts
Installation Steps
Choose a package manager and run one of the following commands:
# npm 6.x npm create astro@latest -- --template satnaing/astro-paper # npm 7+ npm create astro@latest -- --template satnaing/astro-paper # yarn yarn create astro --template satnaing/astro-paper # pnpm pnpm dlx create-astro --template satnaing/astro-paper
Install dependencies:
npm install
Start the development server:
npm run dev
Alternatively, you can use Docker:
Build the Docker image:
docker build -t astropaper .
Run the Docker container:
docker run -p 4321:80 astropaper
Usage Instructions
Create blog posts as Markdown files in the
src/content/blog
directory.Customize the theme by modifying files in the
src
directory:src/styles
for stylingsrc/components
for reusable componentssrc/pages
for page templatessrc/config.ts
for site configuration
Use the provided npm scripts for various tasks:
npm run dev
for local developmentnpm run build
for production buildnpm run preview
to preview the buildnpm run format:check
andnpm run format
for code formattingnpm run lint
for linting
Explore the theme's features like fuzzy search, dark mode, and dynamic OG image generation.
Customize color schemes by following the documentation in the blog posts or README.
Important Notes
The theme is designed to be accessible and follows best practices for SEO and performance.
It supports type-safe markdown, ensuring consistency in your content.
The project structure is organized for easy maintenance and customization.
You can add Google Site Verification by setting the
PUBLIC_GOOGLE_SITE_VERIFICATION
environment variable.The theme is licensed under the MIT License, allowing for free use and modification.
Contributions and feedback are welcome through GitHub issues or by contacting the creator.
For Windows PowerShell users, you may need to install the
concurrently
package for running diagnostics during development.The theme has been tested with VoiceOver on Mac and TalkBack on Android for accessibility.
Regular updates and releases are provided, with the latest version being v4.4.0 as of August 19, 2024.
The project uses various technologies including Astro, TypeScript, React, TailwindCSS, and more for a robust development experience.