🌍 English | 简体中文

IndieShow

IndieShow: 🚀 Boilerplate and Starter for indie Product Show for Nuxt 3, Tailwind CSS, and TypeScript.

Crafted with a focus on developer experience: 🖥️ Nuxt 3 + 🛠️ TypeScript + 🎨 Tailwind CSS + 🌐 i18n + 📄 markdown-it + 🔍 ESLint + 🧩 simple-git-hooks + 🧹 Lint-Staged + 📝 Commitlint + ☁️ Vercel. Launch your global-ready web app with a sleek, performant, and SEO-optimized foundation.

💡 Project Overview

IndieShow is a product showcase website template designed specifically for indie developers. Built with Nuxt 3 + TailwindCSS + TypeScript, you can create a professional product showcase website in minutes with simple configuration!

🎯 Use Cases

• 🏢 Product showcase for startups
• 👨‍💻 Portfolio for indie developers
• 🛠️ Quick start template for development

⚡ Performance

Test Item	Score	Baseline
Google PageSpeed (Mobile)	94	> 90
Google PageSpeed (Desktop)	99	> 90

Mobile Performance

Desktop Performance

🌈 Live Demo

• Demo Site: https://indieshow-nuxt.waveany.com
• Documentation: View Docs
• Other Branches: If you need to set up a website for payment capability review with Stripe, Paddle, or other payment processors, you can use the Pricing Branch

🛠️ Tech Stack

📦 Project Structure

IndieShow/
├── components/        # Components Directory
│   ├── blocks/       # Block Components (Hero, Feature, ShowCase, CTA)
│   ├── common/       # Common Components (Theme Switch, Language Switch)
│   ├── layout/       # Layout Components (Header, Footer)
│   └── ui/           # UI Components (Back to Top, Progress Bar, QR Code Modal, etc.)
├── composables/      # Composables
│   ├── useLocale     # Language Switch
│   ├── useMarkdown   # Markdown Parser
│   └── useSeo        # SEO Optimization
├── config/           # Configuration Files
│   ├── nav          # Navigation Menu
│   ├── seo          # SEO Configuration
│   ├── showcase     # Work Showcase
│   ├── social       # Social Links
│   └── theme        # Theme Configuration
├── i18n/            # Internationalization
│   ├── en/          # English Language Pack
│   ├── zh/          # Chinese Language Pack
│   └── config.ts    # i18n Configuration
├── layouts/         # Layout Templates
├── pages/           # Page Files
│   ├── group.ts       # User Group Page
│   ├── index.ts       # Home Page
│   ├── privacy.ts     # Privacy Policy Page
│   ├── sales.ts       # Sales Terms Page
│   ├── terms.ts       # Terms of Service Page
├── plugins/         # Plugins Directory
│   └── analytics-google.client.ts  # Google Analytics
├── public/          # Static Assets
└── types/           # Type Definitions

✨ Core Features

🚀 Development Experience

• Using latest dependency versions with continuous updates
• Clean and elegant code with Composition API and <script setup>
• Complete TypeScript type support
• Integrated antfu/eslint-config for consistent code style

🎨 UI Design

• Responsive design based on TailwindCSS
• Light/Dark theme with system theme following
• Beautiful transitions and page effects
• Customizable theme colors

🌍 Internationalization

• English and Chinese support, easily extensible
• Automatic browser language detection
• Simple configuration, instant translation updates
• Automatic language prefix in URLs

📱 Multi-platform Adaptation

• Perfect adaptation for mobile and desktop
• PWA support, installable to home screen
• Optimized interaction for different devices

🔍 SEO Optimization

• SSR support based on Nuxt 3
• Automatic sitemap.xml generation
• Static page pre-rendering
• Complete Meta tag support
• Customizable page titles and descriptions

⚡️ Performance Optimization

• Automatic code splitting
• Smart component preloading
• Automatic image optimization
• On-demand icon loading

🚀 Quick Start

Requirements

• Node.js ≥ 18.0
• pnpm ≥ 8.0

Development Process

1. Clone Project

git clone https://github.com/WaveAny/IndieShow-Starter-Nuxt.git
cd IndieShow
pnpm install

2. Configure Environment Variables

cp .env.example .env

3. Start Development Server

pnpm dev

4. Build and Deploy

# Build for production
pnpm build

# Preview production build
pnpm preview

5. One-Click Deploy

Recommended deployment with Vercel:

🤔 FAQ

1. How to customize themes?

Edit config/theme.ts file:

export const themeColors = {
  primary: {
    color: "indigo",
    hex: "#4f46e5",
    gradient: {
      dark: "#6366f1",
    },
  },
  gray: {
    color: "zinc",
  },
}

📄 License

This project is licensed under the MIT License.

🙏 Acknowledgments

• Nuxt 3 - Vue.js Full-stack Framework
• Vue 3 - Progressive JavaScript Framework
• Tailwind CSS - Utility-First CSS Framework

📮 Contact

• GitHub Issues: Submit Issues
• Email: suppore@waveany.com

📈 Project Statistics''

''

🎨 Theme Preview

Light Theme

Dark Theme

📈 Star History