Astro React Tailwind shadcn/ui Starter

A modern, feature-rich starter template for building web applications using Astro, React, Tailwind CSS, and shadcn/ui components.

🚀 Features

• ⚡️ Astro - The web framework for content-driven websites
• ⚛️ React - UI library for building user interfaces
• 🎨 Tailwind CSS - Utility-first CSS framework
• 🎯 shadcn/ui - Re-usable components built with Radix UI and Tailwind CSS
• 📱 Responsive design
• 🎨 Modern UI components
• 🔍 SEO optimized
• 📝 MDX support
• 🚀 Fast development with hot module replacement
• 🛠 TypeScript support
• 📦 Package management with pnpm
• 🎯 Code formatting with Prettier

🛠️ Tech Stack

• Framework: Astro 5.x
• UI Library: React 19.x
• Styling: Tailwind CSS 4.x
• Components: shadcn/ui
• Icons: Lucide React, Heroicons
• Package Manager: pnpm
• Language: TypeScript

🚀 Getting Started

Prerequisites

• Node.js (Latest LTS version recommended)
• pnpm (Package manager)

Installation

1. Clone the repository:

   git clone <repository-url>
   cd astro-react-tailwind4-shadcn-starter

2. Install dependencies:

   pnpm install

3. Start the development server:

   pnpm dev

4. Open http://localhost:4321 in your browser.

📝 Available Scripts

• pnpm dev - Start development server
• pnpm build - Build for production
• pnpm preview - Preview production build
• pnpm prettier - Format code with Prettier

🏗️ Project Structure

├── src/
│   ├── components/     # React components
│   ├── layouts/       # Layout components
│   ├── pages/         # Astro pages
│   └── styles/        # Global styles
├── public/            # Static assets
├── astro.config.ts    # Astro configuration
├── tailwind.config.js # Tailwind configuration
└── tsconfig.json     # TypeScript configuration

🎨 Customization

• Modify tailwind.config.js to customize your theme
• Update astro.config.ts for Astro-specific configurations
• Add new components in the src/components directory
• Create new pages in the src/pages directory

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to check the issues page.

🙏 Acknowledgments

• Astro
• React
• Tailwind CSS
• shadcn/ui
• Radix UI