A comprehensive collection of developer tools built with modern web technologies. This project aims to provide free, fast, and reliable tools for developers.
This project is built with modern web technologies and best practices:
- Framework: Next.js 15 with App Router
- Language: TypeScript
- Styling: Tailwind CSS
- Component Library: shadcn/ui
- Form Validation: Zod
- Authentication: NextAuth.js
- Internationalization: next-intl
- State Management: React Hook Form
- HTTP Client: Axios
- Analytics: Vercel Analytics
- Ads Integration: Google AdSense
- Code Quality: ESLint, Prettier
- Git Hooks: Husky
- CI/CD: GitLab CI
- Containerization: Docker
.
├── app/
│ └── [locale]/ # Internationalized routes
│ ├── privacy-policy/ # Privacy policy page
│ ├── contact-us/ # Contact us page
│ ├── layout.tsx # Root layout with providers
│ ├── page.tsx # Homepage
│ └── tools/ # Developer tools
│ └── json/ # JSON tools
│ ├── formatter/ # JSON formatter tool
│ ├── validator/ # JSON validator tool
│ ├── diff/ # JSON diff tool
│ └── minifier/ # JSON minifier tool
│ └── converters/ # Conversion tools
│ └── base64/ # Base64 converter tool
│ └── json-to-java-bean/ # JSON to Java Bean converter tool
│ └── md2html/ # Markdown to HTML converter tool
│ └── dev/ # Developer tools
│ ├── regex/ # Regex tester tool
│ ├── app-icon-generator/ # App icon generator tool
│ └── ai-sql-generator/ # AI SQL generator tool
│ └── seo/ # SEO tools
│ ├── og-image/ # OG image generator tool
│ └── meta-tags/ # Meta tags generator tool
│ └── text/ # Text tools
│ └── text-formatter/ # Text formatter tool
│
├── components/
│ ├── tools/
│ │ ├── json-formatter # JSON formatter component
│ │ ├── json-validator # JSON validator component
│ │ ├── json-diff # JSON diff component
│ │ ├── json-minifier # JSON minifier component
│ │ ├── base64 # Base64 converter component
│ │ ├── regex # Regex tester component
│ │ ├── og-image # OG image generator component
│ │ ├── meta-tags # Meta tags generator component
│ │ ├── text-formatter # Text formatter component
│ │ ├── app-icon-generator # App icon generator component
│ │ ├── ai-sql-generator # AI SQL generator component
│ │ ├── json-to-java-bean # JSON to Java Bean converter component
│ │ └── md2html # Markdown to HTML converter component
│ ├── layouts/
│ │ └── tool-layout # Common tool layout
│ └── ui/ # UI Components
│ ├── shadcn # shadcn components
│
├── lang/ # i18n translations
│ ├── en/
│ │ ├── common.json
│ │ └── json.json
│ │ └── converters.json
│ │ └── dev.json
│ │ └── seo.json
│ │ └── changelog.json
│ │ └── terms.json
│ ├── zh-CN/
│ │ └── common.json
│ │ └── json.json
│ │ └── converters.json
│ │ └── dev.json
│ │ └── seo.json
│ │ └── changelog.json
│ │ └── terms.json
│ ├── zh-HK/
│ │ └── common.json
│ │ └── json.json
│ │ └── converters.json
│ │ └── dev.json
│ │ └── seo.json
│ │ └── changelog.json
│ │ └── terms.json
├── providers/
│ └── toast-provider.tsx # Toast notifications provider
│ └── search-provider.tsx # Search provider
│
├── types/
│ └── next-auth.d.ts # NextAuth type definitions
│ └── tool.d.ts # Tool type definitions
│
├── middleware.ts # Next.js middleware
├── tsconfig.json # TypeScript configuration
└── .env.example # Environment variables template
- Project initialization with Next.js 15
- Core layout implementation
- Ad space integration
- Analytics setup
- Error tracking
- Performance monitoring
- Responsive layout
- Ad integration spaces
- Analytics setup
- Basic SEO structure
- Error tracking
- Performance monitoring
- JSON Formatter
- Format/Validate functionality
- Copy/Download options
- JSON Validator
- Format/Validate functionality
- Copy/Download options
- JSON Diff
- Compare functionality
- Export result as JSON/CSV
- Fix the table display issue
- JSON Minifier
- Minify functionality
- Copy/Download options
- JSON Parser & Stringify: Convert between JSON strings and JavaScript objects with support for:
- Parse JSON strings into formatted objects
- Stringify JavaScript objects with custom indentation
- Unicode character escaping
- Validation and error handling
- Base64 Encoder/Decoder
- Text encoding/decoding
- File encoding/decoding
- URL-safe encoding
- Markdown to HTML
- JSON to Java Bean
- CSV to JSON
- QR Code Generator
- YAML to JSON
- XML to JSON
- HEX Color Converter
- Regular Expression Tester
- Live testing
- Common patterns library
- Match highlighting
- CSS Formatter/Minifier
- HTML Formatter/Validator
- Tailwind Config Generator
- App Icon Generator
- AI SQL Generator
- JWT Decoder/Encoder
- URL Encoder/Decoder
- Unix Timestamp Converter
- Meta Tags Generator
- Robots.txt Generator
- XML Sitemap Generator
- SEO Analyzer
- OG Image Generator (Open Graph Image)
- Support batch generation
- Support crop / resize
- Social Media Image Size Generator
- Google Analytics Checker
- Schema Markup Generator
- Text Formatter
- Case Converter
- Word Counter
- Markdown Editor
- Random Data Generator
- Lorem Ipsum Generator
- Text Diff Checker
- Strategic ad placement
- Technical blog posts
- Twitter/social presence
- DEV.to articles
- GitHub readme tools
- Tool suggestions
- Recently used tools
- Save preferences (dock)
- Dock drop out remove tool bug (Not able to remove tool from dock)
- Share configurations
- Mobile menu
- Search tool
Based on developer demand and usage patterns, here are additional tools that would provide significant value:
- Code Formatter (Multiple Languages)
- Code Minifier (JavaScript, CSS, HTML)
- Code Diff Viewer
- Snippet Manager
- HTTP Request Builder
- API Documentation Generator
- Mock API Server
- GraphQL Query Builder
- Password Generator
- Hash Generator (MD5, SHA, etc.)
- SSL Certificate Checker
- CORS Header Validator
- Website Speed Test
- Image Optimizer
- Bundle Size Analyzer
- CDN Checker
next: ^15.0.3react: 19.0.0-rc.1react-dom: 19.0.0-rc.1typescript: ^5.xnext-auth: ^4.24.7next-intl: ^3.23.5
@radix-ui/*: UI primitivestailwindcss: ^3.4.14class-variance-authority: ^0.7.1clsx: ^2.1.1tailwind-merge: ^2.3.0lucide-react: ^0.372.0
zod: ^3.23.8react-hook-form: ^7.53.2@hookform/resolvers: ^3.9.1
prettier: ^3.2.5eslint: ^8.xhusky: ^9.0.11typescript: ^5.x
# Install dependencies
pnpm install
# Start development server
pnpm dev# Build Docker image
docker build -t dev-tools-hub .
# Run Docker container
docker run -p 3000:3000 dev-tools-hubCreate a .env.local file:
NEXT_PUBLIC_API_URL=your_api_url
NEXT_PUBLIC_GA_ID=your_google_analytics_id
NEXT_PUBLIC_ADSENSE_ID=your_adsense_id
NEXT_PUBLIC_BASE_URL=your_base_url
OPENROUTER_API_KEY=your_openrouter_api_key
# Add other environment variablesSee CONTRIBUTING.md