Astro Boilerplate Features

Astro

Fast, content-focused web framework

React

UI components for interactivity

tRPC

End-to-end typesafe APIs

NextAuth

Authentication made easy

Tailwind

Utility-first CSS framework

TypeScript

Static typing for JavaScript

Drizzle

Fully Typesave Database ORM

shadcnui

Using shadcnui for UI components in React

sqlite

Using sqlite for database

tRPC Demo

End-to-end typesafe APIs in action

Loading...

Auth Demo

Authentication with auth-astro

Not signed in

Content Collections

Manage and organize your content with Astro's built-in content collections. Type-safe frontmatter, automatic slug generation, and more!

Learn more

Todo Example

Example todo application with tRPC, React Query, and Tailwind CSS. Click here to view the Example Todo Application.

View the example

React SPA

Experience a full React Single Page Application integrated within Astro. Demonstrates client-side rendering and routing.

Explore the SPA

Feature Details

  • Astro

    Lightning-fast static site generator with powerful integrations and optimal performance.

    Astro builds fast content sites, powerful web applications, dynamic server API endpoints, and everything in-between.

  • React

    A JavaScript library for building user interfaces with a component-based architecture.

    React allows you to build reusable UI components and manage state efficiently in your application.

  • Tailwind CSS

    A utility-first CSS framework for rapidly building custom user interfaces.

    Tailwind provides low-level utility classes that let you build completely custom designs without ever leaving your HTML.

  • TypeScript

    A typed superset of JavaScript that compiles to plain JavaScript.

    TypeScript adds optional types to JavaScript, supporting tools for large-scale JavaScript applications.

  • tRPC

    End-to-end typesafe APIs made easy.

    tRPC allows you to easily build and consume fully typesafe APIs without schemas or code generation.

  • Content Collections

    Astros built-in system for managing content in your project.

    Content Collections help you organize, validate, and provide TypeScript type safety for your Markdown and MDX content.

  • Todo Application

    A fully functional todo application showcasing various features of the stack.

    This example demonstrates how to build a real-world application using React, tRPC, and Tailwind CSS within the Astro framework.

  • React SPA

    A full React Single Page Application integrated within Astro.

    This feature shows how to incorporate a complete React SPA into your Astro project, demonstrating client-side rendering and routing.