Rabu, 28 Mei 2025

Membuat Aplikasi YouTube-Like Sederhana untuk Pemula Di Local Server XAMPP

 


Di era digital, video menjadi salah satu konten paling populer di internet. Platform seperti YouTube, TikTok, dan Instagram Reels memungkinkan pengguna mengunggah dan menonton video dengan mudah. Jika Anda seorang pengembang pemula yang ingin memahami cara kerja platform semacam itu, artikel ini akan memandu Anda membuat aplikasi YouTube-like sederhana menggunakan PHP, MySQL, dan CSS.

Proyek ini mencakup:
 Upload video (format .mp4)
 Penyimpanan data video di database
 Tampilan antarmuka mirip YouTube
 Tanpa sistem login (fokus pada fungsi dasar)


Struktur Proyek

Berikut adalah file-file utama yang akan digunakan:

  1. index.php – Halaman utama untuk menampilkan daftar video.

  2. upload.php – Formulir upload video.

  3. upload_process.php – Proses penyimpanan video ke server dan database.

  4. database.php – Konfigurasi koneksi MySQL.

  5. style.css – Styling tampilan agar mirip YouTube.

  6. Folder uploads/ – Direktori penyimpanan file video.


Langkah 1: Persiapan Database

Sebelum memulai, kita perlu menyiapkan database untuk menyimpan informasi video.

Struktur Database

  • Nama Database: video_db

  • Tabel: videos

    • id (Primary Key, Auto Increment)

    • title (Judul video)

    • description (Deskripsi video)

    • filename (Nama file video)

    • upload_date (Tanggal upload)

Database ini akan menyimpan metadata video, sedangkan file videonya disimpan di folder uploads/.


Langkah 2: Membuat Halaman Upload Video

File upload.php berisi formulir sederhana untuk mengunggah video.

Fitur Formulir Upload

  • Input Judul Video – Pengguna bisa memasukkan judul.

  • Deskripsi Video – Kolom opsional untuk deskripsi.

  • Pilih File – Hanya menerima file .mp4.

  • Tombol Upload – Untuk mengirim data ke server.

Setelah pengguna mengklik "Upload", data dikirim ke upload_process.php untuk diproses.


Langkah 3: Proses Upload Video

File upload_process.php bertanggung jawab untuk:

  1. Memeriksa Format File

    • Hanya menerima .mp4.

    • Memastikan file benar-benar video (bukan file lain yang di-rename).

  2. Menyimpan File ke Server

    • File disimpan di folder uploads/.

    • Nama file diubah agar aman (menghindari spasi/simbol).

  3. Menyimpan Data ke Database

    • Judul, deskripsi, dan nama file disimpan di tabel videos.

Jika berhasil, pengguna diarahkan kembali ke index.php. Jika gagal, muncul pesan error.


Langkah 4: Menampilkan Daftar Video

File index.php menampilkan semua video yang sudah diupload dalam bentuk grid seperti YouTube.

Fitur Halaman Utama

  • Daftar Video dalam Grid – Tampilan responsif (desktop & mobile).

  • Pemutar Video Sederhana – Menggunakan tag HTML5 <video>.

  • Judul & Deskripsi – Informasi video di bawah pemutar.

  • Tombol "Upload Video" – Link ke halaman upload.


Langkah 5: Styling dengan CSS

File style.css digunakan untuk mempercantik tampilan.

Desain Mirip YouTube

  • Warna & Font – Menggunakan warna merah khas YouTube.

  • Grid Layout – Video ditampilkan dalam bentuk kartu (card).

  • Responsive Design – Menyesuaikan layar desktop & mobile.


Langkah 6: Konfigurasi Server

Agar aplikasi berjalan lancar, pastikan:

  1. Folder uploads/ Memiliki Izin Write

    • Di Linux: chmod 777 uploads/

    • Di Windows: Pastikan folder bisa diakses.

  2. Setting PHP untuk Upload File Besar

    • Ubah php.ini:

      ini

      upload_max_filesize = 100M
      post_max_size = 100M
    • Atau gunakan .htaccess untuk override setting.

  3. Pastikan Ekstensi PHP & MySQL Aktif

    • Di XAMPP/WAMP, pastikan Apache & MySQL berjalan.


Kesimpulan

Dengan mengikuti langkah-langkah di atas, Anda telah membuat aplikasi YouTube-like sederhana dengan fitur:
✔ Upload video
✔ Penyimpanan data di database
✔ Tampilan menarik mirip YouTube

Proyek ini cocok untuk pemula yang ingin belajar:
🔹 PHP & MySQL (CRUD dasar)
🔹 Upload File (penanganan form)
🔹 CSS Grid (tata letak responsif)

Pengembangan Selanjutnya

Jika ingin mengembangkan lebih lanjut, Anda bisa menambahkan:

  • Sistem Login (menggunakan session)

  • Komentar & Like (interaksi pengguna)

  • Thumbnail Generator (menggunakan FFmpeg)

Dengan memahami konsep dasar ini, Anda bisa membuat platform video yang lebih kompleks di masa depan! 🚀

📥 Downloads File Disini !!! 


📌 Catatan:

  • Tanpa Login – Proyek ini fokus pada fungsi dasar tanpa autentikasi.

  • Localhost Only – Belum di-deploy ke hosting (untuk pembelajaran).

  • Tanpa PDO – Menggunakan mysqli untuk koneksi database.

Tidak ada komentar:

Posting Komentar

Panduan Lengkap Membuat Database, Tabel, Menambah User, dan Memberikan Privilege di Ubuntu Server

Dalam dunia administrasi server, pengelolaan database merupakan salah satu keterampilan fundamental yang harus dikuasai. Ubuntu Server, seba...