ALGORITMA PEMPROGRAMAN - MIT

Algoritma pemrograman adalah serangkaian langkah atau instruksi yang sistematis dan logis untuk menyelesaikan suatu masalah dalam pemrograman komputer. Algoritma ini berfungsi sebagai panduan bagi program agar dapat dijalankan secara efisien dan menghasilkan output yang diinginkan.



Karakteristik Algoritma:

  1. Jelas (Definiteness): Setiap langkah harus memiliki instruksi yang jelas dan tidak ambigu.
  2. Terbatas (Finiteness): Algoritma harus memiliki jumlah langkah yang terbatas dan tidak berjalan tanpa henti.
  3. Masukan (Input): Algoritma bisa memiliki satu atau lebih input sebagai data awal.
  4. Keluaran (Output): Algoritma harus menghasilkan satu atau lebih keluaran sebagai hasil pemrosesan.
  5. Efektifitas (Effectiveness): Setiap langkah dalam algoritma harus sederhana dan bisa dijalankan dalam waktu yang masuk akal.

Contoh Algoritma Sederhana:

Misalnya, kita ingin membuat algoritma untuk menghitung luas persegi panjang:

  1. Mulai
  2. Masukkan panjang dan lebar
  3. Hitung luas dengan rumus: luas = panjang × lebar
  4. Tampilkan hasil luas
  5. Selesai

Dalam bentuk pseudocode, bisa ditulis seperti ini:


BEGIN
Read panjang
Read lebar
luas ← panjang * lebar
Print luas
END

Atau dalam bahasa Python:


panjang = float(input("Masukkan panjang: "))
lebar = float(input("Masukkan lebar: "))
luas = panjang * lebar
print("Luas persegi panjang:", luas)

Algoritma yang baik akan membuat program lebih efisien, mudah dipahami, dan dioptimalkan untuk berbagai kebutuhan.


Belajar Menggunakan MIT

MIT App Inventor adalah platform berbasis web yang memungkinkan pengguna, termasuk pemula, untuk membuat aplikasi Android dengan metode pemrograman berbasis blok (block-based programming). Platform ini dikembangkan oleh Massachusetts Institute of Technology (MIT) dan dirancang agar mudah digunakan tanpa perlu keahlian coding yang mendalam.

Fitur Utama MIT App Inventor:

  1. Pemrograman Blok (Block-Based Coding)

    • Menggunakan sistem drag-and-drop, mirip dengan puzzle, sehingga lebih mudah dipahami oleh pemula.
  2. Antarmuka Visual (Visual Interface)

    • Memungkinkan pengguna merancang tampilan aplikasi dengan metode seret dan lepas (drag & drop).
  3. Kompatibilitas dengan Android

    • Aplikasi yang dibuat dapat langsung diuji di perangkat Android atau emulator.
  4. Konektivitas dengan Perangkat Keras

    • Mendukung penggunaan sensor, GPS, kamera, Bluetooth, dan lain-lain.
  5. Dukungan Cloud

    • Proyek aplikasi disimpan secara online, sehingga bisa diakses dari berbagai perangkat.

Keunggulan MIT App Inventor:

✅ Cocok untuk pemula, termasuk pelajar dan guru
✅ Tidak perlu menulis kode pemrograman secara manual
✅ Gratis dan berbasis open-source
✅ Bisa digunakan untuk membuat aplikasi sederhana hingga kompleks

Contoh Penggunaan:

  • Membuat aplikasi kuis interaktif
  • Aplikasi penghitung langkah (pedometer) menggunakan sensor
  • Aplikasi pengingat jadwal dengan notifikasi
  • Aplikasi chatbot sederhana

MIT App Inventor sangat cocok bagi yang ingin belajar membuat aplikasi tanpa harus menguasai bahasa pemrograman kompleks seperti Java atau Kotlin.

Aplikasi : https://appinventor.mit.edu/



Create Apps



Halaman Designer

Pada halaman designer terdapat beberapa jendela seperti Palette, Viewer, Components, Media, dan Properties. Tools tersebut berfungsi untuk mendesain tampilan aplikasi android sesuai keinginan.

  1. Palette merupakan jendela tempat mengambil komponen-komponen yang dikategorikan dalam beberapa kategori untuk dimasukkan dalam aplikasi yang dibuat. Terdapat kategori User Interface, Layout, Media, Drawing and Animation, Maps, Sensors, Social, Storage, Connectivity, LEGO MINDSTORMS, Experimental, dan Extension.
  2. Viewer merupakan tempat untuk mengatur tampilan komponen pada aplikasi nantinya.
  3. Components merupakan tempat untuk mengatur komponen-komponen yang telah diletakkan di viewer, seperti misalnya mengganti nama komponen, dan menghapus komponen.
  4. Properties merupakan tempat untuk mengatur properti layar, dan komponen-komponen yang digunakan pada aplikasi yang sedang dibuat seperti lebar, tinggi, warna latar, besar huruf, dll.
  5. Media merupakan tempat untuk mengunggah gambar untuk digunakan pada aplikasi yang sedang dibuat.

Pada bagian Palette terdapat komponen penyusun untuk mendesain aplikasi, berikut adalah komponen penyusunnya:

1. User Interface

Simbol

Nama

Fungsi

buttonmit
ButtonDapat mendeteksi ketukan, hold down ketika pengguna menekan tombol, atau ketika pengguna melepas tombol. Ketika button mendeteksi salah satu dari hal tersebut, button akan menjalankan perintah.
checkboxmit
CheckboxDapat mendeteksi ketukan dari pengguna dan mengganti state-nya menjadi true/false (boolean).
datepickermit
Date PickerMemunculkan kalender untuk memilih tanggal.
imagemit
ImageMemasukkan gambar dalam aplikasi.
labelmit
LabelMenampilkan teks dalam aplikasi.
listpickermit
List PickerMenampilkan list yang dapat dipilih oleh pengguna ketika pengguna menekan list.
listviewmit
List ViewMenampilkan list.
notifiermit
NotifierMemunculkan pesan/peringatan pop-up pada aplikasi. Pesan dapat hilang secara otomatis, atau harus menerima input dari pengguna terlebih dahulu baru menghilang.
passwordtextboxmit
Password Text BoxMenyediakan textbox yang menyembunyikan teks yang dimasukkan.
slidermit
SliderMenyediakan progress bar yang dapat digeser.
spinnermit
SpinnerMenampilkan pop-up list dengan elemen yang dapat dipilih ketika ditekan.
textboxmit
Text BoxMenyediakan area untuk mengetik teks.
timepicketmit
Time PickerMemunculkan jam untuk memilih waktu.
webviewermit
Web ViewerMenyediakan area yang dapat menampilkan laman web.
2. Layout

Simbol

Nama

Fungsi

horizontalarrangementmit
Horizontal ArrangementMenyusun komponen secara horizontal.
horizontalscrollarrangementmit
Horizontal Scroll ArrangementMenyusun komponen secara horizontal, namun jika lebar komponen melebihi lebar komponen ini, maka dapat digeser (scroll).
tablearrangementmit
Table ArrangementMembuat tabel.
verticalarrangementmit
Vertical ArrangementMenyusun komponen secara vertikal.
verticalscrollarrangementmit
Vertical Scroll ArrangementMenyusun komponen secara vertikal, namun jika tinggi komponen melebihi tinggi komponen ini, maka dapat digeser (scroll).
3. Media

Simbol

Nama

Fungsi

camcordermit
CamcorderMengaktifkan kamera HP dan merekam.
cameramit
CameraMengaktifkan kamera HP dan memotret.
imagepickermit
Image PickerMenampilkan galeri pada aplikasi. Pengguna dapat memilih gambar yang akan disimpan dari galeri yang ditampilkan.
playermit
PlayerMemainkan musik/audio dan mengatur vibrasi HP.
soundmit
SoundMemainkan musik/audio dan mengatur vibrasi HP dalam interval waktu tertentu.
soundrecordermit
Sound RecorderMerekam suara.
speechrecognizermit
Speech RecognizerMengkonversi suara menjadi teks menggunakan fitur speech recognition pada HP.
texttospeechmit
Text to SpeechMengkonversi teks menjadi suara. Pitch dan kecepatan pembacaan dapat diatur.
videoplayermit
Video PlayerMemutar video serta menampilkan pengaturannya.
yandextranslatemit
Yandex TranslateMenerjemahkan teks dari satu bahasa ke bahasa yang lainnya.
4. Drawing and Animation

Simbol

Nama

Fungsi

ballmit
BallSprite bola yang dapat berinteraksi pada sentuhan dan tarikan, serta berinteraksi dengan sprite lainnya pada kanvas.
canvasmit
CanvasKanvas tempat sprite berinteraksi dengan pengguna atau dengan sprite lainnya, atau tempat pengguna menggambar.
imagespritemit
Image SpriteSprite gambar yang dapat berinteraksi pada sentuhan dan tarikan, serta berinteraksi dengan sprite lainnya pada kanvas.
5. Maps

Simbol

Nama

Fungsi

circlemit
CircleMemvisualisasikan lingkaran dengan radius tertentu (dalam meter) pada koordinat tertentu. Dapat juga digunakan untuk menjalankan program ketika pengguna berada di suatu area.
featurecollectionmit
Feature CollectionMengelompokkan fitur-fitur Maps. Event yang terjadi pada salah satu komponen pada kelompok tersebut, akan memicu event pada komponen-komponen lainnya.
linestringmit
Line StringMenggambar garis pada peta.
mapmit
MapMenampilkan peta pada layar aplikasi.
markermit
MarkerMemberi tanda pada suatu lokasi di peta.
polygonmit
PolygonMembuat perimeter pada peta.
rectanglemit
RectangleMerupakan polygon dengan garis lintang dan garis bujur untuk batas utara, selatan, timur, dan barat. Jika sudut segiempat dipindahkan, maka informasi koordinat akan diperbaharui.
6. Sensors

Simbol

Nama

Fungsi

acceleromit
Accelerometer SensorMendeteksi goyangan dan percepatan dalam m/s2.
barcodemit
Barcode ScannerMembaca barcode.
gyroscopemit
Gyroscope SensorMengukur kecepatan sudut dalam derajat/detik.
locationmit
Location SensorMenyediakan informasi geografis seperti koordinat, ketinggian, kecepatan, dan alamat. Dapat juga mengkonversi alamat menjadi koordinat.
nearfieldmit
Near FieldMemungkinkan aplikasi mengaktifkan fitur komunikasi jarak dekat (NFC).
orientationmit
OrientationMenentukan orientasi HP.
pedometermit
PedometerMenentukan banyaknya langkah, dan jarak yang ditempuh.
proximitymit
Proximity SensorMengukur jarak antara objek dengan layar HP.
7. Social

Simbol

Nama

Fungsi

contactpickermit
Contact PickerMenampilkan list berisi kontak ketika ditekan.
emailpickermit
Email PickerMenampilkan list berisi email ketika pengguna mengetikkan kata kunci ataupun email dari orang yang dituju.
phonecallmit
Phone CallMelakukan panggilan telepon.
phonenumberpickermit
Phone Number PickerMenampilkan list berisi nomor kontak pada layar HP.
sharingmit
SharingMemungkinkan pertukaran berkas atau pesan antara satu aplikasi dengan aplikasi lainnya yang terdapat pada HP.
textingmit
TextingMengirim pesan teks ke suatu nomor kontak.
twittermit
TwitterMemungkinkan komunikasi dengan Twitter sehingga pengguna dapat membuat tweet, melihat tweet, dll.
8. Storage

Simbol

Nama

Fungsi

filemit
FileMenerima atau mengirim berkas. Dapat juga digunakan untuk membaca atau menulis berkas.
fusiontablesmit
Fusiontables ControlMemungkinkan komunikasi dengan Google Fusion Table. Google Fusion Table dapat menyimpan, membagikan, query, dan memvisualisasikan tabel data.
tinydbmit
TinyDBMenyimpan data untuk aplikasi sehingga ketika aplikasi ditutup, dan kemudian dibuka kembali, data masih tersimpan.
tinywebdbmit
TinyWebDBMenyimpan data pada web.
9. Connectivity

Simbol

Nama

Fungsi

activitystartermit
Activity StarterMemanggil aplikasi lain.
bluetoothclientmit
Bluetooth ClientMembuat aplikasi sebagai Bluetooth client.
bluetoothservermit
Bluetooth ServerMembuat aplikasi sebagai Bluetooth server.
webmit
WebMemungkinkan aplikasi untuk berinteraksi dengan web dan menyediakan fungsi untuk HTTP GET, POST, PUT, dan DELETE.
10. Experimental

Simbol

Nama

Fungsi

clouddbmit
CloudDBMemungkinkan pengguna aplikasi untuk saling bertukar data pada database dengan software Redis.
firebasedbmit
FirebaseDBMemungkinkan pengguna aplikasi untuk saling bertukar data pada database dengan Firebase.

Halaman Blocks

Pada halaman blocks terdapat beberapa codeblock yang berfungsi untuk memprogram aplikasi android sesuai yang diinginkan. Pada halaman block terdapat beberapa komponen seperti Control, Logic, Math, Text, Lists, Colors, Variables, dan Procedures. Berikut adalah komponen yang terdapat pada halaman blocks:

1. Control

Blok Kode

Fungsi

controlmit1
If kondisional. Jika “if” memenuhi syarat, maka blok yang ada setelah “then” dieksekusi.
controlmit2
Looping dari angka pertama hingga angka terakhir dengan suatu interval. Maka gambar disamping berarti loop dari angka 1 hingga 5 dengan interval 1: 1, 2, 3, 4, 5.
controlmit3
For bertingkat. Untuk setiap objek dalam list, dilakukan looping.
controlmit4
Jika nilai test true, maka loop while berjalan.
2. Logic

Blok Kode

Fungsi

logicmit1a logicmit1b
Boolean true/false.
logicmit2
Jika dipasangkan dengan true/false maka true menjadi false, dan false menjadi true.
logicmit3
Memeriksa apakah satu objek sama dengan/tidak sama dengan objek di kanan. Jika sesuai kriteria, maka blok akan bernilai true, dan false jika tidak sesuai.
logicmit4
Pada logika and jika kedua syarat terpenuhi, maka nilainya menjadi true. Sedangkan pada logika or, jika salah satu syarat atau keduanya terpenuhi, maka nilainya menjadi true.
3. Math

Blok Kode

Fungsi

mathmit1
Digunakan untuk menginput angka.
mathmit2
Digunakan untuk membandingkan dua angka. Perbandingan dapat berupa sama dengan, tidak sama dengan, lebih dari, kurang dari, lebih dari sama dengan, dan kurang dari sama dengan.
mathmit3
Operasi matematika dasar, yaitu tambah, kurang, kali, bagi, pangkat, dan modulus.
mathmit4
Mengambil nilai integer secara acak dari range yang ditentukan.
mathmit5
Operasi trigonometri sin, cos, tan.
4. Text

Blok Kode

Fungsi

textmit1
Teks kosong.
textmit2
Menggabungkan dua atau lebih teks.
textmi3
Memeriksa jika teks kosong atau tidak.
textmit4
Memeriksa apakah ada bagian tertentu dalam suatu teks.
textmi5
Memisahkan teks pada penanda tertentu dan membuatnya menjadi list.
5. List

Blok Kode

Fungsi

listmit1
Membuat list kosong.
listmit2
Membuat list.
listmit3
Menambahkan elemen pada list.
listmit4
Memeriksa apakah ada elemen tertentu pada list.
listmit5
Memeriksa banyaknya elemen pada list.
listmit6
Memeriksa apakah list kosong atau tidak.
listmit7
Mengambil elemen dari suatu list.
listmit8
Menghapus elemen dari suatu list.
6. Colors

Blok Kode

Fungsi

colorsmit1
Pilihan warna yang disediakan MIT AI.
colorsmit2
Membuat warna sendiri dengan menggunakan kode RGB warna.
7. Variables

Blok Kode

Fungsi

variablesmit1
Membuat suatu variabel global.
variablesmit2
Mengambil variabel global.
variablesmit3
Memodifikasi isi dari variabel global.
8. Procedure

Blok Kode

Fungsi

proceduremit1
Membuat suatu prosedur.
proceduremit2
Membuat suatu fungsi yang mengembalikan hasil tertentu.

Menghubungkan ke ANTARES

Setelah kita mengetahui tentang MIT App Inventor dan fitur-fitur yang ada, selanjutnya kita akan membuat sebuah aplikasi yang akan terhubung ke server ANTARES untuk mengirim dan menerima data.

A. Kirim Data ke Server

Kirim data (post) pada bagian MIT App Inventor, merupakan perintah yang digunakan dalam aplikasi MIT App Inventor untuk dapat melakukan post data secara manual dari data yang kita input dalam “text box” MIT App Inventor ke Platform ANTARES. Sebelum membuat code blocks untuk aplikasi Post, dapat dilakukan dengan membuat desain terlebih dahulu. Desain komponen yang telah kita buat tersebut, berfungsi sebagai tools yang akan membantu pengguna untuk dapat menjalankan aplikasi yang telah dibuat. Contoh desain untuk aplikasi Post Data dari MIT App Inventor ke ANTARES sebagai berikut:

postdatamit

Gambar 3. Tampilan Desain Aplikasi Post Data Sederhana

Desain di atas menggunakan beberapa komponen, yaitu:

No.

Palette

Komponen

Nama Komponen

1User InterfaceLabelHeader
2User InterfaceLabelTemperature
3User InterfaceLabelHumidity
4User InterfaceTextBoxTextBox1
5User InterfaceTextBoxTextBox2
6User InterfaceButtonPostButton
7LayoutHorizontalArrangementHorizontalArrangement1
8LayoutHorizontalArrangementHorizontalArrangement2
9ConnectivityWebWeb1

Setelah kita membuat desain tampilan aplikasi, langkah selanjutnya yang harus dilakukan yaitu membuat program untuk menjalankan aplikasi sesuai dengan tujuan. Untuk memprogramnya kita gunakan code blocks yang terdapat pada halaman blocks.


Untuk dapat mengirim data ke server ANTARES, format pengiriman data menggunakan format JSON. Berikut di bawah ini adalah format JSON beserta code blocks:

{
	"m2m:cin":{
		"con":"{\"key1\":integer-value, \"key2\":\"string-value\", \"keyN\":\"valueN\"}"
		}
						
JSON

codeblockpostmit

Gambar 4. Code Block Post Data ke ANTARES

Setelah kita membuat desain dan program untuk aplikasinya, selanjutnya kita akan melihat data yang dikirim ke server melalui console ANTARES (https://console.antares.id/dashboard/application). Berikut adalah data yang ditampilkan pada console ANTARES:

consolepostmit

Gambar 5. Console Pada ANTARES

B. Menerima Data dari Server

Aplikasi Get data dengan MIT App Inventor merupakan aplikasi sederhana yang akan menampilkan data yang kita ambil dari suatu platform melalui URL dan Header. Dalam proses Get Data ini menggunakan platform ANTARES. Contoh yang kami buat ini, mencoba untuk melakukan get data dari documentations ANTARES “Retrieve Latest Data”. Sebelum membuat aplikasi Get Data pada MIT App Inventor, terlebih dahulu kita buat desain untuk aplikasinya seperti berikut :

desaingetdatamit

Gambar 6. Tampilan Desain Aplikasi Get Data Sederhana

Desain di atas menggunakan beberapa komponen, yaitu:

No.

Palette

Komponen

Nama Komponen

1User InterfaceButtonButton
2User InterfaceLabelHeader
3ConnectivityWebWeb1

Setelah kita membuat desain aplikasinya, selanjutnya kita program dengan menggunakan code blocks yang tersedia sebagai berikut:

codeblockgetmit

Gambar 7. Code Block Aplikasi Get Data

Setelah kita mendesain dan memprogram aplikasinya, maka kita dapat melihat hasilnya pada aplikasi android yang kita buat tadi. Data yang ditampilkan yaitu data terakhir dari console di ANTARES yang memiliki format JSON. Berikut adalah tampilan hasilnya:

hasilgetdatamit

Gambar 8. Tampilan Hasil Aplikasi Get Data

C. Menerima Data Realtime

Pada bagian ini, dibuat sebuah aplikasi yang dapat mengambil data dari Antares, menampilkannya pada layar, dan memperbaharui data yang ditampilkan secara otomatis apabila pengguna ingin mendapatkan live measurement. Data yang diambil merupakan data temperatur dan kelembaban yang didapat dengan menggunakan sensor DHT11. UI pada aplikasi ini terdiri dari 3 bagian, yaitu bagian instruksi, bagian hasil, dan bagian preview. Berikut pengaturan user interface yang dibuat pada tab “Designer” MIT App Inventor (AI):

desainrealtimemit

Gambar 9. Tampilan Desain Aplikasi Data Realtime

Desain di atas menggunakan beberapa komponen, yaitu:

No.

Palette

Komponen

Nama Komponen

1User InterfaceLabelLabel1
2LayoutHorizontalArrangementHorizontalArrangement1
3User InterfaceButtonBGet
4User InterfaceCheckBoxCBLiveMeasurement
5User InterfaceLabelLRC
6User InterfaceLabelLabel2
7LayoutHorizontalArrangementHorizontalArrangement2
8User InterfaceLabelLabel5
9User InterfaceLabelLTemp
10LayoutHorizontalArrangementHorizontalArrangement3
11User InterfaceLabelLabel6
12User InterfaceLabelLHum
13User InterfaceLabelLabel3
14User InterfaceLabelLRaw
15User InterfaceLabelLabel4
16LayoutHorizontalArrangementHorizontalArrangement4
17LayoutHorizontalArrangementHorizontalArrangement5
18LayoutHorizontalArrangementHorizontalArrangement6
18LayoutHorizontalArrangementHorizontalArrangement6
19User InterfaceLabelLabel7
20User InterfaceLabelLJSON1
21User InterfaceLabelLabel9
22User InterfaceLabelLJSON2
23User InterfaceLabelLabel11
24User InterfaceLabelLJSON3
25User InterfaceLabelLParsed
26ConnectivityWebWeb1
27SensorsClockClock1

Setelah kita membuat desain aplikasinya, selanjutnya kita program dengan menggunakan code blocks yang tersedia sebagai berikut:

codeblockrealtimemit1 codeblockrealtimemit2 codeblockrealtimemit3 codeblockrealtimemit4 codeblockrealtimemit5 codeblockrealtimemit6 codeblockrealtimemit7 codeblockrealtimemit8 codeblockrealtimemit9 codeblockrealtimemit10 codeblockrealtimemit11

Gambar 10. Code Block Aplikasi Data Realtime

Setelah kita mendesain dan memprogram aplikasinya, maka kita dapat melihat hasilnya pada aplikasi android yang kita buat. Data yang ditampilkan yaitu data terakhir dan akan terus merefresh otomatis. Berikut adalah tampilan hasilnya:

datarealtime1

Gambar 11. Tampilan Hasil Aplikasi Data Realtime





No comments: