An interactive presentation showcasing Claude Code features and capabilities, built with Vue 3 and Vite.

This is a slide-based presentation application that demonstrates Claude Code's features including memory system, slash commands, subagents, GitHub integration, and various use cases across different roles.

• Interactive Navigation: Navigate slides using keyboard (arrow keys, space, page up/down) or mouse wheel
• Dark/Light Theme: Toggle between dark and light modes with persistent preference
• Slide Memory: Automatically remembers your current slide position
• Smooth Transitions: Custom slide transitions with directional animations
• Responsive Design: Optimized for various screen sizes

• Node.js (v14 or higher)
• npm or yarn

# Clone the repository
git clone <repository-url>
cd claude-code

# Install dependencies
npm install

# Start development server on port 8080
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

claude-code/
├── src/
│   ├── main.js              # Application entry point
│   ├── style.css            # Global styles and Tailwind imports
│   ├── components/
│   │   ├── PresentationSlider.vue  # Main slider controller
│   │   └── slides/          # Individual slide components
│   │       ├── Slide1.vue   # Title slide
│   │       ├── Slide2.vue   # Memory system
│   │       └── ...          # Additional slides
│   └── assets/              # Static assets
├── index.html               # HTML entry point
├── package.json            # Dependencies and scripts
├── vite.config.js          # Vite configuration
├── tailwind.config.js      # Tailwind CSS configuration
└── CLAUDE.md              # Project guidelines for Claude Code

• Vue 3: Progressive JavaScript framework with Composition API
• Vite: Next-generation frontend tooling
• Tailwind CSS: Utility-first CSS framework with dark mode support
• Heroicons: Beautiful hand-crafted SVG icons
• PostCSS: CSS processing with nested rules support

The presentation covers the following Claude Code features:

1. Introduction: Welcome and overview
2. Memory System: How Claude Code maintains context
3. Slash Commands: Quick actions and productivity tools
4. Subagents: Specialized task delegation
5. GitHub Integration: Seamless version control
6. Tools & MCP: Model Context Protocol and tool ecosystem
7. Best Practices: Tips for effective usage
8. Roadmap: Future developments
9. ACP: Anthropic Claude Platform
10. Use Cases: Role-specific demonstrations for:
    • Product Managers
    • Business Analysts
    • CTOs
    • Marketing Managers
    • QA Engineers
11. Custom MCP: Building custom integrations
12. Context Engineering: Advanced prompt optimization

See CLAUDE.md for detailed development guidelines and code style conventions.