🛠️ DevKit

Your Swiss Army Knife for Developer Utilities

DevKit is a blazingly fast, beautifully crafted collection of essential developer tools. Convert, encode, decode, and transform data with ease—all in one sleek web application.

---

✨ Features

• 🔄 Multiple Converters - Binary, Base64, Hexadecimal, and URL encoding/decoding
• 🎨 80+ Encodings - UTF-8, Latin1, Shift-JIS, GBK, ISO-8859, Windows-125x, and more
• 🌙 Dark Mode - Beautiful dark theme with system preference detection
• ⚡ Lightning Fast - Built with Vite for instant hot module replacement
• 🎯 Type-Safe - 100% TypeScript for bulletproof code
• 📱 Responsive - Beautiful UI that works on all devices
• ♿ Accessible - Built with React Aria Components for WCAG compliance

---

🚀 Quick Start

Prerequisites

• Node.js 18+
• npm or pnpm

Installation

# Clone the repository
git clone https://github.com/yourusername/devkit.git

# Navigate to project
cd devkit

# Install dependencies
npm install

# Start development server
npm run dev

Visit http://localhost:5173 and start converting! 🎉

---

🏗️ Tech Stack

DevKit is built with modern, cutting-edge technologies:

• ⚛️ React 19 - UI library
• 🎯 TypeScript 5.9 - Type safety
• ⚡ Vite 7 - Build tool & dev server
• 🎨 Tailwind CSS v4 - Utility-first styling
• 🧭 TanStack Router - Type-safe file-based routing
• 📝 TanStack Form - Powerful form management with validation
• 🔍 TanStack Query - Data fetching and caching
• 🎭 React Aria Components - Accessible UI primitives (WCAG compliant)
• 🔤 iconv-lite - 80+ character encoding support
• 🎨 Class Variance Authority - Component variant system
• ✅ Zod - Schema validation

---

📦 Project Structure

devkit/
├── src/
│   ├── components/       # Reusable UI components
│   │   ├── form/        # Form components (Select, TextArea, Button, etc.)
│   │   ├── Header.tsx   # Navigation header
│   │   └── Layout.tsx   # Page layout wrapper
│   ├── lib/             # Utilities & helpers
│   │   ├── encoding.ts  # Text/binary conversion logic
│   │   └── queryClient.ts
│   ├── routes/          # Route components
│   └── main.tsx         # Application entry point
├── public/              # Static assets
└── vite.config.ts       # Vite configuration

---

🎯 Roadmap

✅ Completed

• Text to Binary Converter
• Base64 Encoder/Decoder
• Hexadecimal Encoder/Decoder
• URL Encoder/Decoder
• Multi-encoding support (80+ encodings)
• Composable form components
• Dark Mode with system preference
• Type-safe routing with TanStack Router
• Accessible UI with React Aria

🚧 In Progress

• Conversion History
• Favorites / Bookmarks
• Improved Home Page

📋 Planned

• JWT Decoder & Validator
• Hash Generators (MD5, SHA-256, etc.)
• JSON Formatter & Validator
• Regex Tester
• UUID Generator
• Color Converter
• PWA Support
• Offline Mode

---

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the project
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

---

📝 License

This project is licensed under the MIT License—see the LICENSE file for details.

---

💖 Acknowledgments

• Built with love and caffeine ☕
• Inspired by CyberChef, RapidTables, and developer pain points
• Special thanks to the open-source community

---

🌟 Star History

If you find DevKit useful, please consider giving it a star! ⭐

---

DevKit—Crafted with precision and care
Making developer tools beautiful, one converter at a time.