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:
2026-04-17 14:52:59 +07:00
parent ce8483e546
commit 628298183a
74 changed files with 3536 additions and 11431 deletions

View File

@@ -1,119 +1,79 @@
#!/usr/bin/env bash
#===============================================================================
# new-project.sh - สร้าง Next.js + Payload CMS project ใหม่จาก Template
#
# Usage: ./new-project.sh [project-name] [project-path]
#
# สร้าง Next.js + Payload CMS project ใหม่โดย:
# 1. คัดลอก nextjs-payload-starter template
# 2. ติดตั้ง dependencies
# 3. ตั้งค่า environment
#
# Requirements:
# - git
# - node.js 20+
# - npm
#
#===============================================================================
set -e
# Colors
RED='\033[0;31m'
GREEN='\033[0;32m'
YELLOW='\033[1;33m'
BLUE='\033[0;34m'
NC='\033[0m' # No Color
NC='\033[0m'
# Default values
PROJECT_NAME="${1:-}"
PROJECT_PATH="${2:-.}"
# Get skill directory
SKILL_DIR="$(dirname "$(dirname "$(readlink -f "$0")")")"
TEMPLATE_DIR="$SKILL_DIR/templates/nextjs-payload-starter"
TEMPLATE_DIR="$SKILL_DIR/templates/astro-tina-starter"
#-------------------------------------------------------------------------------
# Helper functions
#-------------------------------------------------------------------------------
log_info() {
echo -e "${BLUE}[INFO]${NC} $1"
}
log_success() {
echo -e "${GREEN}[SUCCESS]${NC} $1"
}
log_warning() {
echo -e "${YELLOW}[WARNING]${NC} $1"
}
log_error() {
echo -e "${RED}[ERROR]${NC} $1"
}
log_info() { echo -e "${BLUE}[INFO]${NC} $1"; }
log_success() { echo -e "${GREEN}[SUCCESS]${NC} $1"; }
log_warning() { echo -e "${YELLOW}[WARNING]${NC} $1"; }
log_error() { echo -e "${RED}[ERROR]${NC} $1"; }
print_usage() {
cat << EOF
Usage: $(basename "$0") [project-name] [project-path]
สร้าง Next.js + Payload CMS project ใหม่จาก Template
Create new Astro + Tina CMS project from template
Arguments:
project-name ชื่อ project (optional)
project-path ที่อยู่ project (default: current directory)
project-name Project name (optional)
project-path Project location (default: current directory)
Examples:
$(basename "$0") my-website
$(basename "$0") my-website /path/to/projects/
Creates:
- Astro 6.1.7 framework
- Tailwind CSS 4.x
- Tina CMS (self-hosted)
- Astro DB for consent logging
- PDPA-compliant consent system
EOF
}
#-------------------------------------------------------------------------------
# Pre-flight checks
#-------------------------------------------------------------------------------
check_requirements() {
log_info "ตรวจสอบความต้องการของระบบ..."
log_info "Checking requirements..."
# Check git
if ! command -v git &> /dev/null; then
log_error "git ไม่พบ กรุณาติดตั้ง git ก่อน"
log_error "git not found"
exit 1
fi
# Check node
if ! command -v node &> /dev/null; then
log_error "node.js ไม่พบ กรุณาติดตั้ง node.js ก่อน"
log_error "node.js not found"
exit 1
fi
NODE_VERSION=$(node -v | cut -d'v' -f2 | cut -d'.' -f1)
if [ "$NODE_VERSION" -lt 20 ]; then
log_error "node.js version ต้อง >= 20 (ตอนนี้: $(node -v))"
log_error "node.js >= 20 required (current: $(node -v))"
exit 1
fi
# Check npm
if ! command -v npm &> /dev/null; then
log_error "npm ไม่พบ กรุณาติดตั้ง npm ก่อน"
log_error "npm not found"
exit 1
fi
# Check template exists
if [ ! -d "$TEMPLATE_DIR" ]; then
log_error "ไม่พบ Next.js Payload Starter Template: $TEMPLATE_DIR"
log_error "Template not found: $TEMPLATE_DIR"
exit 1
fi
log_success "ความต้องการของระบบผ่าน (git, node $(node -v), npm)"
log_success "Requirements OK (git, node $(node -v), npm)"
}
#-------------------------------------------------------------------------------
# Create project directory
#-------------------------------------------------------------------------------
setup_directory() {
local actual_project_path="$PROJECT_PATH"
@@ -121,13 +81,11 @@ setup_directory() {
actual_project_path="$PROJECT_PATH/$PROJECT_NAME"
fi
# Create directory
mkdir -p "$actual_project_path"
# Check if directory is empty
if [ "$(ls -A "$actual_project_path" | wc -l)" -gt 0 ]; then
log_warning "Directory ไม่ว่าง: $actual_project_path"
read -p "ดำเนินต่อ? (y/n): " -n 1 -r
log_warning "Directory not empty: $actual_project_path"
read -p "Continue? (y/n): " -n 1 -r
echo
if [[ ! $REPLY =~ ^[Yy]$ ]]; then
exit 1
@@ -138,32 +96,37 @@ setup_directory() {
log_info "Project path: $PROJECT_PATH"
}
#-------------------------------------------------------------------------------
# Copy template
#-------------------------------------------------------------------------------
copy_template() {
log_info "คัดลอก Next.js Payload Starter Template..."
log_info "Copying Astro+Tina template..."
# Copy all template files
cp -r "$TEMPLATE_DIR/"* "$PROJECT_PATH/"
cp -r "$TEMPLATE_DIR/src/collections/access" "$PROJECT_PATH/src/collections/" 2>/dev/null || true
cp -r "$TEMPLATE_DIR"/.* "$PROJECT_PATH/" 2>/dev/null || true
# Copy consent API if exists
if [ -d "$SKILL_DIR/templates/consent/api" ]; then
mkdir -p "$PROJECT_PATH/src/pages/api"
cp "$SKILL_DIR/templates/consent/api/"* "$PROJECT_PATH/src/pages/api/" 2>/dev/null || true
fi
log_success "คัดลอก template เสร็จสมบูรณ์"
log_success "Template copied"
}
#-------------------------------------------------------------------------------
# Copy legal templates
#-------------------------------------------------------------------------------
copy_consent_system() {
log_info "Adding PDPA consent system..."
local consent_template="$SKILL_DIR/templates/consent"
if [ -d "$consent_template" ]; then
mkdir -p "$PROJECT_PATH/src/components/consent"
cp "$consent_template/ConsentBanner.astro" "$PROJECT_PATH/src/components/consent/" 2>/dev/null || true
cp "$consent_template/stores/"* "$PROJECT_PATH/src/stores/" 2>/dev/null || true
mkdir -p "$PROJECT_PATH/src/pages/api"
cp "$consent_template/api/consent.ts" "$PROJECT_PATH/src/pages/api/" 2>/dev/null || true
mkdir -p "$PROJECT_PATH/db"
cp "$consent_template/db/config.ts" "$PROJECT_PATH/db/" 2>/dev/null || true
fi
log_success "Consent system added"
}
copy_legal_templates() {
log_info "คัดลอก PDPA templates..."
log_info "Copying PDPA legal templates..."
mkdir -p "$PROJECT_PATH/src/content/pages"
@@ -175,168 +138,92 @@ copy_legal_templates() {
cp "$SKILL_DIR/templates/terms-of-service.md" "$PROJECT_PATH/src/content/pages/"
fi
log_success "คัดลอก PDPA templates เสร็จสมบูรณ์"
log_success "Legal templates copied"
}
#-------------------------------------------------------------------------------
# Install dependencies
#-------------------------------------------------------------------------------
install_dependencies() {
log_info "ติดตั้ง dependencies..."
log_info "Installing dependencies..."
cd "$PROJECT_PATH"
npm install
log_success "ติดตั้ง dependencies เสร็จสมบูรณ์"
log_success "Dependencies installed"
}
#-------------------------------------------------------------------------------
# Setup environment
#-------------------------------------------------------------------------------
setup_environment() {
log_info "ตั้งค่า environment..."
log_info "Setting up environment..."
cd "$PROJECT_PATH"
if [ ! -f ".env" ]; then
if [ -f ".env.example" ]; then
cp .env.example .env
log_success "สร้าง .env จาก .env.example"
log_warning "กรุณาแก้ไข .env และใส่ DATABASE_URL ที่ถูกต้อง"
log_success "Created .env from .env.example"
else
cat > .env << 'EOF'
# Payload CMS
PAYLOAD_SECRET=change-this-secret-key-at-least-32-characters
DATABASE_URL=postgresql://user:password@localhost:5432/mydb
# Server
SERVER_URL=http://localhost:4321
NODE_ENV=development
PUBLIC_SITE_URL=http://localhost:4321
TINA_TOKEN=your-tina-token
EOF
log_success "สร้าง .env เริ่มต้น"
log_warning "กรุณาแก้ไข .env และใส่ DATABASE_URL ที่ถูกต้อง"
log_success "Created default .env"
fi
else
log_info ".env มีอยู่แล้ว"
fi
}
#-------------------------------------------------------------------------------
# Create AI_RULES.md
#-------------------------------------------------------------------------------
create_ai_rules() {
log_info "สร้าง AI_RULES.md..."
cd "$PROJECT_PATH"
cat > AI_RULES.md << 'EOF'
# AI Rules
## Tech Stack Overview
- **Frontend:** Next.js App Router + TypeScript
- **Backend/CMS:** Payload CMS 3.0
- **Database:** MongoDB (via mongooseAdapter)
- **Styling:** Tailwind CSS v4
- **Authentication:** Payload built-in auth with role-based access
- **Image Handling:** Payload Media collection
## File Organization
- **Collections:** Define Payload collections in `src/collections/`
- **Pages:** Next.js App Router in `src/app/`
- **Components:** Reusable components in `src/components/`
- **Styles:** Global styles in `src/app/globals.css`
## Never Modify These Files
- `src/payload-types.ts` - Auto-generated by Payload
- `src/migrations/` - Database migration files
## Thai-First
- ใช้ Kanit หรือ Noto Sans Thai fonts
- Thai typography CSS
- Thai structured data (LocalBusiness, Organization)
- ภาษาไทยเป็นหลักใน content
EOF
log_success "สร้าง AI_RULES.md เสร็จสมบูรณ์"
}
#-------------------------------------------------------------------------------
# Initialize git
#-------------------------------------------------------------------------------
init_git() {
log_info "เริ่มต้น git..."
log_info "Initializing git..."
cd "$PROJECT_PATH"
if [ ! -d ".git" ]; then
git init
git add .
git commit -m "Initial commit: Next.js + Payload CMS starter"
log_success "เริ่มต้น git เสร็จสมบูรณ์"
else
log_info "git repo มีอยู่แล้ว"
git commit -m "Initial commit: Astro + Tina CMS starter"
log_success "Git initialized"
fi
}
#-------------------------------------------------------------------------------
# Show project structure
#-------------------------------------------------------------------------------
show_structure() {
log_info "โครงสร้าง project:"
log_info "Project structure:"
cd "$PROJECT_PATH"
echo ""
find . -type f \( -name "*.ts" -o -name "*.tsx" -o -name "*.astro" -o -name "*.mjs" -o -name "*.css" -o -name "*.md" -o -name "package.json" \) 2>/dev/null | grep -v node_modules | sort | head -30
}
#-------------------------------------------------------------------------------
# Main
#-------------------------------------------------------------------------------
main() {
echo "=============================================="
echo " Next.js + Payload CMS Project Creator"
echo " Using Next.js Payload Starter"
echo " Astro + Tina CMS Project Creator"
echo "=============================================="
echo ""
# Parse arguments
if [ "$1" == "-h" ] || [ "$1" == "--help" ]; then
print_usage
exit 0
fi
# Run steps
check_requirements
setup_directory
copy_template
copy_consent_system
copy_legal_templates
install_dependencies
setup_environment
create_ai_rules
init_git
show_structure
echo ""
echo "=============================================="
log_success "สร้าง Next.js + Payload CMS project เสร็จสมบูรณ์!"
log_success "Project created successfully!"
echo "=============================================="
echo ""
echo "ขั้นตอนถัดไป:"
echo "Next steps:"
echo " 1. cd $PROJECT_PATH"
echo " 2. แก้ไข .env (MONGODB_URL, PAYLOAD_SECRET)"
echo " 3. npm install"
echo " 4. npm run dev"
echo " 5. เปิด http://localhost:3002/admin สำหรับ Payload admin"
echo " 2. npm run dev"
echo " 3. Open http://localhost:4321"
echo ""
echo "For Tina CMS admin:"
echo " - npm run dev"
echo " - Visit http://localhost:4321/admin"
echo ""
}
main "$@"
main "$@"