Astro Starter Template with Keystatic CMS, Tailwind CSS, and DaisyUI

This starter template is built using Astro, Keystatic CMS, Tailwind CSS, and DaisyUI, offering a powerful yet simple foundation for creating fast and beautiful static sites.

Table of Contents

• Features
• Installation
• Usage
• Project Structure

Features

• Astro: Build fast, modern websites with Astro's powerful static site generator.
• Keystatic CMS: Manage your site's content with an easy-to-use CMS.
• Tailwind CSS: Rapidly build and style your site with Tailwind CSS.
• DaisyUI: Use beautiful, pre-designed components with DaisyUI.

Installation

Prerequisites

Before you begin, ensure you have the following installed:

• Node.js (v14.x or later)
• npm (v6.x or later) or yarn (v1.x or later)

Clone repo

git clone https://github.com/TheWebsiteGuy/astrokeys

Install Dependencies

Using npm:

npm install

Or using yarn:

yarn install

Usage

Development

To start the development server, run:

npm run dev

Or with yarn:

yarn dev

Admin UI: http://127.0.0.1:4321/keystatic

Homepage: http://localhost:4321

Build

npm run build

Or with yarn:

yarn build

Preview

To preview the production build locally, run:

npm run preview

Or with yarn:

yarn preview

Project Structure

/
├── public/                 # Static assets
├── src/
│   ├── assets/             # Images and styles etc
│   ├── cms/                # Schema for Keystatic content
│   ├── components/         # Astro components
│   ├── content/            # Astro content managed by Keystatic
│   ├── layouts/            # Astro layouts
│   ├── pages/              # Astro pages
│   ├── settings/           # Site settings
│   ├── styles/             # CSS config with TailwindCSS and DaisyUI
├── keystatic.config.ts     # Keystatic CMS configuration
├── keystatic.page.ts       # Keystatic CMS configuration for Singleton pages
├── astro.config.mjs        # Astro configuration
├── package.json            # Project dependencies and scripts
└── README.md               # Project documentation