For you who don’t know about Hackathon. Hackathon is a competition where the participant given 24 hour to make an apps or IOT that can solve to a problem that related to the theme which has been specified. This process of making the apps or IOT is called “Hacking”.

So here is it… How To Hackathon !
Before joining Hackathon, make sure you already have an idea that related to the theme, and a team that can fullfil and execute that idea well.

Our team consists of three people. First one is a Web Developer, the second is a Desainer and the last is Android Developer which is me. We are the last team who registered to this competion and we three never joined Hackathon before.

During the “hacking” started, i worked on the application very casually, i thought the 24 hours given time it very enough if you use it well. Even, i still have time for playing Dota 2 and watching some videos. But, me and my team succeed to completed the applicaiton five hour before the “24 hours” deadline.

The room condition when “hacking” started is very intense, other participant look really focus and serious for completing the Application and the IoT. For your information, in this Hackathon all the competition categories are combined, so we who take part in the application hackathon will be judged on a par with those participating in the IoT category.

What we made ?

We made an application that can help you transfer balances between digital wallets.

Why we choose that idea?
For an idea to come up, you have to think about what problem you want to deal with!

Have you ever felt you have a balance on the GoPay application while the ongoing promo uses the OVO application?

In this case, we want to solve a problem where users of digital wallets have problems transferring balances between digital wallets, which are still not possible directly.

We created SPIN (the name of our application) where users can send balance transfers between one digital wallet and another.

What should be considered in choosing an idea?
When we already have a problem that we want to deal with. Make sure the ideas we think about can handle the problem well and to the point.

Don’t be so complex !
Think of an idea that can deal with the core of the problem, don’t think of an idea that is too complex that even makes us confused to explain it. If you can, the ideas that you think can be explained in one sentence.

Why don't you just use "this"?
If you think your idea is good and can solve the problem you want to handle. Try to express your ideas to people around you, friends, family, girlfriends and even strangers. And see how they respond?

For example, I have an idea to create a special online motorcycle taxi application to pick up children at school.

When expressing this idea if you get a response like “Why don’t you just use “gojek” ? Then you argue with … but this is specifically for children, but this blablabla, but this is …… if things are this happens, you can be sure your idea is not “different” enough.

When expressing a “different” idea the response that you will get will be like this “Oh think i gonna need it too”, “wow cool, I think many people need it too”, “Cool idea, there is not be anything like that” and the like.

Don’t be afraid your idea will be stolen! , listen what Mr. Nadiem said :

My last tip when following the Hackathon is to focus on the “main features”. Additional features can be added if there is time. Just take it easy and don’t forget to rest!

Good Luck I hope it will inspire you and give you an idea and courage for joining some competition!

Follow me on Instagram : https://www.instagram.com/azamkhtr/

Halo temen-temen semua maaf yah udah lama banget gak nulis lagi, oh iya sebelumnya saya janji untuk lanjutin tutorial “CRUD Android FAN”, nah sebelum saya melanjutkan itu saya ingin ngajarin kalian buat RESTFUL API yang nantinya akan kita gunakan pada tutorial “CRUD Android FAN yang baru”.

Disini saya menggunakan Lumen, apa itu lumen? Lumen adalah Micro-framework dari Laravel yang diperuntukan khusus untuk pembuatan RESTFUL API. Kalau kalian sebelumnya sudah pernah menggunakan Laravel, Lumen ini kurang lebih mirip seperti Laravel karena Lumen ini memang turunannya Laravel.

Sebelum kita lanjut ke teknis. Mari kita kenalan dulu sama RESTFUL API.

Apa itu RESTFUL API ? (klik url untuk penjelasan lebih lengkap)

REST (REpresentational State Transfer) merupakan standar arsitektur komunikasi berbasis web yang sering diterapkan dalam pengembangan layanan berbasis web.
(https://www.codepolitan.com/mengenal-restful-web-services)

API adalah singkatan dari Application Programming Interface. Merupakan suatu “penghubung” yang memungkinkan suatu aplikasi untuk berinteraksi dengan aplikasi lainnya dan berbagi data (https://en.wikipedia.org/wiki/Application_programming_interface).

Berikut 4 metode HTTP yang umum digunakan dalam arsitektur berbasis REST.

· GET, menyediakan hanya akses baca pada resource. (READ DATA)

· PUT, digunakan untuk menciptakan resource baru. (UPDATE DATA)

· DELETE, digunakan untuk menghapus resource. (DELETE DATA)

· POST, digunakan untuk memperbarui resource yang ada atau membuat resource baru. (CREATE DATA)
(https://www.codepolitan.com/mengenal-restful-web-services)

HTTP Method diatas nantinya akan kita gunakan untuk membuat RESTFUL API di Lumen.

Intinya REST API itu adalah sebagai penghubung antara “front-end/aplikasi” dengan suatu server-web sehingga berbagai “front-end/aplikasi” dapat menggunakan data yang sama dan tersinkronasi satu sama lain.

Nah, sekarang kita udah tau apa itu RESTFUL API.

Sebelumnya perlu diperhatikan, kamu sudah harus paham tentang konsep MVC terlebih dahulu agar dapat mengikuti tutorial dengan baik.
(https://id.wikipedia.org/wiki/MVC)

Software yang harus kamu install sebelum mengikuti tutorial ini (Download versi terbaru dan sesuai system komputer kamu) :

POSTMAN : https://www.getpostman.com/
COMPOSER : https://getcomposer.org/
TextEditor (VISUAL STUDIO CODE atau Lainnya) : https://code.visualstudio.com/
XAMPP : https://www.apachefriends.org/index.html

Jika semuanya sudah terinstall dengan benar

Sekarang saatnya kita mulai membuat RESTFUL API !

1. Instal Lumen
   
   Pertama-tama silahkan buka halaman documentasi lumen terlebih dahulu.
   
   Official website Lumen : https://lumen.laravel.com/
   Official Documentaion Lumen : https://lumen.laravel.com/docs/5.8

Scroll kebawah di halaman documentasi Lumen, lalu kalian akan melihat hal seperti ini

Ada dua cara menginstall Lumen dikomputer kamu yang pertama menggunakan Lumen installer dan yang kedua menggunakan Composer. Karena kita sudah menginstall composer kita akan menggunakan Via Composer Create-Project untuk membuat Lumen.

Pertama kita buka directory dimana kita akan membuat file Lumen tersebut, saya biasanya membuat di folder C:\xampp\htdocs , kalian bisa membuatnya ditempat lain.

Lalu buka CMD dan arahkan kedirectory yang kalian inginkan.

Jika sudah berada di directory tersebut lakukkan copy paste command yang terdapat pada halaman documentasi Lumen.

Seperti ini :

Untuk “blog” itu adalah nama folder untuk file Lumen kita, disitu saya merubahnya menjadi “apitutorial”. Jika sudah tekan ENTER dan tunggu proses download selesai.

Jika sudah selesai tampilannya akan sepert ini :

Sekarang buka visual studio code atau text editor yang kamu pilih dan buka folder yang telah kita buat sebelumnya yaitu “apitutorial” :

Jika sudah dibuka tampilan akan sepert ini :

Perhatikan di pojok kiri ada folder tree itu merupakan file-file Lumen yang telah kita install sebelumnya.

Selamat kamu berhasil menginstall Lumen !

2. Persiapan Database

Sebelum kita lanjut ke-Lumen. Kita akan membuat dan mempersiapkan database terlebih dahulu. Buka XAMPP lalu jalankan (Start) Apache dan MySQL.

Lalu akses URL http://localhost/phpmyadmin/ pada browser jika berhasil tampilannya akan sepert ini :

Lalu buat database baru dengan mengklik +new.

Lalu tambahkan nama database lalu klik create. Disini saya menamakan database saya dengan nama api_tutorial. Kalian bisa menggunakan nama yang lain sesuai yang kalian mau.

Jika berhasil tampilannya akan sepert ini :

Selamat kamu sudah berhasil membuat database !

3. Konfigurasi Database pada Lumen

Buka visual studio code lalu buka file .env di file ini kita akan mengatur environment lumen kita disini juga kita akan mengatur database.

Tampilannya akan sepert ini :

Disini saya akan merubah detail dari database sesuai database yang tadi kita telah buat :

Untuk username diisikan root untuk password diisi kosong, untuk database disesuaikan dengan nama database yang kita buat.
***Jika kamu menggunakan database yang ada username dan passwordnya isi sesuai data yang kalian ketahui.

Selamat kamu telah berhasil mengkonfigurasi database pada lumen. !

4. Mendapatkan APP_KEY Lumen.

Tidak seperti Laravel, untuk APP_KEY pada Lumen tidak digenerate secara otomatis. Lantas bagaimana cara mendapatkannya?

Sekarang kita buka folder routes lalu buka file web.php. lalu tambahkann route berikut

Setelah itu untuk mengetes apakah Lumen sudah terinstall dengan baik dan untuk mengakses url /key untuk mendapatkan APP_KEY kita harus melakukan serve terlebih dahulu.

Caranya, buka terminal baru dan ketikan command berikut, lalu tekan ENTER :

php -S localhost:8000 -t public

Jika berhasil akan muncul seperti itu lalu kita akses URL (http://localhost:8000) tersebut. Tampilannya akan sepert ini :

Untuk mendapatkan APP_KEY kita akses routes /key (http://localhost:8000/key) yang telah kita buat.

Lalu akan muncul random string. Kita copy random string tersebut ke APP_KEY pada file .env

Selamat anda telah berhasil mengserve Lumen pada localhost dan mendapatkan APP_KEY !

5. Membuat database table dengan migration

Buka teriminal baru, lalu ketikan command berikut

php artisan make:migrations create_{nama_table}_table

Command itu kita gunakan untuk membuat file migrations yang nantinya akan kita gunakan untuk membuat table baru pada database. Untuk bagian {nama_table} kita harus menambahkan ‘s’ pada bagian belakang agar terbaca oleh model pada Lumen, yang nantinya akan kita gunakan untuk operasi database dengan eloquent.

Contoh : jika kita ingin membuat table ‘barang’ , maka kita tuliskan sebagai ‘barangs’

Disini kita membuat dua table yaitu table user dan barang dengan command sebagai berikut:

Jika sudah buka directory database/migrations disana telah terdapat 2 file migrations yang telah kita generate sebelumnya.

Buka file xxx_create_users_table.php, lalu tambahkan nama table pada fungsi up(). Disitu saya menambahkan name, email, password, dan api_token. Seperti berikut :

Buka file xxx_create_barangs_table.php, lalu tambahkan nama table pada fungsi up(). Disitu saya menambahkan nama_barang, jumlah_barang, harga_barang, dan image. Seperti berikut :

Setelah menambahkan nama table di file migration saatnya kita me-migrate file tersebut agar dapat menggenerate table secara otomatis pada database.

Buka terminal lalu ketika command berikut

php artisan migrate

Jika berhasil akan ada pesan seperti berikut:

Lalu kita cek langsung ke phpmyadmin apakah table telah terbuat, jika berhasil maka table akan terbuat seperti berikut :

Selamat kamu telah berhasil membuat table dengan fitur migration Lumen !.

6. Meng-Enable fitur Auth dan Database bawaan Lumen

Sebelum kita membuat fitur CRUD, kita akan membuat fitur Login/Register terlebih dahulu. Untuk membuat fitur Login/Register yang pertama kita lakukkan adalah meng-enable MiddleWare Auth. Ini akan kita gunakan untuk meng-Enable fitur authentikasi bawaan dari Lumen.

Buka folder bootstrap /app.php , Lalu scroll dan uncomment Facades dan Eloquent, ini untuk digunakan untuk operasi database.

Lalu scroll lagi dan cari routeMiddleware Authenticate ini lalu uncomment

Lalu scroll lagi dan cari register AuthServiceProvide::class ini lalu uncomment.

Selamat kamu telah berhasil mengkonfigwrasi Lumen dan Database !

Untuk part 1 sampai sini dulu ya, selanjutnya kita akan membuat fitur Login dan Register. saya akan berusaha untuk upload setiap minggunya, jika ada kendala atau pertanyaan silahkan langsung ditanyakan disini.

ATTENTION !! : Apakah saya perlu membuat channel youtube? atau cukup dengan artikel saja? tolong masukkannya terimakasih !

Semoga bermanfaat, Semangat semuanya !

Setelah pada tutorial sebelumnya kita sudah melakukan CREATE data menggunakan FAN, sekarang saatnya kita melakukan READ data yang telah kita masukan.

saya anggap kalian sudah melakukan tutorial pertama, jadi kita langsung ke langkah membuat API READ nya.

Langkah 1
Setelah itu kita membuat file read_all.php sebagai API yang berfungsi untuk melakukan operasi READ atau membaca semua data mahasiswa dari database. sebagai berikut :

setelah itu, simpan read_all.php pada folder crud_fan , c:xampp/htdocs/crud_fan , jika belum ada pastikan kamu telah mengikuti tutorial pertama.

setelah itu akses http://localhost/crud_fan/read_all.php pada browser kamu, jika berhasil akan muncul seperti berikut.

jika data telah tampil berarti anda telah berhasil membuat read_all.php untuk membaca seluruh data pada tabel mahasiswa di database.

ini data dalam tampilan struktur json agar terlihat lebih rapih. (ini hanya tampilan untuk mempermudah kita melihat datanya, isinya sama dengan screenshot diatas.)

Langkah 2

sekarang buka project android studio kita, lalu klik kanan pada folder layout, dan create new empty activity.

Saya memberi nama activity itu dengan nama ReadAllActivity , lalu click finish

Langkah 3

Tambahkan library RecyclerView untuk menampilkan data dalam bentuk list

//Gunakan compile jika menggunakan Android studio 3.0 kebawah
compile 'com.android.support:recyclerview-v7:27.1.1'

//Gunakan implementation jika menggunakan Android studio 3.1 keatas
implementation 'com.android.support:recyclerview-v7:27.1.1'

//PILIH SALAH SATU SESUAI VERSI ANDROID STUDIOMU!

Langkah 4

buka activity_read_all.xml yang baru saja dibuat, lalu tambahkan recyclerView pada xml. dan lakukan perubah di activity_read_all.xml seperti berikut

Langkah 5

Buat layout sebagai desain/tampilan list kita, yang nantinya akan ditampilkan pada recyclerView pada activity_read_all.xml
klik kanan pada folder layout>new>layout resource file

lalu beri nama list_mahasiswa_row dan menggunakan root element RelativeLayout, lalu tekan OK

Lalu, lakukan penambahan dan perubah pada list_mahasiswa_row.xml, seperti berikut :

Langkah 6

Buat Object Mahasiswa yang digunakan untuk menampung data mahasiswa yang akan diambil dari database

Buat file java baru, klik kanan pada folder java, lalu pilih new > java class, lihat gambar dibawah

lalu buat file dengan nama DataMahasiswa, lalu tekan OK

lalu buat code seperti ini pada DataMahasiswa.java

code diatas merupakan object mahasiswa yang akan menampung data mahasiswa dari database. disana terdapat construktor dan getter, setter, yang belum tau hal ini, pelajari lagi tentang OOP-nya.

Langkah 7

Setelah itu kita buat RecyclerViewAdapter, untuk menampung data pada view

Buat file java baru, klik kanan pada folder java, lalu pilih new > java class, lihat gambar dibawah

buat file java baru dengan nama ListMahasiswaAdapter, yang nantinya akan menjadi adapter untuk data kita

tambahkan code berikut pada ListMahasiswaAdapter.java, penjelasan ada pada kodingan

Langkah 8

setelah membuat DataMahasiswa.java datamahsiswa dan ListMahasiswaAdapter.java, saatnya kita membuat recyclerView kita,
buka ReadAllActivity.java lalu tambahkan code seperti berikut.

(penjelasan ada pada codingan)

Langkah 9

Setelah melakukan penambahan code pada ReadAllAcitivity.java , saatnya kembali ke MainActivity.java lalu tambahkan code berikut pada fungsi aksiButton()

btnLihat.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        //untuk pindah keActivity lain saat buttonlihat dipencet
        Intent intent = new Intent(MainActivity.this, ReadAllActivity.class);
        startActivity(intent);
    }
});

Langkah 10

Sekarang jalankan/run aplikasi mu ke device/emulator yang telah kamu sediakan, pastikan localhostmu sudah menyala, dan pastikan menggunakan IP yang sesuai dengan localhostmu.

Hasilnya akan seperti ini :

untuk selanjutnya kita akan menambahkan fitur OnClick pada List tersebut agar dapat melihat detailnya, ReadSingle. Untuk tutorial selanjutnya, Akan diupdate segera dibuat jika ada waktu luang

FAN Documentation : https://amitshekhariitbhu.github.io/Fast-Android-Networking/

Thanks to Allah and grup code android indonesia !

to be continued

Fast Android Networking adalah sebuah library yang dapat memudahkan kita untuk melakukan HttpConnectionRequest.

Langkah 1
Untuk melakukan CRUD dengan FAN, hal pertama yang harus dilakukan adalah membuat database. Saya membuat database di localhost menggunakan PhpMyAdmin. sebagai berikut :

1. Buka XAMPP dan pastikan Apache dan MySql sudah berjalan (distart)

2. Lalu buka localhost/phpmyadmin , pada browser masing-masing, tampilannya akan seperti ini

3. Lalu pilih new untuk membuat database baru

4. Lalu akan muncul sepert ini, dan masukkan nama database yang akan di bikin pada kolom sebelah kiri, disitu saya menamakan database saya dengan nama database_mahasiswa , untuk Collation nya tidak perlu diganti. lalu klik Create.

5. Jika berhasil, database yang dibuat akan muncul disisi kiri

6. Selanjutnya membuat tabel, masukkan nama tabel dan jumlah kolom yang diinginkan. disini kita menggunakan nama tbl_mahasiswa dan 4 kolom. setelah itu klik Go

7. lalu buat kolom seperti berikut dan jangan lupa ceklis Auto_Increment pada id_mahasiswa dan jadikan id_mahasiswa menjadi primary_key

8. Setelah itu pilih save

9. Setelah berhasil struktur database akan seperti ini. Dan Database telah selesai dibuat.

10. Lanjut langkah ke 2

Langkah 2
Setelah membuat database, kita akan membuat file connect.php yang bertujuan untuk melakukan koneksi dengan database yang telah kita buat. sebagai berikut :

Langkah 3
Setelah itu kita membuat file create.php sebagai API yang berfungsi untuk melakukan operasi Create atau tambah data ke database. sebagai berikut :

Langkah 4

pindahkan file connect.php dan create.php pada C:\xampp\htdocs\crud_fan , jika tidak ada folder crud_fan silahkan buat terlebih dahulu, pastikan file connect.php dan create.php berada dalam satu folder yaitu crud_fan.

Jika sudah coba akses localhost/crud_fan pada browser, maka tampilannya akan seperti ini :

Lalu coba buka file connect.php dan create.php (klik saja). dan pastikan hasilnya blank putih kosong yang menandakan tidak ada error.

Langkah 5

Sebelum masuk ke Androidnya, kita rubah akses localhost menggunakan ip agar dapat tersambung dengan Android.

1. Buka CMD / command prompt
2. Ketik ipconfig lalu tekan enter

3. Lalu copy Ip berikut (lihat lingkaran merah)

4. Setelah itu akses ip tersebut untuk menggantikan localhost, seperti berikut, jika berhasil akan muncul yang sama saat kita mengakses localhost/crud_fan dan 192.168.100.10/crud_fan

Langkah 6
Setelah membuat semua file tersebut saatnya kita membuat form untuk input data pada android.
1. Buka android studio
2. New Project
3. Nama project terserah kalian
4. Next>next
5. Pilih empty Activty

Setelah loading selesai, buka Activity_main.xml lalu buat Layout seperti berikut :

Langkah 7
Tambahkan library FAN pada gradle dan internet permission pada Android Manifest

Library FAN

//Gunakan compile jika menggunakan Android studio 3.0 kebawah
compile 'com.amitshekhar.android:android-networking:1.0.1'

//Gunakan implementation jika menggunakan Android studio 3.1 keatas
implementation 'com.amitshekhar.android:android-networking:1.0.1'

//PILIH SALAH SATU SESUAI VERSI ANDROID STUDIOMU!

Internet Permission

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

Setelah selesai tekan sync now , lalu tunggu loading sampai selesai :

Pastikan build berhasil setelah di sync now :

Langkah 8

Buka MainActivity.java lalu tambahkan kodingan seperti ini, penjelasan ada pada kodingan

Langkah 9

Setelah semuanya selesai coba run aplikasi tersebut kedevice kalian, pastikan handphone kalian menggunakan koneksi yang sama dengan komputer/laptop kalian.
saat berhasil dirun, tampilan akan seperti ini

Setelah itu isi form tersbut lalu tekan tombol tambah data.

Jika berhasil akan form kembali kosong dan muncul toast seperti berikut

Lalu cek di database > localhost/phpmyadmin , apakah data sudah masuk, apa belum, jika sudah masuk, Selamat ! anda telah berhasil melakukan Create data menggunakan FAN !

untuk Read, Update, Delete. Akan segera dibuat jika ada waktu luang
FAN Documentaion : https://amitshekhariitbhu.github.io/Fast-Android-Networking/

Thanks to Allah and grup code android indonesia !

to be continued