ONE DESKTOP.
ALL DEV WORKFLOWS.

An all-in-one desktop application built for frontend developers who want deep focus: code, process data, and manage personal productivity without jumping across browser tabs.

Download for Mac Go To Repository

The Story

From Tab Chaos To A Personal Desktop Laboratory

As a developer, I used to open dozens of browser tabs every day: CodePen for UI testing, format converter websites for JSON and SCSS, and Notion for task management. This fragmented workflow constantly broke my deep-work state.

Instead of relying on disconnected external tools, I decided to build my own desktop laboratory - one place that brings together everything I need for daily frontend work.

What It Delivers

A Complete Desktop Solution

Designed to solve daily frontend tasks from live coding and data processing to personal productivity management in a single desktop app.

Data Processing Hub

SCSS Compiler

Input SCSS

$primary: #6366f1; 
.card { 
  background: $primary; 
  padding: 20px;
  &:hover { opacity: 0.8; }
}

Output CSS

/* Output appears here... */

JSON Toolkit

Minify, parse, and transform JSON into useful formats.

{"id":1,"user":"DuyAnh","role":"Frontend Dev","tools":["SCSS","JS","CMS"]}

Cloud-Synced Playground

A CodePen-style live coding environment designed to sync snippets with Supabase and your CMS.

HTML

<div class="blob">
  <h1 id="greeting">Loading...</h1>
</div>

CSS

body { 
  background: #030712; 
  display: grid; place-items: center; 
  height: 100vh; margin: 0;
}
#greeting { 
  font-family: sans-serif; 
  font-size: 2rem; 
  background: linear-gradient(to right, #6366f1, #a855f7); 
  -webkit-background-clip: text; 
  -webkit-text-fill-color: transparent; 
}
.blob {
  padding: 40px;
  background: rgba(255,255,255,0.05);
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,0.1);
}

const el = document.getElementById('greeting');
el.innerText = "DESKTOP LAB READY 🚀";

Productivity Ecosystem

To optimize daily workflow, this desktop suite extends beyond coding with practical productivity tools:

Block-based note system inspired by Notion
Clipboard history manager for fast reuse
Rule-based virtual assistant that can generate leave-request forms automatically

Technology

Built With Practical Web Technologies

This desktop app is powered by HTML, CSS, JavaScript, Supabase, and CMS to deliver a fast, flexible, and developer-centric experience.

HTML5 Tailwind CSS JavaScript ES6 Supabase Desktop Wrapper

ONE DESKTOP. ALL DEV WORKFLOWS.