Examples

Explore real-world examples of VanisherJS in action. These examples demonstrate various use cases and implementation patterns.

Basic Examples

Basic Usage - Simple HTML Implementation

Learn the fundamentals with a basic HTML page that demonstrates core VanisherJS functionality.

Script Tag Demo - CDN Implementation

See how to use VanisherJS without a package manager using script tags and CDN.

Framework Integration

React Integration - React Component Usage

Explore how to integrate VanisherJS with React applications using the React wrapper component.

Next.js Integration - Next.js Component Usage

Learn how to use VanisherJS with Next.js applications, including SSR considerations.

Advanced Scenarios

Advanced Scenarios - Complex Use Cases

Discover advanced patterns for complex applications, including dynamic deadlines and multiple instances.

Testing Examples

React Warning Test - Environment Detection

See how VanisherJS detects different environments and provides appropriate warnings.

Next.js Warning Test - Next.js Detection

Test the Next.js environment detection and fallback behavior.

Getting Started

Each example includes:

• Complete code - Ready to run implementations
• Step-by-step explanations - Understand how each part works
• Best practices - Learn recommended patterns
• Troubleshooting tips - Common issues and solutions

Running Examples

Local Development

# Clone the repository
git clone https://github.com/kiron0/vanisher.git

# Navigate to examples
cd vanisher/packages/examples

# Open in your browser
open basic-usage.html

Online Demos

Visit the VanisherJS website for live examples and interactive demos.

Contributing Examples

Have a great example? We'd love to see it! Submit a pull request with your example code and documentation.

Next Steps

• Guide - Comprehensive usage guide
• API Reference - Complete API documentation
• Installation - Get started with VanisherJS