Cara Membuat Video Player di Android dengan Kotlin dan ExoPlayer: Panduan Lengkap Developer

Dalam dunia aplikasi mobile modern, konten video bukan lagi fitur pelengkap, melainkan komponen esensial. Mulai dari aplikasi media sosial, e-learning, e-commerce, hingga aplikasi berita, kemampuan untuk memutar video dengan mulus adalah kunci pengalaman pengguna yang superior. Namun, membangun video player yang robust dan kaya fitur di Android bisa jadi tantangan tersendiri.

Jika Anda seorang developer Android yang ingin mengimplementasikan video player di aplikasi Kotlin, panduan ini akan membantu Anda. Kita akan fokus pada penggunaan ExoPlayer, library media player open-source dari Google yang dirancang khusus untuk Android. Saya akan memandu Anda mulai dari setup dasar hingga membahas pertimbangan praktis yang sering dihadapi developer.

Mengapa Memilih ExoPlayer untuk Aplikasi Android Anda?

Android memiliki API media player bawaan (MediaPlayer), tetapi di sebagian besar kasus, ExoPlayer adalah pilihan yang jauh lebih unggul untuk aplikasi produksi. Ini alasannya:

• Fleksibilitas dan Kustomisasi: ExoPlayer dirancang untuk lebih fleksibel dan mudah dikustomisasi. Anda bisa dengan mudah mengintegrasikan komponen kustom seperti pemuat data, render, atau pembagi media.
• Format Media Luas: Mendukung format media dan protokol streaming yang lebih luas, termasuk DASH, HLS, SmoothStreaming, dan format umum lainnya seperti MP4, WebM, MP3.
• Fitur Tingkat Lanjut: Fitur seperti adaptif streaming, DRM (Digital Rights Management), side-loaded subtitle, dan caching sangat mudah diimplementasikan dengan ExoPlayer.
• Performa dan Efisiensi: Didesain untuk performa tinggi dan efisiensi sumber daya, menjadikannya pilihan ideal untuk aplikasi yang akan digunakan secara luas.
• Mendukung Versi Android Lama: Meskipun Google terus mengoptimalkan fitur baru, ExoPlayer bekerja konsisten di berbagai versi Android, bahkan hingga versi API lama.
• Didukung Google: Menjadi bagian dari project Google Android, Anda bisa mengandalkan pembaruan dan dukungan komunitas yang aktif.

Singkatnya, jika Anda serius membangun aplikasi Android yang melibatkan pemutaran video, lupakan MediaPlayer dan langsung gunakan ExoPlayer.

Persiapan Awal: Setup Proyek Android Studio

Sebelum kita mulai coding, pastikan Anda memiliki lingkungan pengembangan yang siap:

1. Android Studio: Pastikan Anda menggunakan versi terbaru Android Studio.
2. Proyek Kotlin: Buat proyek Android baru dengan template “Empty Activity” dan pilih Kotlin sebagai bahasa pemrograman.
3. Target SDK: Sesuaikan target SDK dan minimum SDK sesuai kebutuhan aplikasi Anda.

Menambahkan Dependencies ExoPlayer

Buka file build.gradle.kts (Module :app) di proyek Anda. Tambahkan dependency ExoPlayer di dalam blok dependencies { ... }. Selalu periksa versi terbaru ExoPlayer di dokumentasi resmi.

Dalam praktiknya, Anda mungkin hanya membutuhkan modul exoplayer dan exoplayer-ui. Modul exoplayer-core akan otomatis disertakan. Jika Anda butuh fitur lebih lanjut seperti DASH, HLS, atau SmoothStreaming, Anda bisa menambahkannya secara terpisah.

Contoh Dependencies:

dependencies {
    // ... dependency lain
    implementation("androidx.core:core-ktx:1.13.1")
    implementation("androidx.appcompat:appcompat:1.7.0")
    implementation("com.google.android.material:material:1.12.0")
    implementation("androidx.constraintlayout:constraintlayout:2.1.4")

    // ExoPlayer libraries
    implementation("com.google.android.exoplayer:exoplayer:2.19.1")
    implementation("com.google.android.exoplayer:exoplayer-ui:2.19.1")
    // Opsional: Untuk streaming HLS
    // implementation("com.google.android.exoplayer:exoplayer-hls:2.19.1")
    // Opsional: Untuk streaming DASH
    // implementation("com.google.android.exoplayer:exoplayer-dash:2.19.1")
}

Setelah menambahkan dependency, lakukan ‘Sync Project with Gradle Files’.

Menambahkan Izin di AndroidManifest.xml

Untuk memutar video dari internet, aplikasi Anda memerlukan izin INTERNET. Tambahkan ini di file AndroidManifest.xml di dalam tag <manifest>, di luar tag <application>:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.tubianto.videoplayerapp">

    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

    <application
        ...
    </application>
</manifest>

Izin ACCESS_NETWORK_STATE juga berguna untuk memeriksa koneksi jaringan.

Merancang Layout Video Player (XML)

ExoPlayer menyediakan komponen UI siap pakai bernama PlayerView. Ini adalah ViewGroup yang dapat menampilkan video, subtitle, dan memiliki kontrol pemutaran bawaan (play/pause, seek bar, fullscreen button, dll.).

Buka file layout activity utama Anda (misalnya, activity_main.xml) dan tambahkan PlayerView:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/video_player_view"
        android:layout_width="0dp"
        android:layout_height="250dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:resize_mode="fit"
        app:use_controller="true"
        app:fastforward_increment="10000"
        app:rewind_increment="10000"
        app:show_timeout="5000" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Video Player dengan Kotlin"
        android:textSize="20sp"
        android:layout_marginTop="16dp"
        app:layout_constraintTop_toBottomOf="@id/video_player_view"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Beberapa atribut app: yang penting pada PlayerView:

• app:resize_mode: Mengatur bagaimana video disesuaikan dengan ukuran view (fit, fill, zoom, fixed_width, fixed_height).
• app:use_controller: Jika true, kontrol pemutaran (play/pause, seek bar) akan ditampilkan secara otomatis.
• app:fastforward_increment, app:rewind_increment: Durasi lompatan saat tombol fast forward/rewind ditekan (dalam milidetik).
• app:show_timeout: Durasi kontrol akan ditampilkan sebelum disembunyikan otomatis (dalam milidetik).

Menulis Kode Kotlin untuk Video Player

Sekarang, saatnya menulis logika inti di file MainActivity.kt Anda.

1. Inisialisasi ExoPlayer

Pertama, kita akan mendeklarasikan variabel untuk ExoPlayer dan PlayerView. Kemudian, inisialisasi ExoPlayer di method onCreate atau onStart/onResume.

package com.tubianto.videoplayerapp

import android.net.Uri
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.google.android.exoplayer2.ExoPlayer
import com.google.android.exoplayer2.MediaItem
import com.google.android.exoplayer2.ui.PlayerView
import com.tubianto.videoplayerapp.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding
    private var player: ExoPlayer? = null
    private var playWhenReady = true // Apakah player harus mulai play otomatis
    private var currentItem = 0      // Indeks item media saat ini
    private var playbackPosition = 0L // Posisi playback saat ini dalam milidetik

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
    }

    // ... (lifecycle methods akan datang setelah ini)

    private fun initializePlayer() {
        if (player == null) {
            player = ExoPlayer.Builder(this)
                .build()
                .also { exoPlayer ->
                    binding.videoPlayerView.player = exoPlayer
                    val mediaItem = MediaItem.fromUri(getString(R.string.media_url_mp4))
                    // Atau gunakan MediaItem.fromUri("URL_VIDEO_ANDA_DI_SINI")
                    // Atau MediaItem.fromUri(Uri.parse("file:///path/to/local/video.mp4"))
                    exoPlayer.setMediaItem(mediaItem)

                    // Jika Anda memiliki beberapa video untuk playlist
                    // val mediaItem1 = MediaItem.fromUri(getString(R.string.media_url_mp4_1))
                    // val mediaItem2 = MediaItem.fromUri(getString(R.string.media_url_mp4_2))
                    // exoPlayer.addMediaItems(listOf(mediaItem1, mediaItem2))

                    exoPlayer.playWhenReady = playWhenReady
                    exoPlayer.seekTo(currentItem, playbackPosition)
                    exoPlayer.prepare()
                }
        }
    }

    // Untuk menyimpan URL video, tambahkan di res/values/strings.xml
    // <string name="media_url_mp4">https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4</string>
    // Ganti dengan URL video Anda sendiri
}

Penjelasan Kode:

• binding: ActivityMainBinding: Menggunakan View Binding untuk akses view yang lebih aman dan mudah.
• player: ExoPlayer?: Objek ExoPlayer. Kita menggunakannya sebagai nullable karena akan diinisialisasi dan dilepaskan sesuai siklus hidup Activity.
• initializePlayer(): Fungsi ini membuat instance ExoPlayer baru.
• ExoPlayer.Builder(this).build(): Membuat instance ExoPlayer.
• binding.videoPlayerView.player = exoPlayer: Menghubungkan instance ExoPlayer dengan PlayerView di layout.
• MediaItem.fromUri(...): Mendefinisikan sumber media yang akan diputar. Anda bisa menggunakan URL langsung atau resource dari strings.xml.
• exoPlayer.setMediaItem(mediaItem): Mengatur satu item media. Untuk playlist, gunakan addMediaItem() atau addMediaItems().
• exoPlayer.playWhenReady = playWhenReady: Mengatur apakah video harus mulai diputar segera setelah siap.
• exoPlayer.seekTo(currentItem, playbackPosition): Melanjutkan pemutaran dari posisi terakhir jika Activity di-recreate.
• exoPlayer.prepare(): Mempersiapkan player untuk memulai pemutaran. Ini adalah langkah penting.

2. Mengelola Siklus Hidup Player (Lifecycle Management)

Manajemen siklus hidup adalah bagian krusial saat bekerja dengan resource berat seperti video player. Anda harus menginisialisasi player saat activity aktif dan melepaskannya saat tidak lagi dibutuhkan untuk menghindari kebocoran memori (memory leaks) dan masalah lainnya.

Gunakan method onStart(), onResume(), onPause(), onStop(), dan onDestroy() untuk mengelola player.

class MainActivity : AppCompatActivity() {
    // ... (variabel yang sudah dideklarasikan sebelumnya)

    override fun onStart() {
        super.onStart()
        if (Util.SDK_INT >= 24) {
            initializePlayer()
        }
    }

    override fun onResume() {
        super.onResume()
        if (Util.SDK_INT < 24 || player == null) {
            initializePlayer()
        }
        // Jika player null setelah initialize (misal karena error), pastikan tidak play
        player?.playWhenReady = playWhenReady
        player?.playbackState?.let {
            if (it == Player.STATE_IDLE || it == Player.STATE_ENDED) {
                player?.seekTo(currentItem, playbackPosition)
                player?.prepare()
            }
        }
    }

    override fun onPause() {
        super.onPause()
        if (Util.SDK_INT < 24) {
            releasePlayer()
        }
    }

    override fun onStop() {
        super.onStop()
        if (Util.SDK_INT >= 24) {
            releasePlayer()
        }
    }

    private fun releasePlayer() {
        player?.let { exoPlayer ->
            playbackPosition = exoPlayer.currentPosition
            currentItem = exoPlayer.currentMediaItemIndex
            playWhenReady = exoPlayer.playWhenReady
            exoPlayer.release()
        }
        player = null
    }

    // ... (initializePlayer() yang sudah ada)
}

Mengapa dua skenario releasePlayer() dan initializePlayer() berdasarkan API level (Util.SDK_INT >= 24)?

Sebelum Android 7.0 (API level 24), aplikasi Anda harus melepaskan semua resource media di onPause() karena aplikasi tidak dijamin tetap berada di memori setelah onPause(). Dari Android 7.0 ke atas, multiple window support memungkinkan aplikasi tetap terlihat sebagian, jadi sebaiknya tunda pelepasan resource hingga onStop() untuk pengalaman pengguna yang lebih mulus saat berganti aplikasi atau membuka mode split screen.

Penting: Selalu simpan status player (playWhenReady, currentItem, playbackPosition) sebelum melepaskan player dan mengembalikannya saat inisialisasi ulang. Ini memastikan video melanjutkan dari titik terakhir saat pengguna kembali ke aplikasi.

3. Menangani Perubahan Konfigurasi (Opsional)

Secara default, saat perangkat berotasi, Activity akan di-recreate. Ini akan memanggil siklus hidup onPause(), onStop(), onDestroy(), lalu onCreate(), onStart(), onResume(). Kode kita sudah menangani penyimpanan posisi pemutaran sehingga video akan melanjutkan dari posisi terakhir. Namun, ada cara lain untuk menangani rotasi jika Anda tidak ingin Activity di-recreate.

Anda bisa menambahkan atribut android:configChanges="orientation|screenSize|screenLayout" ke tag <activity> di AndroidManifest.xml. Dengan ini, onCreate tidak akan dipanggil ulang saat rotasi, melainkan onConfigurationChanged(). Namun, ini seringkali lebih kompleks dan tidak selalu direkomendasikan karena Anda harus secara manual menangani semua perubahan UI.

Untuk video player, pendekatan inisialisasi/release di lifecycle method seperti di atas sudah cukup baik dan lebih standar.

Advanced Considerations (Sekilas)

Setelah Anda berhasil membuat video player dasar, ada beberapa fitur dan pertimbangan lain yang mungkin Anda butuhkan untuk aplikasi yang lebih kompleks:

• Error Handling: Implementasikan Player.Listener untuk mendengarkan event error dan menampilkan pesan yang relevan kepada pengguna.
• Custom UI: Jika PlayerView tidak cukup, Anda bisa membuat kontrol UI kustom sendiri dan menghubungkannya ke instance ExoPlayer.
• DRM (Digital Rights Management): Untuk konten berbayar atau dilindungi hak cipta, ExoPlayer memiliki dukungan kuat untuk DRM seperti Widevine.
• Caching: Untuk streaming, Anda bisa mengimplementasikan caching untuk mengurangi penggunaan data dan meningkatkan pengalaman offline atau saat koneksi buruk.
• Background Playback: Jika Anda ingin video tetap diputar di latar belakang (misalnya, untuk podcast video), Anda perlu mengintegrasikan ExoPlayer dengan Service.
• Audio Fokus: Pastikan aplikasi Anda mengelola fokus audio dengan benar agar tidak bentrok dengan aplikasi pemutar audio lainnya.

Masalah yang Sering Terjadi

Saat mengembangkan video player, beberapa masalah umum sering muncul. Berikut adalah beberapa di antaranya beserta solusinya:

1. Video Tidak Muncul atau Hanya Menampilkan Layar Hitam

• Gejala: Video player tidak memutar apa pun, hanya menampilkan layar hitam atau progress spinner terus-menerus.
• Penyebab:
  • Izin Internet Belum Ditambahkan: Ini adalah penyebab paling umum untuk video streaming.
  • URL Video Rusak/Tidak Valid: Pastikan URL video dapat diakses dan formatnya didukung.
  • Koneksi Internet Buruk: Video streaming memerlukan koneksi stabil.
  • Format Video Tidak Didukung: Meskipun ExoPlayer mendukung banyak format, beberapa format atau codec mungkin tidak didukung secara native.
  • exoPlayer.prepare() Tidak Dipanggil: Player tidak akan mulai memuat media tanpa dipersiapkan.
• Solusi:
  • Periksa AndroidManifest.xml untuk <uses-permission android:name="android.permission.INTERNET"/>.
  • Validasi URL video dengan mencoba membukanya di browser atau alat lain.
  • Pastikan koneksi internet aktif.
  • Coba format video yang berbeda atau gunakan video sampel dari Google (seperti yang digunakan di tutorial ini).
  • Pastikan exoPlayer.prepare() dipanggil setelah setMediaItem().

2. Memory Leaks atau Crash Saat Activity Ditinggalkan

• Gejala: Aplikasi crash, lambat, atau menampilkan pesan error “Out Of Memory” setelah Activity yang berisi video player ditinggalkan dan dibuka kembali beberapa kali.
• Penyebab:
  • Player Tidak Dilepaskan: ExoPlayer adalah resource berat. Jika tidak dilepaskan dengan benar, ia akan terus menempati memori.
  • Referensi Player Tertinggal: Objek Activity masih menyimpan referensi ke player yang seharusnya sudah dibuang.
• Solusi:
  • Implementasi releasePlayer() yang Benar: Pastikan releasePlayer() dipanggil di onPause() (untuk API < 24) atau onStop() (untuk API >= 24).
  • Set player = null setelah memanggil release() untuk menghapus referensi.

3. Kontrol Player (Play/Pause, Seek) Tidak Muncul

• Gejala: Video diputar, tetapi kontrol pemutaran standar tidak terlihat.
• Penyebab: Atribut app:use_controller="false" di PlayerView atau PlayerView.setUseController(false) dipanggil.
• Solusi: Pastikan app:use_controller="true" di XML layout atau setel secara programatis dengan binding.videoPlayerView.useController = true.

4. Video Berhenti Saat Layar Mati atau Aplikasi ke Background

• Gejala: Video berhenti memutar saat layar perangkat mati atau pengguna beralih ke aplikasi lain (kecuali di mode multi-window).
• Penyebab: Ini adalah perilaku normal jika Anda tidak mengimplementasikan pemutaran latar belakang menggunakan Service. Metode onPause() atau onStop() akan menghentikan pemutaran.
• Solusi: Jika Anda ingin pemutaran terus berjalan di latar belakang (misalnya untuk musik atau podcast), Anda perlu mengimplementasikan ExoPlayer dalam sebuah Foreground Service. Ini adalah topik yang lebih kompleks dan di luar cakupan panduan ini, tetapi penting untuk diketahui sebagai langkah selanjutnya.

Pengalaman dan Pertimbangan Praktis

Sebagai seorang developer yang sering bekerja dengan media, ada beberapa insight praktis yang bisa saya bagikan terkait implementasi video player di Android:

• Pengujian Multi-Perangkat dan Versi Android: Jangan pernah berasumsi video player Anda akan berfungsi sama di semua perangkat. Android fragmented, dan apa yang bekerja di emulator atau perangkat flagship terbaru mungkin tidak bekerja sempurna di perangkat lama atau yang lebih murah. Selalu uji di berbagai versi Android dan model perangkat.
• Optimasi Jaringan: Video streaming sangat sensitif terhadap kualitas jaringan. Di negara dengan koneksi internet bervariasi seperti Indonesia, pertimbangkan implementasi adaptif streaming (DASH/HLS) dan caching untuk pengalaman yang lebih mulus, terutama saat pengguna berpindah lokasi dengan kualitas sinyal yang berubah. ExoPlayer sudah mendukung ini secara default dengan MediaItem.
• Manajemen Baterai: Pemutaran video adalah operasi yang intensif sumber daya dan bisa menguras baterai dengan cepat. Pastikan Anda melepaskan (release()) player sesegera mungkin saat tidak digunakan. Pertimbangkan juga untuk menghentikan pemutaran saat aplikasi masuk ke background, kecuali ada kebutuhan spesifik untuk background playback.
• Error Logging dan Analytics: Implementasikan logging yang komprehensif untuk error pemutaran. Ini sangat berguna untuk mendiagnosis masalah di produksi. Gabungkan dengan solusi analytics untuk melacak metrik pemutaran seperti waktu rata-rata ditonton, buffering ratio, dan error rate.
• Keamanan: Jika Anda menyajikan konten pribadi atau berbayar, pastikan URL streaming Anda aman (HTTPS) dan pertimbangkan implementasi DRM untuk mencegah pembajakan.
• Accessibility: Jangan lupakan aksesibilitas. Tambahkan subtitle atau closed caption, dan pastikan kontrol player mudah diakses oleh pengguna dengan disabilitas.
• Konsumsi Data: Pengguna sering khawatir tentang penggunaan data seluler. Berikan opsi kepada mereka untuk mengontrol kualitas video atau mengunduh video untuk ditonton secara offline jika relevan.

FAQ

Apa perbedaan utama antara ExoPlayer dan MediaPlayer bawaan Android?

ExoPlayer lebih fleksibel, mendukung lebih banyak format streaming (DASH, HLS, SmoothStreaming), lebih mudah dikustomisasi, dan memiliki fitur-fitur canggih seperti DRM dan caching. MediaPlayer lebih sederhana, tetapi memiliki batasan dalam format, kustomisasi, dan performa di lingkungan produksi.

Bisakah ExoPlayer memutar video yang tersimpan secara lokal di perangkat?

Ya, tentu saja. Anda cukup mengganti URL streaming dengan path file lokal. Misalnya, MediaItem.fromUri(Uri.parse("file:///sdcard/Download/myvideo.mp4")) atau menggunakan Uri.fromFile(File("/sdcard/Download/myvideo.mp4")).

Bagaimana jika saya ingin tampilan kontrol video yang sepenuhnya kustom?

PlayerView memungkinkan Anda menonaktifkan kontrol bawaan dengan app:use_controller="false". Setelah itu, Anda bisa membuat tombol, seek bar, dan elemen UI lainnya sendiri, lalu menghubungkannya ke instance ExoPlayer menggunakan method seperti player.play(), player.pause(), player.seekTo(), dan mendengarkan status player melalui Player.Listener.

Apakah aplikasi saya memerlukan izin internet jika hanya memutar video lokal?

Tidak. Jika Anda hanya memutar video yang sudah ada di penyimpanan perangkat (bukan streaming dari internet), Anda tidak memerlukan izin android.permission.INTERNET. Namun, Anda mungkin memerlukan izin untuk membaca penyimpanan (READ_EXTERNAL_STORAGE) tergantung versi Android dan lokasi file.

Apakah ExoPlayer gratis untuk digunakan di aplikasi komersial?

Ya, ExoPlayer adalah library open-source di bawah lisensi Apache 2.0, sehingga gratis untuk digunakan baik di proyek pribadi maupun komersial.

Kesimpulan

Membangun video player di Android dengan Kotlin dan ExoPlayer adalah langkah yang esensial bagi banyak aplikasi modern. Dengan fleksibilitas, dukungan format yang luas, dan fitur-fitur canggihnya, ExoPlayer jelas merupakan pilihan terbaik untuk developer Android. Meskipun terlihat sederhana, implementasi yang solid memerlukan perhatian terhadap manajemen siklus hidup, penanganan error, dan pertimbangan performa.

Panduan ini telah mencakup langkah-langkah fundamental untuk mengintegrasikan ExoPlayer, termasuk setup proyek, layout XML, dan kode Kotlin untuk inisialisasi serta manajemen siklus hidup. Dengan fondasi ini, Anda siap untuk mengeksplorasi fitur-fitur lebih lanjut dan membangun pengalaman pemutaran video yang mulus dan profesional di aplikasi Android Anda.

TAGS: Kotlin, Android Development, ExoPlayer, Video Player, Android Tutorial, Mobile App, Programming, Developer Tools

Baca Juga

• Panduan Lengkap Belajar Coding untuk Pemula hingga Profesional

Related posts:

Memahami Konteks Model di Laravel untuk Dokumentasi Efektif (Bukan ‘MCP’ Resmi, Tapi Filosofinya Vital) Panduan Lengkap: Cara Install Laravel Terbaru di Windows untuk Developer Modern Panduan Lengkap: Cara Membuat Authentication JWT di Express.js untuk API Aman Map vs Object: Kapan Sebaiknya Menggunakan Masing-Masing di JavaScript? Panduan Lengkap Developer Modern