feat: migrate website-creator from Next.js+Payload to Astro+Tina CMS
Major changes: - Replace Payload CMS with Tina CMS (self-hosted) - Add Astro DB for consent logging (PDPA compliant) - Update Tailwind v3 to v4 (@tailwindcss/vite plugin) - Add astro-tina-starter template - Rewrite consent template for Astro (ConsentBanner.astro, Astro DB, Nano Stores) - Add install-tina-backend.sh for self-hosted Tina per customer - Rename convert-astro.sh to migrate-tina.sh - Add AGENTS.md template for generated websites - Delete all Payload/Next.js files Technical updates: - Astro DB using defineDb with eq operators for queries - Tailwind v4 with @theme block - Tina CMS local development mode - Proper Astro API routes for consent Research-verified with official documentation (April 2026)
This commit is contained in:
104
skills/website-creator/templates/astro-tina-starter/README.md
Normal file
104
skills/website-creator/templates/astro-tina-starter/README.md
Normal file
@@ -0,0 +1,104 @@
|
||||
# Astro Tina Starter
|
||||
|
||||
Astro 6.1.7 + Tina CMS starter template with Tailwind CSS 4.x
|
||||
|
||||
## Tech Stack
|
||||
|
||||
- **Framework:** Astro 6.1.7
|
||||
- **CMS:** Tina CMS (self-hosted)
|
||||
- **Styling:** Tailwind CSS 4.x with `@tailwindcss/vite`
|
||||
- **Database:** Astro DB (LibSQL)
|
||||
- **State:** Nano Stores + React
|
||||
- **Language:** TypeScript
|
||||
|
||||
## Features
|
||||
|
||||
- Self-hosted Tina CMS with schema-based content
|
||||
- Tailwind CSS 4.x using `@tailwindcss/vite` plugin
|
||||
- Astro DB for consent logging (PDPA compliant)
|
||||
- Nano Stores for client-side state management
|
||||
- Thai language support foundation
|
||||
- Docker-ready deployment
|
||||
|
||||
## Quick Start
|
||||
|
||||
```bash
|
||||
# Install dependencies
|
||||
npm install
|
||||
|
||||
# Start development
|
||||
npm run dev
|
||||
|
||||
# Build for production
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Tina CMS Access
|
||||
|
||||
During development, access Tina CMS at:
|
||||
- http://localhost:4321/admin
|
||||
|
||||
For production, you'll need a TINA_TOKEN environment variable.
|
||||
|
||||
## Project Structure
|
||||
|
||||
```
|
||||
astro-tina-starter/
|
||||
├── .tina/
|
||||
│ ├── config.ts # Tina CMS configuration
|
||||
│ └── schema.ts # Content schema definitions
|
||||
├── db/
|
||||
│ ├── config.ts # Astro DB schema (consent logs)
|
||||
│ └── seed.ts # Database seed script
|
||||
├── src/
|
||||
│ ├── styles/
|
||||
│ │ └── global.css # Tailwind v4 styles
|
||||
│ ├── layouts/
|
||||
│ │ └── Layout.astro
|
||||
│ ├── pages/
|
||||
│ │ └── index.astro
|
||||
│ ├── components/
|
||||
│ │ └── Header.astro
|
||||
│ └── content/
|
||||
│ └── config.ts # Tina content collections
|
||||
├── Dockerfile
|
||||
└── package.json
|
||||
```
|
||||
|
||||
## Tailwind CSS 4.x
|
||||
|
||||
This template uses Tailwind CSS 4.x with the `@tailwindcss/vite` plugin.
|
||||
The configuration is done via CSS `@theme` block in `src/styles/global.css`.
|
||||
|
||||
```css
|
||||
@import "tailwindcss";
|
||||
|
||||
@theme {
|
||||
--color-primary: #1a1a1a;
|
||||
--color-accent: #3b82f6;
|
||||
}
|
||||
```
|
||||
|
||||
## Astro DB
|
||||
|
||||
The template includes a consent-log table for PDPA compliance:
|
||||
|
||||
```ts
|
||||
// db/config.ts
|
||||
export const ConsentLog = defineTable({
|
||||
columns: {
|
||||
action: text(),
|
||||
purpose: text(),
|
||||
analytics: boolean(),
|
||||
marketing: boolean(),
|
||||
functional: boolean(),
|
||||
userAgent: text(),
|
||||
ip: text(),
|
||||
timestamp: text(),
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
MIT
|
||||
Reference in New Issue
Block a user