DEVice Dashboard

A free, fast, and privacy-friendly collection of essential tools for developers — all in one place. No signup, no tracking, everything runs in your browser.

Built with Next.js 15, React 19, TypeScript, Tailwind CSS v4, and shadcn/ui.

Features

• 38+ developer tools organized by category
• Dark / light theme with next-themes
• Multi-language support (i18n) with a built-in language toggle
• Recent tools tracking for quick access
• SEO optimized — sitemap, robots.txt, OpenGraph, JSON-LD schema
• Fully responsive layout with sidebar navigation
• Client-side only — your data never leaves your browser

Tools Included

Data & Formatters

JSON Prettifier · XML Formatter · YAML ↔ JSON · CSV ↔ JSON · SQL Formatter · Markdown Preview

Encoders & Converters

Base64 Encoder/Decoder · URL Encoder/Decoder · JWT Decoder · String Escape/Unescape · Number Base Converter · JS ↔ TS Converter · Image to Base64

Generators

UUID Generator · Password Generator · Hash Generator · QR Code Generator · Lorem Ipsum · Slug Generator · Color Palette · README Generator · .gitignore Generator · Meta Tag Generator

Text & Code

Text Case Converter · Word & Character Counter · Regex Tester · Diff Viewer · Cron Expression Parser

Images

Image Compressor · Image Resizer · Color Picker

Utilities

Time Converter · Timezone Converter · Pomodoro Timer · HTTP Status Codes · GitHub Stats Viewer · .env Editor

Getting Started

Install dependencies and run the dev server:

npm install
npm run dev

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

Scripts

Command	Description
npm run dev	Start the development server
npm run build	Build for production
npm run start	Start the production server
npm run lint	Run ESLint

Project Structure

src/
├── app/              # Next.js app router (layout, pages, sitemap, robots)
│   └── tool/[slug]/  # Dynamic tool pages
├── components/
│   ├── layout/       # Header, Sidebar, theme & language toggles
│   └── ui/           # shadcn/ui primitives
├── tools/            # Each tool lives in its own folder (index.tsx + utils.ts)
├── lib/              # tools registry, i18n, recent tools, helpers
└── hooks/            # Custom hooks (e.g. useCopy)

Adding a new tool is as simple as creating a folder under src/tools/<slug>/ and registering it in src/lib/tools.ts.

Tech Stack

• Next.js 15 (App Router)
• React 19
• TypeScript
• Tailwind CSS v4
• shadcn/ui + Radix UI
• Lucide Icons
• next-themes

Deployment

Deploy instantly on Vercel. Set NEXT_PUBLIC_SITE_URL in your environment to your production URL so SEO metadata and the sitemap point to the right host.

License

Private project — all rights reserved.