🚀 Pembelajaran Flutter Berbasis Praktik: Siswa Belajar Mendalam Lewat Aplikasi Kalkulator BMI

🚀 Pembelajaran Flutter Berbasis Praktik: Siswa Belajar Mendalam Lewat Aplikasi Kalkulator BMI

Pembelajaran pemrograman mobile di SMK tidak lagi sekadar menulis baris kode, tetapi membangun cara berpikir logis, terstruktur, dan solutif. Hal inilah yang diterapkan dalam pembelajaran Flutter melalui proyek Aplikasi Kalkulator BMI (Body Mass Index).

Dalam kegiatan ini, siswa tidak hanya diarahkan untuk menghasilkan sebuah aplikasi, tetapi diajak memahami bagaimana Flutter bekerja, mulai dari struktur dasar hingga konsep pengelolaan data (state) dan CRUD sederhana.


📱 Belajar Flutter dengan Studi Kasus Nyata

Aplikasi Kalkulator BMI dipilih karena dekat dengan kehidupan sehari-hari dan memiliki kompleksitas yang pas untuk pembelajaran. Melalui aplikasi ini, siswa mempraktikkan:

  • Penyusunan antarmuka (UI) menggunakan widget Flutter

  • Pengelolaan input pengguna melalui TextField

  • Perhitungan logika BMI

  • Penyimpanan dan penghapusan data riwayat

Dengan pendekatan ini, siswa tidak hanya “bisa menjalankan aplikasi”, tetapi juga memahami alur data dan perubahan tampilan secara reaktif.


🧠 Penekanan Konsep, Bukan Sekadar Hasil

Pembelajaran dirancang secara bertahap dan mendalam. Siswa diajak memahami bahwa dalam Flutter:

Perubahan data akan memicu perubahan tampilan.

Konsep ini diperkuat melalui pembahasan:

  • Perbedaan StatelessWidget dan StatefulWidget

  • Peran state dalam aplikasi

  • Fungsi setState() sebagai pemicu pembaruan UI

Setiap tahap praktikum disertai diskusi dan refleksi, sehingga siswa tidak hanya menyalin kode, tetapi mampu menjelaskan fungsi dan alasan penggunaan setiap bagian program.


🛠 Praktikum Aktif dan Terarah

Kegiatan pembelajaran berlangsung dalam suasana praktik aktif. Siswa membangun aplikasi secara bertahap:

  1. Membuat struktur dasar aplikasi Flutter

  2. Menyusun tampilan input dan tombol

  3. Mengimplementasikan logika perhitungan BMI

  4. Menyimpan hasil ke dalam daftar riwayat (Create)

  5. Menghapus data riwayat (Delete)

Pendekatan ini melatih siswa memahami konsep CRUD tanpa harus langsung menggunakan database, sehingga fondasi berpikirnya menjadi lebih kuat.


🔍 Refleksi dan Penguatan Pemahaman

Di akhir pembelajaran, siswa diajak melakukan refleksi melalui pertanyaan pemantik yang mendorong Higher Order Thinking Skills (HOTS), seperti:

  • Mengapa halaman tertentu harus menggunakan StatefulWidget?

  • Apa yang terjadi jika setState() tidak digunakan?

  • Apakah penyimpanan data dalam List sudah bisa disebut CRUD?

Refleksi ini membantu siswa mengaitkan praktik dengan konsep, sekaligus menyiapkan mereka untuk materi lanjutan.


🌱 Bekal Menuju Materi Lanjutan

Pembelajaran ini menjadi fondasi penting sebelum siswa melangkah ke tahap berikutnya, seperti:

  • Penggunaan SQLite untuk penyimpanan data permanen

  • Pengelolaan state yang lebih kompleks

  • Pengembangan aplikasi skala industri

Dengan dasar yang kuat, siswa lebih siap menghadapi tantangan pemrograman mobile di dunia kerja maupun pendidikan lanjutan.


Belajar Flutter bukan tentang seberapa cepat aplikasi jadi, tetapi seberapa dalam siswa memahami alur berpikir di baliknya.
Melalui pembelajaran berbasis praktik ini, siswa tidak hanya belajar membuat aplikasi, tetapi juga membangun pola pikir sebagai calon pengembang aplikasi profesional.


Handout Materi 

Memahami struktur dasar Flutter: UI, LOGIC AND STATE by Darsu Darsu

Share:

48 komentar:

  1. https://azkayaqiz.blogspot.com/2026/02/membangun-aplikasi-bmi-calculator.html

    BalasHapus
  2. https://rasyamobilenewws.blogspot.com/2026/02/membuat-bmi-calc-apps-di-flutter.html

    BalasHapus
  3. https://ryntoosulis.blogspot.com/2026/02/bmi-calculator-apps.html

    *Rianto*

    BalasHapus
  4. https://revanmobile.blogspot.com/2026/02/calculator-cara-mudah-mengetahui-berat.html

    BalasHapus
  5. https://mizanahmadalfahreziiiiiiiiiii.blogspot.com/2026/02/bmimizan.html

    BalasHapus
  6. https://mediahits2.blogspot.com/2026/02/bmi-calculator-flutter.html

    BalasHapus
  7. https://syahhhrullll.blogspot.com/2026/02/membuat-bmi-crud-calc.html

    BalasHapus
  8. https://riannnnnnnnnnnnnnn.blogspot.com/2026/02/membuat-bmi-calc-apps.html

    BalasHapus
  9. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  10. https://alimobileprogram.blogspot.com/2026/02/membuat-aplikasi-kalkulator-bmi.html

    BalasHapus
  11. https://mrizkyfirmansyahsmk.blogspot.com/2026/02/panduan-lengkap-membuat-aplikasi.html

    BalasHapus
  12. https://alfinfauzannn.blogspot.com/2026/02/membuat-bmi-calculator-dengan-flutter.html

    BalasHapus
  13. https://melbyatussiva9.blogspot.com/2026/02/melbymembuatapkcalculatorbmi.html?m=1

    BalasHapus
  14. https://dikasaputra41227.blogspot.com/2026/02/uilogic-state-in-flutter-bmi-calc-apps.html

    BalasHapus
  15. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  16. https://destaadilaa14.blogspot.com/2026/02/aplikasi-bmi-calculator-flutter.html

    BalasHapus
  17. dara tri yuliani
    https://daratriyuliani.blogspot.com/2026/02/bmi-calculator-dara.html

    BalasHapus
  18. https://sandidarmakusumah.blogspot.com/2026/02/membuat-aplikasi-kalkulator-bmi-modern.html

    BalasHapus
  19. https://kirenrp16.blogspot.com/2026/02/bmi-calc-apps.html

    BalasHapus
  20. https://sifanurulinsani.blogspot.com/2026/02/bmi-calc-apps.html

    BalasHapus
  21. https://ridwansahidin14.blogspot.com/2026/02/membuat-sebuah-bmi-calculator.html

    BalasHapus
  22. https://azzuralavashadewi.blogspot.com/2026/02/membuat-aplikasi-bmi-calculator.html

    BalasHapus
  23. https://isabanjarsari.blogspot.com/2026/02/bmi-calculator-aplikasi-flutter.html

    BalasHapus
  24. https://yuniyasihxipplg1.blogspot.com/2026/02/aplikasi-bmi.html

    BalasHapus
  25. https://restiindiani.blogspot.com/2026/02/bmi-calculator-apps.html

    Resti Indiani

    BalasHapus
  26. https://epan77.blogspot.com/2026/02/aplikasi-praktis-untuk-menghitung-dan.html

    BalasHapus
  27. https://fitraanzani.blogspot.com/2026/02/membuat-aplikasi-bmi-calc-apps.html

    BalasHapus
  28. https://belajar-bersama-darsu.blogspot.com/2026/02/pembelajaran-flutter-berbasis-praktik.html?m=1

    XI RPL 2 Wisnu Nugroho

    BalasHapus
  29. https://zakyblud.blogspot.com/2026/02/aplikasi-bmi-kalkulator.html

    XI RPL 2 Zaky Mubarok

    BalasHapus
  30. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  31. https://dhanisantibootloop.blogspot.com/2026/02/bmi-calculator.html

    Dhanis Fathan Gunawan XI RPL 2

    BalasHapus
  32. http://iqbalkeceahayyy.blogspot.com/2026/02/membuat-web-msibmi.html

    Muhammad Iqbal Ramadhan
    XI RPL 2
    10 - February - 2026

    BalasHapus
  33. https://goyblog1.blogspot.com/2026/02/bmi-aplikasi-smart-body-mass-index.html
    Yogi ardiansyah XI RPL 2

    BalasHapus
  34. https://cacasoft32.blogspot.com/2026/02/membuat-aplikasi-bmi-calculator-dengan.html

    Caca Ardiansyah
    XI RPL 2

    BalasHapus
  35. https://vinzz123.blogspot.com/2026/02/bmi.html?m=1

    Kevin Rafi Alfarizi | XI RPL 2

    BalasHapus
  36. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  37. https://kituwenya.blogspot.com/2026/02/blog-post.html

    Muhammad Farid Fayzul Haq

    BalasHapus
  38. https://nasyaa24.blogspot.com/2026/02/bmi-calculator.html

    BalasHapus
  39. https://maulidanaila0227.blogspot.com/2026/02/bmi-calculator.html

    BalasHapus
  40. https://sandimb.blogspot.com/2026/02/membuat-bmi-kalkulator.html

    BalasHapus
  41. https://sakonakokodudukwe.blogspot.com/2026/02/membuat-aplikasi-bmi-calcurator.html?m=1

    HIZKIL XI RPL 2

    BalasHapus
  42. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  43. https://dehira.blogspot.com/2026/02/membuat-aplikasi-bmi_9.html

    dehira zallea Iskandar
    XI RPL 2

    BalasHapus
  44. https://anaz7751.blogspot.com/2026/02/aplikasi-kalkulator-bmi-sederhana.html

    Rizqi Resdhiana XI RPL II

    BalasHapus
  45. https://gacorr011.blogspot.com/2026/02/membuat-aplikasi-kalkulator-bmi.html

    Gadiza Nugroho
    XI RPL 2

    BalasHapus
  46. https://likadwi43.blogspot.com/2026/02/membuat-aplikasi-kalkulator-bmi.html

    Alika Dwi Aryani
    XI RPL 2

    BalasHapus
  47. https://ristyfitria.blogspot.com/2026/02/bmi-calculator.html

    Risty
    XI RPL 2

    BalasHapus
  48. http://tiaraiay315.blogspot.com/2026/02/membuat-aplikasi-bmi-calculator.html

    Tiara Indah A
    XI RPL2

    BalasHapus

Blogger Tricks

Blogger Themes