astro-sphere

Author: markhorn-dev on December 1, 2024

BlogSEOResponsiveDarkTailwindRSSSearch
astro-sphere
astro-sphereastro-sphereastro-sphereastro-sphereastro-sphere
Free
MIT

Astro Sphere Lighthouse Score

Astro Sphere is a static, minimalist, lightweight, lightning fast portfolio and blog theme based on my personal website.

It is primarily Astro, Tailwind and Typescript, with a very small amount of SolidJS for stateful components.

πŸš€ Deploy your own

Deploy with Vercel Deploy with Netlify

πŸ“‹ Features

πŸ’― Lighthouse score

Astro Sphere Lighthouse Score

πŸ•ŠοΈ Lightweight

All pages under 100kb (including fonts)

⚑︎ Fast

Rendered in ~40ms on localhost

πŸ“„ Configuration

The blog posts on the demo serve as the documentation and configuration.

πŸ’» Commands

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

Replace npm with your package manager of choice. npm, pnpm, yarn, bun, etc

CommandAction
npm installInstalls dependencies
npm run devStarts local dev server at localhost:4321
npm run dev:networkStarts dev server on local network
npm run syncGenerates TypeScript types for all Astro modules.
npm run buildBuild your production site to ./dist/
npm run previewPreview your build locally, before deploying
npm run preview:networkStarts preview server on local network
npm run astro ...Run CLI commands like astro add, astro check
npm run astro -- --helpGet help using the Astro CLI
npm run lintRun ESLint
npm run lint:fixAuto-fix ESLint issues

πŸ—ΊοΈ Roadmap

A few features I plan to implement

✨ Acknowledgement

Theme inspired by Paco Coursey, Lee Robinson and Hayden Bleasel

πŸ›οΈ License

MIT

1.0.1 Update

Added ability to run dev and preview on local network. added npm run dev:network added npm run preview:network

Added slightly more particle density in both light and dark mode.

Added subtle dark mode star and meteor animations.

Removed eslint config