system-prompts-and-models-o.../web/setup.sh
Claude 9d5ee88ea3
feat: Add modern Next.js 15 web interface with React 19
This commit adds a complete, production-ready web application for browsing
and exploring AI tool system prompts. The interface provides an intuitive,
responsive, and feature-rich experience for discovering AI tools.

## Web Application Features

**Core Functionality:**
- 🔍 Advanced search with real-time filtering
- 📊 Interactive statistics dashboard with visualizations
- 🔄 Side-by-side comparison of up to 4 tools
-  Favorites system with local persistence
- 📱 Fully responsive mobile-first design
- 🎨 Dark/light mode with system preference detection
-  Optimized performance with Next.js Server Components

**Pages:**
- Home: Hero section, features showcase, featured tools
- Browse: Advanced filtering, grid/list views, category filters
- Stats: Comprehensive analytics and visualizations
- Compare: Side-by-side tool comparison
- Tool Detail: In-depth tool information
- About: Project information and tech stack

**Components:**
- Responsive navbar with mobile menu
- Tool cards with interactive actions
- Reusable UI components (Button, Card, Badge, Input)
- Footer with quick links and stats
- Theme provider for dark mode
- Loading and error states

## Technical Stack

**Framework & Libraries:**
- Next.js 15 with App Router
- React 19.0 with Server Components
- TypeScript 5.6 for type safety
- Tailwind CSS for styling
- Zustand for state management
- next-themes for theme switching
- Lucide React for icons

**Features:**
- Server-side rendering (SSR)
- Static site generation (SSG) for tool pages
- Optimized bundle with automatic code splitting
- SEO-friendly with metadata API
- Accessibility best practices

## Project Structure

web/
├── app/                   # Next.js pages
├── components/            # React components
├── lib/                   # Utilities and data
├── data/                  # Static data (index.json)
├── setup.sh              # Setup script
└── README.md             # Documentation

## Developer Experience

- TypeScript for type safety
- ESLint for code quality
- Hot module replacement
- Fast refresh
- Comprehensive documentation
- Setup script for quick start

## Updated Documentation

- Enhanced main README with web interface section
- Created comprehensive web/README.md
- Updated roadmap to mark completed features
- Added Quick Start guide for web app

## Stats

- 33 new files created
- ~3,500 lines of TypeScript/TSX
- Full responsive design (mobile, tablet, desktop)
- Production-ready with build optimizations

Users can now explore 32+ AI tools through an intuitive web interface
instead of just command-line tools.

Version: 2.0.0
2025-11-15 02:20:46 +00:00

63 lines
1.4 KiB
Bash
Executable File

#!/bin/bash
# AI Prompts Explorer - Web Setup Script
# This script sets up the Next.js web application
set -e
echo "🚀 AI Prompts Explorer - Web Setup"
echo "=================================="
echo ""
# Check Node version
echo "📦 Checking Node.js version..."
NODE_VERSION=$(node -v)
echo "Found Node.js: $NODE_VERSION"
if [[ ! "$NODE_VERSION" =~ ^v(22|23|24|25) ]]; then
echo "⚠️ Warning: Node.js 22+ is recommended (found $NODE_VERSION)"
fi
echo ""
# Check if we're in the web directory
if [ ! -f "package.json" ]; then
echo "❌ Error: package.json not found"
echo "Please run this script from the web/ directory"
exit 1
fi
# Install dependencies
echo "📥 Installing dependencies..."
npm install
echo ""
# Generate metadata if needed
if [ ! -f "data/index.json" ]; then
echo "📊 Generating metadata..."
cd ..
python3 scripts/generate_metadata.py
mkdir -p web/data
cp scripts/index.json web/data/
cd web
echo "✓ Metadata generated"
else
echo "✓ Metadata already exists"
fi
echo ""
echo "✅ Setup complete!"
echo ""
echo "🎉 You can now run the development server:"
echo " npm run dev"
echo ""
echo "📖 The app will be available at:"
echo " http://localhost:3000"
echo ""
echo "📚 Other commands:"
echo " npm run build - Build for production"
echo " npm start - Start production server"
echo " npm run lint - Lint code"
echo ""