📝 Clixo — Secure Text Sharing & Ephemeral Markdown Editor

🌐 Open Live Production App • Report Issue

Clixo is a modern, privacy-focused text sharing platform and live Markdown editor. Engineered for developers, writers, and security-conscious individuals, Clixo lets you create, format, and securely distribute notes with real-time cloud database synchronization, cryptographic password locking, and self-destructing expiration timers.

---

✨ Key Features

• 🔒 Cryptographic Password Protection: Restrict reading and editing access with password authentication. Protect sensitive code snippets, credentials, or private drafts.
• ⏱️ Ephemeral Self-Destruct Timers: Configure custom note lifespans (1 min, 5 min, 15 min, 1 hour, 4 hours, 24 hours). Once the countdown expires, notes are permanently purged from both cloud and client stores.
• 🌐 Real-Time Database Sync (Supabase): Powered by PostgreSQL on Supabase for cross-device syncing, paired with local-first localStorage caching for zero-latency offline editing.
• ✍️ Dual-Pane Live Markdown Studio: Write with a full Markdown formatting toolbar (bold, italic, code blocks, tables, task lists) and view immediate live side-by-side rendered output.
• 🎨 Glassmorphic Cyber Aesthetics: Built with Tailwind CSS and modern CSS variables, featuring ambient glowing backgrounds, smooth transitions, and seamless Dark/Light theme switching.
• 📤 Instant Sharing & Export: Generate clean shareable URLs, copy formatted text with one click, or export notes as .txt and .md files.

---

🛠️ Technology Stack

Layer	Technologies
Frontend Framework	React 19, JavaScript (ES6+), Vite
Styling & Design	Tailwind CSS v3, Glassmorphism, CSS Variables
Routing	React Router v7
Backend & Database	Supabase Client SDK (@supabase/supabase-js), PostgreSQL
Markdown Parsing	React Markdown, Remark GFM, Syntax Highlighting
Icons & UI	Lucide React Icons

---

📁 Project Structure

clixo-c2p-app/
├── public/                 # Static assets, favicons, vector icons
├── assets/                 # Showcase banner & documentation previews
│   └── preview.png
├── src/
│   ├── components/         # Reusable UI modals and editor panes
│   │   ├── ExpirationModal.jsx # Self-destruct timer selector
│   │   ├── PasswordModal.jsx   # Passcode lock configuration
│   │   ├── ShareModal.jsx      # Link sharing & copy tools
│   │   └── MarkdownPreview.jsx # GFM-rendered preview pane
│   ├── context/            # React Context (ThemeContext, etc.)
│   ├── hooks/              # Custom hooks (useNotes, local caching)
│   ├── lib/                # Supabase client initialization
│   ├── pages/
│   │   ├── HomePage.jsx    # Notes dashboard & recent history
│   │   └── EditorPage.jsx  # Dual-pane Markdown editor
│   ├── App.jsx             # Top-level routing
│   └── main.jsx            # Application entrypoint
├── tailwind.config.js      # Custom theme & color token config
└── vite.config.js          # Vite build pipeline

---

🚀 Getting Started

Prerequisites

• Node.js (v18 or higher)
• npm or pnpm

Quick Setup

1. Clone the repository:

   git clone https://github.com/codexanjan/clixo-c2p-app.git
   cd clixo-c2p-app

2. Install dependencies:

   npm install

3. Configure Environment Variables: Create a .env file in the project root:

   VITE_SUPABASE_URL=https://your-supabase-id.supabase.co
   VITE_SUPABASE_ANON_KEY=your_supabase_anon_key

4. Start the local development server:

   npm run dev

   Open http://localhost:5173 in your browser.

5. Build for production:

   npm run build

---

📄 License

Distributed under the MIT License. See LICENSE for more information.

---

---

Made with ❤️ by Anjan Shetty