Database Studio App 🚀

Database Studio App is a high-performance, full-stack database management and visualization tool. Designed for developers and database administrators, it provides a modern, intuitive interface to explore, analyze, and document your MySQL databases with ease.

🌟 Key Features

📊 Interactive Database Viewer

Explore your data with a high-speed, paginated data table. View real-time records from your MySQL tables with a clean, responsive interface.

📐 Visual Schema Explorer

Visualize your entire database architecture at a glance. Our grid-based Schema View transforms complex table relationships into beautiful, interactive cards with dynamic color-coding.

📄 Professional PDF Documentation

Generate high-fidelity database schema reports with a single click. Powered by Puppeteer server-side rendering, our exports ensure 100% style accuracy and a professional A4 print layout.

🔐 Enterprise-Grade Security

• Machine-ID Binding: Licenses are securely tied to unique hardware identifiers.
• JWT Authentication: Secure session management using JSON Web Tokens and HTTP-only cookies.
• RSA-256 Verification: Offline license verification using public/private key pairs.

🛠️ Developer-First Experience

• Customizable Layout: Toggle between 1-4 column grid views.
• View Switching: Seamlessly jump between raw data and architectural schemas.
• Fast Search: Quickly find the tables and columns you need.

🚀 Quick Start

Prerequisites

• Node.js: v18 or higher
• pnpm: Recommended package manager
• MySQL: Access to a running MySQL instance

Installation

# Install dependencies
pnpm install

# Build the application
pnpm build

Environment Configuration

Create a .env file in the root of the studio-app directory:

MYSQL_URL=mysql://user:password@localhost:3306/your_database

💻 Tech Stack

• Frontend: React 18, React Router 6, Tailwind CSS 3
• Backend: Express 5, Puppeteer
• UI Components: Radix UI, Lucide Icons
• Database: MySQL
• Build System: Vite, tsup

🏗️ Project Architecture

client/            # Modern React SPA
├── components/    # Reusable UI & Logic components
├── pages/         # Route-level components
└── lib/           # Utilities and API wrappers

server/            # Express API & Documentation Engine
├── index.ts       # Main entry point with License & PDF logic
└── config.ts      # Server configuration

bin/               # CLI tools for global linking

📑 PDF Export Engine

Our export engine doesn't just "print" the page. It uses a sophisticated server-side flow:

1. Headless Navigation: Puppeteer visits a specialized ?export=true route.
2. Adaptive CSS: The app re-renders specifically for print, enforcing a single-column layout and hiding interactive elements.
3. True Fidelity: Captures full Tailwind colors and styles into a multi-page A4 PDF.

🔒 License & Security

This application requires a valid license key for operation. The licensing system uses RSA-256 signatures to ensure integrity and Machine-ID hashing to prevent unauthorized distribution.

Part of the Database Studio Workspace.