PasteDown is a modern, distraction-free Markdown paste service where users can create and share Markdown content via unique URLs. It offers real-time previewing with enhanced Markdown support including math equations (KaTeX) and diagrams (Mermaid).

• Distraction-Free Editing: Clean, minimal interface for writing Markdown content
• Live Preview: Real-time preview of your Markdown as you type, with synchronized scrolling
• Enhanced Markdown Support:
  • Math equations via KaTeX
  • Diagrams via Mermaid
  • SmartyPants typography for smart quotes and dashes
• Responsive Design: Optimized for both desktop and mobile devices
• Unique URLs: Each paste gets a short, unique URL for easy sharing
• Auto-Expiration: Pastes automatically expire after 3 days
• Rate Limiting: Protection against abuse (5 requests per hour per IP)
• Dark/Light Mode: Toggle between dark and light themes

• Framework: Next.js 14 (App Router)
• Styling: Tailwind CSS
• UI Components: shadcn/ui
• Markdown Rendering: React Markdown
• Math Rendering: KaTeX via rehype-katex
• Diagram Rendering: Mermaid via remark-mermaid-plugin
• ID Generation: nanoid
• Animations: Framer Motion
• Form Handling: React Hook Form
• Validation: Zod
• Notifications: Sonner

• Node.js (v20+ recommended)
• npm, yarn, or pnpm

1. Clone the repository:

   git clone https://github.com/adhishthite/PasteDown.git
   cd PasteDown

2. Install dependencies:

   npm install
   # or
   yarn install
   # or
   pnpm install

3. Run the development server:

   npm run dev
   # or
   yarn dev
   # or
   pnpm dev

4. Open http://localhost:3000 in your browser to see the app.

1. Visit the landing page at http://localhost:3000
2. Type or paste your Markdown content in the editor
3. View the live preview on the right (or switch tabs on mobile)
4. Click "Create Paste" when you're ready to share

• Visit the paste's unique URL (e.g., http://localhost:3000/abc123)
• The Markdown will be rendered as HTML
• Use the buttons to copy the content or share the URL

PasteDown supports standard Markdown syntax plus:

# Math Equations (KaTeX)

$E = mc^2$

# Diagrams (Mermaid)

```mermaid
graph TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Action]
    B -->|No| D[Another Action]
```

• Pastes are stored in-memory with simulated TTL for the MVP (would use MongoDB in production)
• Rate limiting is implemented to prevent abuse (5 requests per hour per IP)
• Responsive design adapts to different screen sizes:
  • Desktop: Side-by-side editor and preview
  • Mobile: Tab-based interface to switch between editor and preview
• Synchronized scrolling between editor and preview for better UX

PasteDown/
├── app/                   # Next.js App Router pages and API routes
│   ├── [id]/              # Dynamic paste viewing route
│   ├── api/               # API endpoints
│   │   └── paste/         # Paste creation and retrieval
├── components/            # React components
│   ├── ui/                # shadcn/ui components
│   └── ...                # Custom components
├── hooks/                 # Custom React hooks
├── lib/                   # Utility functions
├── public/                # Static assets
├── styles/                # Global styles
└── types/                 # TypeScript type definitions

• User accounts for paste management
• Custom expiration times
• Private pastes with password protection
• Syntax highlighting for code blocks
• Paste forking/versioning
• Real database integration (MongoDB)

This project is open source and available under the MIT License.

• Next.js for the React framework
• TailwindCSS for the utility-first CSS
• shadcn/ui for the component library
• React Markdown for Markdown rendering
• nanoid for ID generation
• KaTeX for math equation rendering
• Mermaid for diagram rendering