GitHub - jundy779/FusionTik: A source code of the tiktok downloader website.

⚡ FusionTik

Modern TikTok Downloader — Video · Photo Mode · MP3

🌸 Overview

FusionTik adalah web application modern untuk mendownload konten TikTok tanpa watermark. Dibangun dengan Next.js 15 App Router, TypeScript, dan Tailwind CSS — FusionTik menawarkan pengalaman download yang cepat, bersih, dan responsif di semua perangkat.

Tidak perlu install aplikasi. Tidak perlu login. Cukup paste link TikTok, klik Download, dan simpan konten ke perangkatmu.

Built on Next.js • Powered by Supabase • Written in TypeScript

🏗️ Architecture Overview

graph TD
    A["User Browser - Paste TikTok URL"] -->|Submit Form| B["Next.js Frontend - app/page.tsx"]
    B -->|POST /api/tiktok| C["API Route Handler - Validate URL"]
    C -->|Try Provider 1| D["Zell API - apizell.web.id"]
    C -->|Fallback| E["Sanka API - sankavollerei.com"]
    D -->|Success| F["Parse Response - video, audio, images"]
    E -->|Success| F
    D -->|Fail| E
    E -->|All Fail| G["notifyProviderFailure - Alert System"]
    G --> H["Telegram Bot - Instant Alert"]
    G --> I["Email SMTP - Nodemailer"]
    G --> J["Webhook POST - Custom Endpoint"]
    F -->|JSON Response| B
    B -->|Show VideoPreview| K["Download UI - Progress Bar"]
    K -->|downloadWithProgress| L["TikTok CDN - Direct Download"]
    B -->|POST /api/global-stats| M["Global Counter - Increment"]
    M -->|Atomic RPC| N[("Supabase DB - global_stats")]
    M -->|Fallback| O[("JSON File - global-stats.json")]

    style A fill:#e3f2fd,stroke:#2196f3,stroke-width:3px,color:#0d47a1
    style B fill:#e8f5e9,stroke:#4caf50,stroke-width:3px,color:#1b5e20
    style C fill:#fff3e0,stroke:#ff9800,stroke-width:3px,color:#e65100
    style D fill:#f3e5f5,stroke:#9c27b0,stroke-width:3px,color:#4a148c
    style E fill:#e8eaf6,stroke:#3f51b5,stroke-width:3px,color:#1a237e
    style F fill:#e0f2f1,stroke:#00695c,stroke-width:3px,color:#004d40
    style G fill:#fce4ec,stroke:#e91e63,stroke-width:3px,color:#880e4f
    style H fill:#e8f5e9,stroke:#4caf50,stroke-width:2px,color:#1b5e20
    style I fill:#fff3e0,stroke:#ff9800,stroke-width:2px,color:#e65100
    style J fill:#e3f2fd,stroke:#2196f3,stroke-width:2px,color:#0d47a1
    style K fill:#fff8e1,stroke:#ff8f00,stroke-width:3px,color:#ff6f00
    style L fill:#efebe9,stroke:#795548,stroke-width:3px,color:#3e2723
    style M fill:#f5f5f5,stroke:#616161,stroke-width:2px,color:#424242
    style N fill:#d7ccc8,stroke:#5d4037,stroke-width:2px,color:#3e2723
    style O fill:#d7ccc8,stroke:#5d4037,stroke-width:2px,color:#3e2723

🧱 Software Architecture

FusionTik menggunakan Layered Architecture dengan pemisahan yang jelas antara Presentation, Application, dan Infrastructure layer.

Layer Overview

graph TB
    subgraph PRESENTATION["Presentation Layer - Client Side"]
        P1["app/page.tsx - Main Page"]
        P2["video-preview.tsx - Download UI"]
        P3["result-card.tsx - History Card"]
        P4["stats-card.tsx - Stats Display"]
        P5["navbar.tsx - Navigation"]
    end

    subgraph STATE["State Management Layer - React Hooks"]
        S1["use-download-history - localStorage"]
        S2["use-download-stats - Personal Stats"]
        S3["use-global-stats - Global Counter"]
    end

    subgraph APPLICATION["Application Layer - Next.js API Routes"]
        A1["POST /api/tiktok - Core Downloader"]
        A2["GET/POST /api/global-stats - Counter API"]
    end

    subgraph INFRASTRUCTURE["Infrastructure Layer"]
        I1["lib/supabase.ts - DB Client"]
        I2["lib/download-utils.ts - Download Engine"]
        I3["lib/utils.ts - Utilities"]
    end

    subgraph EXTERNAL["External Services"]
        E1["Zell API - Provider 1"]
        E2["Sanka API - Provider 2"]
        E3["Supabase DB - PostgreSQL"]
        E4["TikTok CDN - Media Files"]
        E5["Telegram API - Alerts"]
    end

    PRESENTATION --> STATE
    PRESENTATION --> APPLICATION
    APPLICATION --> INFRASTRUCTURE
    INFRASTRUCTURE --> EXTERNAL

    style PRESENTATION fill:#e3f2fd,stroke:#2196f3,stroke-width:2px
    style STATE fill:#e8f5e9,stroke:#4caf50,stroke-width:2px
    style APPLICATION fill:#fff3e0,stroke:#ff9800,stroke-width:2px
    style INFRASTRUCTURE fill:#f3e5f5,stroke:#9c27b0,stroke-width:2px
    style EXTERNAL fill:#efebe9,stroke:#795548,stroke-width:2px

Component Interaction Diagram

graph LR
    subgraph PAGE["app/page.tsx"]
        FORM["Form Input"]
        RESULT["Result Display"]
        HIST["History Section"]
        STATS["Stats Section"]
    end

    subgraph HOOKS["React Hooks"]
        UDH["useDownloadHistory"]
        UDS["useDownloadStats"]
        UGS["useGlobalStats"]
    end

    subgraph COMPONENTS["Components"]
        VP["VideoPreview"]
        RC["ResultCard"]
        SC["StatsCard"]
    end

    subgraph API["API Routes"]
        TK["POST /api/tiktok"]
        GS["GET/POST /api/global-stats"]
    end

    subgraph LIB["Libraries"]
        DU["download-utils"]
        SB["supabase client"]
    end

    FORM -->|submit| TK
    TK -->|response| RESULT
    RESULT --> VP
    VP --> DU
    HIST --> RC
    STATS --> SC
    PAGE --> UDH
    PAGE --> UDS
    PAGE --> UGS
    UDH -->|localStorage| UDS
    UGS -->|fetch| GS
    GS --> SB
    PAGE -->|increment| GS

    style PAGE fill:#e3f2fd,stroke:#2196f3
    style HOOKS fill:#e8f5e9,stroke:#4caf50
    style COMPONENTS fill:#fff3e0,stroke:#ff9800
    style API fill:#f3e5f5,stroke:#9c27b0
    style LIB fill:#efebe9,stroke:#795548

Data Flow Diagram

flowchart LR
    subgraph INPUT["Input"]
        URL["TikTok URL"]
    end

    subgraph VALIDATION["Validation"]
        REGEX["Regex Check - tiktok.com"]
    end

    subgraph FETCH["Data Fetching"]
        Z["Zell Provider"]
        S["Sanka Provider"]
        PARSE["Parse and Normalize - title, creator, videos, audio, images"]
    end

    subgraph RESPONSE["Response"]
        VIDEO["Video Response - MP4 + Audio"]
        IMAGE["Image Response - Photos + Audio"]
    end

    subgraph STORAGE["Storage"]
        LS["localStorage - history and stats"]
        DB[("Supabase - global_stats")]
    end

    subgraph DOWNLOAD["Download"]
        BLOB["Blob with Progress Bar"]
        OPEN["window.open fallback"]
    end

    URL --> REGEX
    REGEX -->|valid| Z
    REGEX -->|invalid| ERR["Error 400"]
    Z -->|success| PARSE
    Z -->|fail| S
    S -->|success| PARSE
    S -->|fail| ALERT["Alert System - Telegram/Email"]
    PARSE --> VIDEO
    PARSE --> IMAGE
    VIDEO --> LS
    IMAGE --> LS
    VIDEO --> DB
    IMAGE --> DB
    VIDEO --> BLOB
    IMAGE --> BLOB
    BLOB -->|CORS ok| BLOB
    BLOB -->|CORS fail| OPEN

    style INPUT fill:#e3f2fd,stroke:#2196f3,color:#0d47a1
    style VALIDATION fill:#fff3e0,stroke:#ff9800,color:#e65100
    style FETCH fill:#f3e5f5,stroke:#9c27b0,color:#4a148c
    style RESPONSE fill:#e8f5e9,stroke:#4caf50,color:#1b5e20
    style STORAGE fill:#efebe9,stroke:#795548,color:#3e2723
    style DOWNLOAD fill:#e0f2f1,stroke:#00695c,color:#004d40

Design Patterns yang Digunakan

Pattern	Implementasi	File
Provider Pattern	Fallback chain Zell → Sanka	`app/api/tiktok/route.ts`
Repository Pattern	Supabase ↔ File JSON fallback	`app/api/global-stats/route.ts`
Custom Hook Pattern	State management terpisah per concern	`hooks/`
Compound Component	VideoPreview + download buttons	`components/video-preview.tsx`
Strategy Pattern	Download: Blob progress vs window.open	`lib/download-utils.ts`
Observer Pattern	useRef untuk avoid stale closure	`hooks/use-download-history.ts`

✨ Key Features

🎬 Video Tanpa Watermark

Download video TikTok
dalam format MP4
tanpa logo watermark

🖼️ Photo Mode

Simpan semua gambar
dari TikTok carousel
sekaligus dalam sekali klik

🎵 Audio Extraction

Ekstrak dan download
hanya audio/musik
dalam format MP3

📊 Download Progress

Progress bar real-time
saat proses download
berlangsung

🕐 Download History

Riwayat download
tersimpan lokal
di perangkatmu (max 100)

🌍 Global Counter

Counter total download
seluruh pengguna
di seluruh dunia

🔔 Error Alerts

Notifikasi otomatis
via Telegram & Email
jika provider API gagal

🌙 Dark Mode

Tema gelap dan terang
yang bisa disesuaikan
dengan preferensimu

🔒 Privacy First

Tidak ada file tersimpan
di server — history
hanya di device kamu

🔄 Message Flow

sequenceDiagram
    participant U as User
    participant FE as Frontend
    participant API as API Server
    participant Z as Zell Provider
    participant S as Sanka Provider
    participant DB as Supabase
    participant TG as Telegram

    U->>FE: Paste TikTok URL
    U->>FE: Click Download
    FE->>API: POST /api/tiktok
    API->>API: Validate URL regex
    API->>Z: GET url=tiktok_url

    alt Zell Success
        Z-->>API: video, music, images
        API-->>FE: type, video, music
    else Zell Failed
        Z-->>API: Error 5xx
        API->>S: GET apikey and url
        alt Sanka Success
            S-->>API: play, music, images
            API-->>FE: type, video, music
        else All Providers Failed
            S-->>API: Error
            API->>TG: Alert notification
            API-->>FE: error message
            FE-->>U: Show error message
        end
    end

    FE->>FE: Show VideoPreview component
    U->>FE: Click UNDUH MP4
    FE->>FE: downloadWithProgress
    FE-->>U: Progress 0 to 100 percent
    FE-->>U: File saved

    FE->>API: POST /api/global-stats
    API->>DB: RPC increment_global_downloads
    DB-->>API: new_total
    API-->>FE: totalDownloads N
    FE-->>U: Update counter display

🗂️ Project Structure

FusionTik/
│
├── 📁 app/                          # Next.js App Router
│   ├── 📄 layout.tsx                # Root layout + SEO metadata + PWA
│   ├── 📄 page.tsx                  # ⭐ Halaman utama downloader
│   ├── 📄 globals.css               # Global styles + custom animations
│   ├── 📄 robots.ts                 # SEO robots.txt
│   ├── 📄 sitemap.ts                # SEO sitemap.xml
│   │
│   ├── 📁 api/
│   │   ├── 📁 tiktok/
│   │   │   └── 📄 route.ts          # ⭐ Core API: fetch + fallback + alerts
│   │   └── 📁 global-stats/
│   │       └── 📄 route.ts          # Global download counter
│   │
│   ├── 📁 faq/                      # Halaman FAQ
│   ├── 📁 feedback/                 # Halaman Feedback
│   ├── 📁 help-center/              # Halaman Help Center
│   ├── 📁 privacy/                  # Privacy Policy
│   └── 📁 terms/                    # Terms of Service
│
├── 📁 components/
│   ├── 📄 navbar.tsx                # Navigation bar + dark mode toggle
│   ├── 📄 video-preview.tsx         # ⭐ Preview + download buttons
│   ├── 📄 result-card.tsx           # History item card
│   ├── 📄 result-buttons.tsx        # Download action buttons
│   ├── 📄 stats-card.tsx            # Personal statistics card
│   ├── 📄 video-preview-modal.tsx   # Modal preview
│   ├── 📄 mode-toggle.tsx           # Dark/light mode toggle
│   ├── 📄 theme-provider.tsx        # Theme context provider
│   └── 📁 ui/                       # shadcn/ui (50+ komponen)
│
├── 📁 hooks/
│   ├── 📄 use-download-history.ts   # ⭐ History (localStorage, max 100)
│   ├── 📄 use-download-stats.ts     # Personal download statistics
│   ├── 📄 use-global-stats.ts       # Global counter state
│   └── 📄 use-toast.ts              # Toast notification hook
│
├── 📁 lib/
│   ├── 📄 download-utils.ts         # ⭐ Download dengan progress tracking
│   ├── 📄 supabase.ts               # Supabase client (nullable)
│   └── 📄 utils.ts                  # Tailwind merge utilities
│
├── 📁 data/
│   └── 📄 global-stats.json         # Fallback counter (development)
│
├── 📁 public/                       # Static assets + PWA manifest
├── 📄 next.config.mjs               # Next.js config + CSP headers
├── 📄 tailwind.config.ts            # Tailwind configuration
├── 📄 tsconfig.json                 # TypeScript configuration
└── 📄 env.example                   # Template environment variables

🛠️ Tech Stack

Framework

Language

Styling

Database

Layer	Teknologi	Versi	Fungsi
Framework	Next.js	15	App Router, SSR, API Routes
Language	TypeScript	5	Type safety end-to-end
Styling	Tailwind CSS	3	Utility-first CSS
UI Components	shadcn/ui	latest	50+ komponen siap pakai
Animation	Framer Motion	latest	Animasi halus & interaktif
Database	Supabase	2.x	Global download counter
Email	Nodemailer	6.x	Alert notifikasi via SMTP
Deployment	Vercel	—	Hosting + Edge Functions

⚡ Quick Start

Prasyarat

Node.js 18+
npm / pnpm / yarn
Akun Supabase (opsional, untuk global stats)

1. Clone & Install

git clone https://github.com/jundy779/FusionTik.git
cd FusionTik
npm install

2. Setup Environment

cp env.example .env.local

Edit .env.local:

# Supabase (untuk global stats — opsional)
NEXT_PUBLIC_SUPABASE_URL=https://<your-project-ref>.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=<your-supabase-anon-key>

# Notifikasi error (semua opsional)
TELEGRAM_BOT_TOKEN=
TELEGRAM_CHAT_ID=
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_USER=youremail@gmail.com
SMTP_PASS=your-app-password
ALERT_EMAIL_TO=owner@domain.com

3. Jalankan Development Server

npm run dev

Buka http://localhost:3000 di browser.

4. Build Production

npm run build
npm run start

# Custom port
PORT=8080 npm run start

⚙️ Environment Variables

Variable	Wajib	Deskripsi
`NEXT_PUBLIC_SUPABASE_URL`	❌	URL project Supabase untuk global stats
`NEXT_PUBLIC_SUPABASE_ANON_KEY`	❌	Anon key Supabase
`ZELL_TIKTOK_API_URL`	❌	Override URL provider Zell
`SANKA_TIKTOK_API_URL`	❌	Override URL provider Sanka
`SANKA_TIKTOK_API_KEY`	❌	API key untuk provider Sanka
`ALERT_WEBHOOK_URL`	❌	Webhook URL untuk notifikasi error
`TELEGRAM_BOT_TOKEN`	❌	Token bot Telegram untuk alert
`TELEGRAM_CHAT_ID`	❌	Chat ID penerima notifikasi Telegram
`SMTP_HOST`	❌	SMTP host untuk email alert
`SMTP_PORT`	❌	SMTP port (587 TLS / 465 SSL)
`SMTP_USER`	❌	Email pengirim
`SMTP_PASS`	❌	Password / App Password email
`ALERT_EMAIL_TO`	❌	Email penerima alert

Catatan: Jika Supabase tidak dikonfigurasi, global stats menggunakan data/global-stats.json sebagai fallback (cocok untuk development).

🌐 Deployment

Deploy ke Vercel (Recommended)

Fork repo ini ke akun GitHub kamu
Buka vercel.com/import dan pilih repo FusionTik
Set environment variables di dashboard Vercel
Klik Deploy — Vercel akan build dan host otomatis

Deploy ke VPS / Server Sendiri

git clone https://github.com/jundy779/FusionTik.git
cd FusionTik
npm install
cp env.example .env.local
# Edit .env.local sesuai kebutuhan
npm run build
npm run start

Gunakan PM2 untuk production:

npm install -g pm2
pm2 start "npm run start" --name fusiontik
pm2 save && pm2 startup

Deploy dengan Docker

Pull dan jalankan image dari GitHub Container Registry:

# Pull image terbaru
docker pull ghcr.io/jundy779/fusiontik:latest

# Jalankan container
docker run -d \
  --name fusiontik \
  -p 3000:3000 \
  -e NEXT_PUBLIC_SUPABASE_URL=your_supabase_url \
  -e NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_key \
  -e TELEGRAM_BOT_TOKEN=your_telegram_token \
  -e TELEGRAM_CHAT_ID=your_chat_id \
  ghcr.io/jundy779/fusiontik:latest

Atau build sendiri dari source:

git clone https://github.com/jundy779/FusionTik.git
cd FusionTik
docker build -t fusiontik .
docker run -d --name fusiontik -p 3000:3000 fusiontik

Dengan Docker Compose:

# docker-compose.yml
services:
  fusiontik:
    image: ghcr.io/jundy779/fusiontik:latest
    ports:
      - "3000:3000"
    environment:
      - NEXT_PUBLIC_SUPABASE_URL=${NEXT_PUBLIC_SUPABASE_URL}
      - NEXT_PUBLIC_SUPABASE_ANON_KEY=${NEXT_PUBLIC_SUPABASE_ANON_KEY}
      - TELEGRAM_BOT_TOKEN=${TELEGRAM_BOT_TOKEN}
      - TELEGRAM_CHAT_ID=${TELEGRAM_CHAT_ID}
    restart: unless-stopped

docker compose up -d

🗄️ Setup Supabase

Untuk mengaktifkan global download counter yang persisten:

1. Buat Tabel

CREATE TABLE global_stats (
  id BIGINT PRIMARY KEY DEFAULT 1,
  total_downloads BIGINT DEFAULT 0,
  updated_at TIMESTAMPTZ DEFAULT NOW()
);

INSERT INTO global_stats (id, total_downloads) VALUES (1, 0);

2. Buat RPC Function (Atomic Increment)

CREATE OR REPLACE FUNCTION increment_global_downloads()
RETURNS BIGINT LANGUAGE plpgsql AS $$
DECLARE new_total BIGINT;
BEGIN
  UPDATE global_stats
  SET total_downloads = total_downloads + 1, updated_at = NOW()
  WHERE id = 1
  RETURNING total_downloads INTO new_total;
  RETURN new_total;
END;
$$;

3. Row Level Security

ALTER TABLE global_stats ENABLE ROW LEVEL SECURITY;
CREATE POLICY "Allow public read" ON global_stats FOR SELECT USING (true);
CREATE POLICY "Allow public update" ON global_stats FOR UPDATE USING (true);

🔔 Sistem Notifikasi Error

Ketika semua provider API gagal, FusionTik otomatis mengirim alert:

flowchart LR
    A["Provider Zell - FAILED"] --> B["Provider Sanka - FAILED"]
    B --> C{"notifyProviderFailure"}
    C --> D["Telegram Bot - Instant Alert"]
    C --> E["Email SMTP - Nodemailer"]
    C --> F["Webhook POST - Custom Endpoint"]
    C --> G["User Error UI - Friendly Message"]

    style A fill:#fce4ec,stroke:#e91e63,color:#880e4f
    style B fill:#fce4ec,stroke:#e91e63,color:#880e4f
    style C fill:#fff3e0,stroke:#ff9800,color:#e65100
    style D fill:#e8f5e9,stroke:#4caf50,color:#1b5e20
    style E fill:#e3f2fd,stroke:#2196f3,color:#0d47a1
    style F fill:#f3e5f5,stroke:#9c27b0,color:#4a148c
    style G fill:#efebe9,stroke:#795548,color:#3e2723

Contoh pesan Telegram yang dikirim:

⚠️ FusionTik downloader error
URL: https://www.tiktok.com/@user/video/123
Error: Zell API returned 503: Service Unavailable
Time: 2025-01-15T10:30:00.000Z

📊 Statistik & Analytics

Global Stats

Disimpan di Supabase dengan atomic increment via RPC. Fallback ke file JSON untuk development. Ditampilkan di hero section halaman utama.

Personal Stats (Per User)

Disimpan di localStorage browser:

Metrik	Deskripsi
📥 Total Downloads	Jumlah total konten yang didownload
🎬 Videos Downloaded	Jumlah video yang didownload
🖼️ Images Downloaded	Jumlah foto/carousel yang didownload
🎵 Audio Extracted	Jumlah audio yang diekstrak
📅 Today Downloads	Download hari ini
📆 This Week	Download 7 hari terakhir
🗓️ This Month	Download 30 hari terakhir
🏆 Most Active Day	Hari dengan download terbanyak
📈 Average/Day	Rata-rata download per hari

🔒 Keamanan & Privasi

✅ Tidak ada file tersimpan di server — semua konten langsung dari CDN TikTok
✅ History hanya di device pengguna — tidak ada tracking server-side
✅ CSP Headers — Content Security Policy ketat di semua response
✅ Security Headers — HSTS, X-Frame-Options, X-Content-Type-Options, dll
✅ XSS Protection — Caption TikTok di-escape sebelum render HTML
✅ No Third-party Tracking — Tidak ada Google Analytics atau tracker pihak ketiga

📝 Changelog

v2.1.0 — Clean Code & Security Update

✅ Refactor: hapus semua any type → proper TypeScript interfaces
✅ Security: XSS fix pada caption rendering (HTML entity escaping)
✅ Fix: atomic Supabase counter increment via RPC
✅ Fix: sequential image download (cegah browser popup blocking)
✅ Improvement: response.ok check pada semua fetch calls
✅ Improvement: history limit 100 item + useRef fix untuk infinite loop
✅ Improvement: konsistensi downloadWithProgress di semua download handler
✅ Security: hapus exposed Supabase key dari env.example

v2.0.0 — Multi-Provider & Alerts

✅ Dual provider dengan fallback (Zell → Sanka)
✅ Notifikasi error multi-channel (Webhook + Telegram + Email)
✅ Global download counter dengan Supabase
✅ Download progress tracking dengan ReadableStream
✅ Personal download statistics
✅ Dark/Light mode

🤝 Contributing

Contributions are welcome! 💖

Fork repo ini
Buat branch baru: git checkout -b feature/nama-fitur
Commit perubahan: git commit -m "feat: tambah fitur X"
Push ke branch: git push origin feature/nama-fitur
Buka Pull Request ke branch main

Konvensi Commit:

Prefix	Deskripsi
`feat:`	Fitur baru
`fix:`	Bug fix
`refactor:`	Refactoring kode
`docs:`	Update dokumentasi
`style:`	Perubahan styling
`chore:`	Maintenance / dependency update

⚖️ Legal & Disclaimer

Warning

Gunakan dengan bijak:

Layanan ini untuk penggunaan pribadi saja
Hormati hak cipta kreator konten
Jangan gunakan konten yang didownload untuk tujuan komersial tanpa izin
Ikuti Terms of Service TikTok
FusionTik tidak berafiliasi dengan TikTok atau ByteDance Ltd.

💖 Acknowledgements

Core Technologies

Community & Contributors

💚 Semua contributors yang membuat ini mungkin
🌍 Komunitas open-source yang luar biasa
⭐ Semua yang sudah memberikan bintang di repo ini

📊 Repository Activity

🌟 Star History

Maintained with ❤️ by FUSIONIFY DIGITAL.ID

Name		Name	Last commit message	Last commit date
Latest commit History 43 Commits
.github		.github
app		app
components		components
data		data
hooks		hooks
lib		lib
public		public
styles		styles
.dockerignore		.dockerignore
.gitignore		.gitignore
Dockerfile		Dockerfile
LICENSE		LICENSE
README.md		README.md
components.json		components.json
env.example		env.example
next.config.mjs		next.config.mjs
package-lock.json		package-lock.json
package.json		package.json
pnpm-lock.yaml		pnpm-lock.yaml
postcss.config.mjs		postcss.config.mjs
preinstall.js		preinstall.js
tailwind.config.ts		tailwind.config.ts
tsconfig.json		tsconfig.json

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Repository files navigation

Layer Overview

Component Interaction Diagram

Data Flow Diagram

Design Patterns yang Digunakan

Prasyarat

1. Clone & Install

2. Setup Environment

3. Jalankan Development Server

4. Build Production

Deploy ke Vercel (Recommended)

Deploy ke VPS / Server Sendiri

Deploy dengan Docker

Global Stats

Personal Stats (Per User)

v2.1.0 — Clean Code & Security Update

v2.0.0 — Multi-Provider & Alerts

About

Uh oh!

Releases 2

Packages

Uh oh!

Uh oh!

Contributors

Uh oh!

Languages

Folders and files

Latest commit

History

Repository files navigation

Layer Overview

Component Interaction Diagram

Data Flow Diagram

Design Patterns yang Digunakan

Prasyarat

1. Clone & Install

2. Setup Environment

3. Jalankan Development Server

4. Build Production

Deploy ke Vercel (Recommended)

Deploy ke VPS / Server Sendiri

Deploy dengan Docker

Global Stats

Personal Stats (Per User)

v2.1.0 — Clean Code & Security Update

v2.0.0 — Multi-Provider & Alerts

About

Topics

Resources

License

Code of conduct

Contributing

Security policy

Uh oh!

Stars

Watchers

Forks

Releases 2

Packages 0

Uh oh!

Uh oh!

Contributors

Uh oh!

Languages

Packages