Skip to main content
  1. Belajar/
  2. Data Science with Python/
  3. Membuat Dashboard Interaktif dengan Plotly/

Mengenal Library Dash

12 mins· loading · loading ·
Membuat Dashboard Interaktif dengan Plotly - This article is part of a series.
Part 4: This Article

Dalam dunia analisis data dan visualisasi, tidak hanya penting untuk menciptakan visualisasi yang informatif, tetapi juga untuk membagikan hasilnya dengan cara yang mudah diakses oleh orang lain. Dash, sebuah framework web interaktif yang dibangun di atas Flask, memberikan kemampuan kepada para ilmuwan data dan pengembang Python untuk membuat aplikasi web interaktif dengan mudah. Pada bagian ini, kita akan menjelajahi pengantar Dash dan mengapa ini menjadi alat yang efektif dalam membangun aplikasi web interaktif.

A. Apa itu Dash?
#

Dash adalah framework Python yang memungkinkan kita membuat aplikasi web interaktif menggunakan bahasa pemrograman yang sudah akrab: Python. Dikembangkan oleh tim Plotly, Dash memberikan solusi lengkap untuk membuat tampilan web yang interaktif tanpa memerlukan pengetahuan mendalam tentang HTML, CSS, atau JavaScript. Dengan Dash, kamu dapat membuat aplikasi web yang memiliki komponen seperti grafik, tabel, formulir, dan elemen-elemen interaktif lainnya.

B. Keunggulan Dash
#

1. Pemrograman dalam Python
#

Dash memungkinkan kita untuk membangun aplikasi web interaktif menggunakan Python, bahasa pemrograman yang banyak digunakan dalam dunia analisis data dan sains data.

2. Integrasi dengan Plotly
#

Dash memiliki integrasi yang erat dengan Plotly, library visualisasi data yang sangat kuat. Ini memungkinkan kita dengan mudah menyematkan grafik Plotly ke dalam aplikasi web kita.

3. Komponen Interaktif
#

Dash menyediakan berbagai komponen interaktif seperti grafik, dropdown, slider, dan lainnya. Semua komponen ini dapat diintegrasikan dan diatur menggunakan Python.

4. Sederhana dan Fleksibel
#

Dengan menggunakan sintaks yang sederhana, Dash memungkinkan kita membuat aplikasi web tanpa harus memiliki pengetahuan mendalam tentang pengembangan web. Namun, itu juga cukup fleksibel untuk memenuhi kebutuhan proyek yang lebih kompleks.

C. Bagaimana Dash Bekerja
#

Dash bekerja dengan menyediakan antarmuka Python untuk membangun dan mengatur struktur HTML, CSS, dan JavaScript yang dibutuhkan untuk aplikasi web. Saat aplikasi web dijalankan, Dash merender halaman HTML dan mengelola logika interaktivitasnya menggunakan JavaScript di sisi klien. Semua ini terjadi di belakang layar, dan sebagai pengguna Dash, kita dapat fokus pada logika dan komponen aplikasi tanpa harus terlalu memikirkan detil teknisnya.

D. Membuat Aplikasi Web Interaktif dengan Dash
#

Untuk mulai menggunakan Dash, kita perlu menginstal library Dash terlebih dahulu dengan menjalankan perintah:

pip install dash

Setelah terinstal, kita dapat membuat aplikasi Dash dengan menentukan struktur tata letak (layout) dan logika interaktivitasnya menggunakan Python.

import dash
import dash_html_components as html

# Inisialisasi aplikasi Dash
app = dash.Dash(__name__)

# Layout aplikasi
app.layout = html.Div("Halo, ini adalah aplikasi web interaktif pertamaku!")

# Menjalankan aplikasi
if __name__ == '__main__':
    app.run_server(debug=True)

Untuk menjalankan kode tersebut, ikuti langkah-langkah berikut:

  1. Salin kode Dash ke dalam sebuah file Python. Misalnya, beri nama file tersebut sebagai app.py dan tempatkan di direktori kerja kamu.

  2. Buka terminal atau command prompt dan arahkan ke direktori tempat kamu menyimpan file app.py.

  3. Jalankan script dengan mengetikkan perintah berikut:

python app.py

Setelah itu, kamu akan melihat output seperti berikut:

Dash is running on http://127.0.0.1:8050/

Buka browser web dan akses URL yang tercantum di output (biasanya http://127.0.0.1:8050/).

Aplikasi web Dash sederhana yang menampilkan pesan “Halo, ini adalah aplikasi web interaktif pertamaku!” sekarang dapat diakses melalui browser kamu.

Penjelasan:

  1. Impor Library dan Modul Dash:
  • import dash: Mengimpor modul utama Dash.
  • import dash_html_components as html: Mengimpor modul html dari Dash, yang digunakan untuk membuat elemen-elemen HTML di dalam layout aplikasi.
  1. Inisialisasi Aplikasi Dash:
  • app = dash.Dash(__name__): Membuat instance aplikasi Dash. Parameter __name__ digunakan untuk menentukan nama aplikasi.
  1. Layout Aplikasi:
  • app.layout = html.Div("Halo, ini adalah aplikasi web interaktif pertamaku!"): Mendefinisikan layout aplikasi menggunakan komponen html.Div. Di dalamnya, kita meletakkan teks “Halo, ini adalah aplikasi web interaktif pertamaku!” yang akan ditampilkan pada halaman web.
  1. Menjalankan Aplikasi:
  • if __name__ == '__main__': app.run_server(debug=True): Memeriksa apakah script dijalankan sebagai program utama. Jika iya, maka menjalankan server aplikasi Dash dengan mode debug aktif (debug=True).

Pada contoh di atas, kita membuat aplikasi web sederhana dengan pesan “Halo, ini adalah aplikasi web interaktif pertamaku!”. Tentu saja, ini hanya permulaan, dan Dash memungkinkan kita untuk membuat aplikasi web yang lebih kompleks dengan grafik interaktif, formulir, dan berbagai komponen lainnya.

Jika kamu ingin menutup aplikasi web Dash, kembali ke terminal atau command prompt dan tekan Ctrl + C. Selanjutnya, konfirmasikan untuk menghentikan aplikasi.

Membuat Dashboard Interaktif dengan Plotly - This article is part of a series.
Part 4: This Article