A freeing full-stack web stack.
- CSS-based component library (daisyUI)
- Blog
- Database (Astro DB managed via Astro Studio)
- Auth (Lucia)
- Simple Web Hosting (Netlify)
Note: Astro Studio is currently in closed beta. If you do not already have an account, you'll need an invitation.
- Astro - A simple web metaframework.
- Tailwind CSS - For styling.
- Preline UI - Tailwind-based HTML components.
- Daisy UI - For a Bootstrap-like UI CSS component library, built upon Tailwind.
- Lucide Icons - For a beautiful icon library.
- TypeScript - For type safety.
- AlpineJS - For state management and interactivity.
- HTMX - For sending HTML partials/snippets over the wire.
- Astro DB - Astro DB is a fully managed SQL database that is fast, lightweight, and ridiculously easy-to-use. (Can use Turso, if desired.)
- Drizzle ORM - A modern SQL database toolkit.
- Lucia - A modern authentication library for Astro.
I owe a huge thank you to Thomas McInnis for his tutorial on Astro and Lucia.
I have included the Netlify adapter in the starter kit. You can swap it out for others, such as Vercel.
To create your own instance of this codebase, click the "Use this template" button on the repo's home page.
This project uses the following environment variables:
Variable | Description | Required |
---|---|---|
SENTRY_DSN |
Sentry Data Source Name for error tracking | Optional |
SENTRY_AUTH_TOKEN |
Authentication token for Sentry | Optional |
SENTRY_PROJECT |
Sentry project identifier | Optional |
ASTRO_STUDIO_APP_TOKEN |
Token for Astro Studio integration | Required |
For Sentry error tracking, you can set up the following variables. For more information, refer to the Sentry Astro integration guide.
The ASTRO_STUDIO_APP_TOKEN
is required for integrating with Astro Studio features.
Make sure to set these variables in your environment or .env
file before running the application.
I dream of a lightweight, simple web development stack that invokes a fun web experience at the cheapest possible maintainance, backend, and server cost. As close to free as possible.
- Approachable — I want those new to web development to feel comfortable using this stack. Things like database management should feel intuitive. Remove barriers of traditional JavaScript frameworks, such as excessive boilerplate code or intense state management. Go back to the basics of web development. (While this is not vanilla, the dev experience will feel very natural.)
- Flow-able — Use an HTML-first approach, where almost all of the work is done on the DOM layer: styling, structuring, and interactivity. An opinionated stack helps you avoid analysis paralysis of trying to decide what tooling to pick or how to put things together. Instead, spend your thinking time building. This simple stack helps you focus and get in the flow of code faster. Fast setup. Fast building. Fast shipping.
- Pocket-friendly — Using this stack will be financially maintainable to anyone, especially indie hackers and those creating startup sites / web apps.
I'll consider a contribution, but please open an issue if you'd like to contribute.