AB Tools - Kumpulan Tools Online

Website kumpulan tool kecil (calculator, converter, generator, dsb) yang berjalan secara instan dan efisien di browser Anda. Dibangun menggunakan Next.js 14 (App Router) + TypeScript + Tailwind CSS.

Fitur Utama

• Client-Side Processing: Mayoritas alat memproses data secara lokal di browser, menjamin privasi tinggi tanpa perlu mengirimkan file/data ke server.
• Performa Cepat: Antarmuka responsif tanpa loading screen di setiap navigasi.
• Desain Modern: Memanfaatkan sistem desain "abtools/workbench", menampilkan estetika elegan dan gelap layaknya panel alat ukur analog.

Menjalankan Secara Lokal

Untuk menjalankan AB Tools di komputer lokal Anda, ikuti langkah berikut:

npm install
npm run dev

Buka http://localhost:3000 di browser Anda untuk melihat AB Tools.

Untuk melakukan build versi produksi:

npm run build
npm run start

Arsitektur Proyek

Struktur folder utama dirancang agar rapi dan mudah untuk penambahan skala tool:

app/
  layout.tsx              -> Layout global (Font, Navbar, Footer)
  page.tsx                -> Homepage dengan UI Grid ToolExplorer
  tools/[slug]/page.tsx    -> Render tool otomatis berdasarkan slug di registry
components/
  ui/                      -> Komponen pendukung (Button, Input, Card, dll.)
  tool-layouts/            -> Layout konsisten (SimpleIOLayout, VisualEditorLayout)
  tools/                   -> Komponen spesifik untuk masing-masing tool
lib/
  tools-registry.ts        -> Satu sumber kebenaran (Source of Truth) untuk data tool

Kategori Tool Tersedia

AB Tools menyediakan lusinan tool praktis yang terbagi dalam beberapa kategori:

• Developer: JSON Formatter, Base64 Encoder, JWT Decoder, Regex Tester, Minifier, dll.
• Desain: Color Picker, Gradient Generator, Box Shadow, Favicon Generator, dll.
• Utilitas: Unit Converter, Pomodoro Timer, Stopwatch, Kalkulator Umur, dll.
• Menulis: Word Counter, Markdown Editor, Text Diff, Case Converter, dll.
• Media: Image Compressor, Resizer, Image to Base64, PDF to Image.
• Keamanan: Hash Generator, Password Generator, Bcrypt & HMAC Generator.
• Jaringan: IP Lookup, Whois Lookup, DNS Lookup, SSL Checker (melalui API).

Cara Menambah Tool Baru

AB Tools didesain agar sangat modular:

1. Tambahkan entri detail tool Anda di lib/tools-registry.ts (termasuk slug, nama, dan status ready).
2. Buat komponen React baru di dalam folder components/tools/NamaTool.tsx. Sebaiknya gunakan wrapper SimpleIOLayout atau VisualEditorLayout yang sudah disediakan agar tampilannya seragam.
3. Daftarkan komponen tersebut ke componentMap pada components/tools/ToolRenderer.tsx.

Sistem akan otomatis mengatur routing URL dan menampilkannya di halaman pencarian grid homepage.

Lisensi

Proyek ini didistribusikan di bawah Lisensi MIT. Anda bebas untuk menggunakan, menyalin, memodifikasi, dan mendistribusikan ulang proyek ini. Lihat file LICENSE (jika ada) untuk detail lebih lanjut.

Penyangkalan (Disclaimer)

Seluruh modul dan alat yang disediakan dalam AB Tools dibuat untuk tujuan edukasi, utilitas, dan kemudahan pengembangan (development). Segala bentuk penyalahgunaan yang melanggar hukum, merugikan pihak lain, atau digunakan untuk aktivitas ilegal adalah tanggung jawab penuh dari masing-masing pengguna. Tim pengembang dan kontributor proyek ini tidak bertanggung jawab atas kerugian atau masalah yang timbul dari penyalahgunaan aplikasi ini.