Oke. Sekarang kita bikin full release satu perintah.

Targetnya begini:

npm run release -- "add new videos"

Lalu otomatis:

  • upload ke R2
  • skip file yang sudah ada
  • generate data.json
  • git add .
  • git commit
  • git push origin main

Jadi kamu tidak perlu ngetik satu-satu lagi.

1. Buat release.js

Bikin file baru release.js:

import { execSync } from "child_process";

function run(cmd) {
  console.log(`\n▶ ${cmd}`);
  execSync(cmd, { stdio: "inherit" });
}

function getCommitMessage() {
  const args = process.argv.slice(2).join(" ").trim();
  return args || "update media library";
}

try {
  const message = getCommitMessage();

  console.log("🚀 START RELEASE");

  run("node upload-r2.js");
  run("node generate.js");
  run("git add .");

  try {
    run(`git commit -m "${message.replace(/"/g, '\\"')}"`);
  } catch {
    console.log("\nℹ Tidak ada perubahan untuk di-commit.");
  }

  run("git push origin main");

  console.log("\n✅ RELEASE DONE");
} catch (err) {
  console.error("\n❌ RELEASE FAILED");
  process.exit(1);
}

2. Update package.json

Pastikan bagian scripts jadi seperti ini:

{
  "name": "video-site",
  "version": "1.0.0",
  "type": "module",
  "scripts": {
    "build": "node build.js",
    "generate": "node generate.js",
    "thumb": "node generate-thumb.js",
    "r2": "node upload-r2.js",
    "publish": "node publish.js",
    "release": "node release.js"
  },
  "dependencies": {
    "@aws-sdk/client-s3": "^3.0.0",
    "dotenv": "^16.4.0"
  }
}

Kalau package.json kamu sudah ada field lain, cukup tambah "release": "node release.js" di scripts.

3. Cara pakai

Kalau ada media baru:

npm run release -- "add new reels"

Atau:

npm run release -- "update gallery"

Kalau tidak kasih pesan juga bisa:

npm run release

Default commit message:

update media library

4. Alur kerja kamu nanti

Sekarang workflow harian kamu jadi:

kalau ada video baru:

  1. taruh file di folder media/
  2. jalankan:
npm run release -- "add new videos"
  1. selesai

Itu saja.

5. Catatan penting

Tentang thumbnail

Kalau kamu masih butuh generate thumbnail dulu, maka sebelum release jalankan:

npm run thumb

Kalau mau, nanti kita bisa bikin release.js versi lebih lengkap yang sekalian menjalankan:

  • generate-thumb.js
  • upload-r2.js
  • generate.js
  • git commit
  • git push

Jadi benar-benar satu command total.

6. Saran terbaik sekarang

Versi paling enak justru sekalian kita upgrade release.js supaya include thumbnail juga.
Karena alur ideal kamu harusnya:

npm run release -- "add new videos"

dan otomatis:

  • generate thumb
  • upload R2
  • generate data
  • push GitHub

Bukan setengah manual.

Pakai versi ini saja kalau kamu mau langsung full:

import { execSync } from "child_process";

function run(cmd) {
  console.log(`\n▶ ${cmd}`);
  execSync(cmd, { stdio: "inherit" });
}

function getCommitMessage() {
  const args = process.argv.slice(2).join(" ").trim();
  return args || "update media library";
}

try {
  const message = getCommitMessage();

  console.log("🚀 START RELEASE");

  run("node generate-thumb.js");
  run("node upload-r2.js");
  run("node generate.js");
  run("git add .");

  try {
    run(`git commit -m "${message.replace(/"/g, '\\"')}"`);
  } catch {
    console.log("\nℹ Tidak ada perubahan untuk di-commit.");
  }

  run("git push origin main");

  console.log("\n✅ RELEASE DONE");
} catch (err) {
  console.error("\n❌ RELEASE FAILED");
  process.exit(1);
}

Rekomendasi saya

Pilih versi full yang sekalian generate thumbnail.
Karena itu paling cocok dengan cara kerja kamu.

Setelah ini, langkah terbaik berikutnya adalah:
deteksi orientasi video otomatis supaya video TikTok/Instagram bisa ditandai VERTICAL dan nanti UI player lebih pintar.

baik.. saya menyiapkan video dulu dengan nama file  yang bisa dibaca manusia sebentar ya saya ngarang2 dulu

Sip, itu langkah yang tepat 👍
Jangan disepelekan—naming file itu fondasi sistem kamu ke depan.

Kalau kamu asal-asalan sekarang, nanti:

  • susah search
  • susah filter
  • susah SEO
  • data.json jadi berantakan

🎯 Rekomendasi naming (biar rapi & scalable)

Gunakan format sederhana tapi konsisten:

kategori_nama-deskripsi_tahun.mp4

Contoh bagus:

reels_cewek-manis-dance_2025.mp4
tiktok_funny-cat-jump_2024.mp4
shorts_kuliner-bakso-enak_2025.mp4

⚡ Untuk thumbnail (penting)

Pastikan sama nama:

reels_cewek-manis-dance_2025.mp4
reels_cewek-manis-dance_2025.jpg

👉 ini bikin script kamu auto detect ✔

❌ Hindari ini

VID_20250101_123123.mp4
video1.mp4
final_fix_beneran_fix.mp4

👉 ini bakal nyusahin kamu nanti

🔥 Bonus (kalau mau lebih rapi lagi)

Kamu bisa pakai format:

kategori__judul__tag.mp4

Contoh:

reels__cewek-manis__dance.mp4
tiktok__kucing-lucu__funny.mp4

👉 nanti gampang diparsing ke:

  • category
  • title
  • tag

💬 Saran jujur

Jangan terlalu lama di tahap ini.

👉 cukup:

  • readable
  • konsisten
  • tidak terlalu panjang

🚀 Setelah kamu siap

Lanjut:

npm run release -- "add new batch videos"

👉 Next upgrade setelah ini

Begitu kamu punya file naming bagus, kita bisa:

🔥 auto generate:

  • title (dari filename)
  • tag (dari filename)
  • kategori (dari prefix)

👉 jadi kamu tidak perlu edit manual lagi

Kalau sudah siap batch pertama, langsung gas release saja.
Kalau ada yang aneh di hasil data.json, kirim—kita refine lagi sampai perfect.

oh iya.. apakah file di media/ sebelumnya sudah boleh dihapus?

Jawaban jujurnya: boleh… tapi jangan langsung brutal hapus.

Kita bedakan dulu biar kamu nggak nyesel nanti.

🎯 Kondisi kamu sekarang

File kamu sudah:

  • ✔ upload ke R2
  • ✔ bisa diakses CDN
  • ✔ dipakai oleh website

👉 secara teknis:
file di media/ sudah tidak dibutuhkan untuk runtime website

⚠️ Tapi… ini penting

Folder media/ sekarang masih punya fungsi:

1. Source untuk generate

Script kamu pakai ini untuk:

  • baca file
  • generate data.json
  • generate thumbnail

Kalau dihapus:
👉 script kamu tidak punya “input”

🔥 Jadi keputusan terbaik

❌ JANGAN langsung hapus semua

✅ Gunakan salah satu strategi ini

🥇 RECOMMENDED (aman & profesional)

Pisahkan jadi 2 folder:

/media      ❌ (hapus nanti)
/source     ✅ (untuk file asli)

Ganti di script:

const mediaDir = "./source";

👉 artinya:

  • source/ = tempat file asli (local backup)
  • R2 = production storage

🥈 Alternatif (kalau mau minimal)

Hapus hanya setelah upload

Flow:

  1. taruh file di media/
  2. setelah yakin sukses:
    👉 hapus file di media/

jalankan:

npm run release

⚠️ Tapi ini berisiko:

  • kalau R2 error → file hilang
  • tidak ada backup lokal

🧠 Best practice (yang saya sarankan)

👉 lakukan ini:

/source      → file asli (backup)
/media       → kosong / temporary

Atau langsung pakai:

/media = source

tapi jangan hapus isi sembarangan.

💬 Saran jujur (penting banget)

Kalau kamu serius lanjut project ini:

👉 JANGAN hapus file asli

Karena nanti kamu butuh untuk:

  • re-encode video
  • generate ulang thumbnail
  • convert ke HLS
  • upload ke platform lain

🔥 Versi ideal kamu sekarang

/source        (master file)
R2             (delivery)
Pages          (frontend)
data.json      (metadata)

👉 ini sudah level production workflow

🚀 Kesimpulan

AksiAman?
Hapus semua media/❌ jangan
Hapus setelah upload⚠️ boleh tapi risk
Simpan di source/✅ terbaik

👉 Saran saya

Pindahkan dulu:

media → source

lalu update script.

Kalau kamu mau, next saya bantu:

👉 auto parsing filename → jadi title + tag + category otomatis

Itu bakal bikin sistem kamu makin “pintar” 🔥