Reading Requirement:

Project ini menjelaskan tentang bagaimana cara mengambil data dari device yang terhubung dengan www.geeknesia.com menggunakan MIT Inventor. Ini adalah tutorial pengambilan data dari Geeknesia berupa Temperature dan Humidity.


Tahap pertama masuk ke link ini: MIT Inventor 2 .kemudian klik Login.


Dan jika belum memiliki akun , cobalah lakukan registrasi pada form registrasi seperti gambar di bawah ini.


Jika telah berhasil Login, pada halaman Home, scroll ke halaman paling bawah kemudian pilih MIT App Inventor.


Maka akan muncul tampilan seperti di bawah, kemudian pilih Get Started untuk download dan install MIT Inventor 2


Setelah ter-install maka akan muncul tampilan seperti di bawah ini. 


Kemudian pilih Start New Project untuk memulai project baru.


Maka akan muncul tampilan blank project seperti gambar di bawah



Klik dan geser untuk menambahkan koomponen pada screen .


Tambahkan komponen label pada screen, maka akan muncul pada Viewer Screen1 "Text for Label" , anda bisa mengganti nama atau menghapus komponen pada kolom Components, dan meng-edit pada kolom Properties.


Buatlah 3 komponen kemudian rename dan edit text seperti gambar di bawah ini, kemudian tambahkan komponen clock dan web.


Clock1  TimerInterval = 500 (0.5 detk) adalah waktu yang ditentukan untuk update data per 0.5 detik. dan untuk Web1 biarkan default setting.


Klik Block pada bagian kanan layar PC.


Di bawah ini adalah halaman untuk membuat code yang diinginkan , caranya sama dengan membuat screen, tinggal seret code yang akan dipakai, dan untuk menghapus seret ke icon tong sampah.



Buatlah code seperti di bawah ini.


code1

Code di atas adalah variable yang diperlukan pada project ini, untuk api_key gunakan api_key device yang akan diambil datanya dari Geeknesia.


code2

Ini adalah settingan Timer/komponen Clock.


code3

Code untuk menampilkan data API dari cloud www.geeknesia.com.




Kemudian untuk melihat pengambilan data API berhasil atau tidak,  sebelum nya download dan install MIT Inventor Companion pada smartphone anda di google play, jika sudah kembali ke MIT App Inventor 2 di  PC anda. klik Connect kemudian pilih AI Companion maka akan muncul code QR.



Kemudian buka aplikasi MIT yang sudah didownload dan terinstall di smartphone anda, pilih scan QR code. kemudian scan barcode yang muncul tadi di PC anda, klik connect with code.



Jika sudah terhubung dan berhasil mengambil data API dari geeknesia, maka akan muncul tampilan seperti di bawah ini.

 

Pada gambar di atas sudah terlihat jelas bahwa data ini lah yang di butuhkan untuk ditampilkan, namun dalam project ini, data yang kita butuhkan hanya 3 variable, yaitu "datetime", "Humidity, dan "Temperature".

Untuk mengambil data yang dibutuhkan kita perlu melakukan parsing data, atau memotong(mengambil) data.



Tambahkan variable tempData dan response pada code1 seperti gambar di bawah ini,


Kemudian buatlah fungsi untuk membuat parsing data .

Pada code di atas adalah memotong data API yang tadi didapat menjadi 2 bagian, startTag dan endTag.

jsonResponse = data yang di dapat.

startTag         = data pertama yang disimpan 

endTag          = data kedua yang disimpan.




Pada code3, include 3 data yang akan diambil "datetime","Humidity", dan "Temperature".


contoh pengambilan data Humidity:

startTag = "name":Humidity":"value":

endTag  = }

lakukan hal yang sama untuk mengambil data yang lainnya,


kemudian tes project Connect=>AI Companion=> kemudian scan QR.


Jika berhasil maka tampilan akan seperti di bawah.




Untuk membuat agar project ini menjadi sebuah aplikasi klik Build, pilih App(provide QR code for.apk) atau App(save.apk to my computer)



Untuk merubah nama dan Icon apk,Pilih kolom Properties,kemudian ganti AppName dan unggah Icon.


Jika sudah coba install dan running di smartphone anda, jika berhasil, sekarang anda mempunyai aplikasi project Temperature & Humidity ini di smartphone anda.