Dizzy Coding

Ngoding jadi pusing karena lupa.

Breaking

Thursday, February 14

February 14, 2019

Belajar Fragment

Udah lama gak nulis, kali ini entah kenapa ingin nulis lagi. Tulisan kali ini adalah tulisan tentang ilmu baru yang saya terima ketika mengikuti suatu acara. Iya acara yang pembicaranya adalah salah satu pemecah rekor DICODING, dengan menyelsaikan kelas KADE hanya 5 hari. Nah dia ini memberikan materi tentang Mengendalikan Fragment.

Ok, sebelumnya saya akan mencoba berbicara tentang Fragment. Pada umumnya ketika baru - baru belajar membuat Aplikasi Android, akan terbiasa dengan yang namanya Intent untuk berpindah dari satu Activity ke Activity lain.

Kenapa harus berpindah ?
Karena satu activity hanya memiliki sebuah layout. Yang artinya jika ingin ke tampilan lain, harus berpindah ke activity lain.

Ok, kembali ke Fragment.
Hal yang harus benar - benar di ingat adalah, FRAGMENT berjalan diatas Activity.
Karena Fragment berada diatas activity, dan sebuah activity bisa menjalankan banyak fragment maka hal ini memungkinkan kita hanya memerlukan sebuah activity untuk membuat banyak tampilan. Selain itu, perpindahan antar fragment terasa lebih smooth dibandingkan perpindahan antara Activity.

Ilustrasi Aplikasi yang akan dibuat

Ok, seperti yang terlihat pada gambar diatas. Ada sebuah activity yang diatasanya ada beberapa fragment (fragment 1, fragment 2 dan fragment 3).

Ok, ayo kita coba buat terlebih dahulu, sebuah project dengan empty activity dan 3 buah fragment.

Memilih template project

Menentukan nama project

Ok, jika sudah, maka akan otomatis muncul MainActivity.java dan xml nya. Ayo lanjutkan dengan membuat 1 buah package dan 3 buah fragment.

Membuat package

Saya membuat package dengan tujuan, supaya lebih rapi saja.
Caranya ? : kalau dari gambar diatas, klik kanan dizcoding.com.belajarfragment->new->packages.

Ok, di dalam package tadi, ayo kita buat 3 buah fragmentnya.
Cara yang saya lakukan adalah seperti ini
Klik kanan packages yang barusaja dibuat -> new -> Fragment -> Fragment(Blank).

sisanya ikuti gambar berikut.

Membuat Fragment baru

Jika sudah sesuai, silahkan klik finish.
dan lanjutkan dengan membuat FragmentDua dan FragmentTiga dengan cara yang sama seperti saat membuat FragmentSatu.
Berikut penampakannya setelah tiga buah fragment terbuat.

Setelah Fragment satu,dua, dan tiga terbuat

Ok, kita kembali sejenak ke layout MainActivity.
kita ubah isinya. Untuk contoh bisa mengikuti yang saya lakukan seperti berikut.

Membuat container di dalam activity_main.xml

Saya membuat sebuah Linear layout dengan id container. Tujuannya adalah, nantinya container ini akan di replace / di gantikan dengan layout yang ada di fragment, sehingga nantinya layout dari fragment bisa muncul di dalam Activity.

Selanjutnya,  ayo kita atur terlebih dahulu FragmentSatu. Di dalamnya saya ingin menambahkan Button. Lihat contoh berikut.

Mengatur layout fragment_satu

Ayo lakukan hal yang sama dengan layout FragmentDua. Ubah menjadi seperti berikut.

Mengatur layout fragment_dua

Dan Terakhir, ayo ubah layout FragmentTiga.
Cukup rubah textviewnya saja, supaya kita tau jika itu adalah fragmentTiga.

Mengatur layout fragment_tiga

Ok, selanjutnya ayo kita ke MainActivity.java

Membuat method commitFragment

Saya membuat sebuah method dengan nama commitFragment(Dengan parameter fragment).
Method ini saya buat untuk menghandle proses replace fragment atau proses untuk mengganti fragment yang sebelumnya dengan yang baru. Dimana fragment nanti akan menggantikan tempat R.id.container yang ada di dalam .xml main activity.

Selain itu juga saya membuat method dengan nama openFragmentSatu().
Method ini saya buat untuk mendefenisikan fragmentSatu, supaya nantinya jika ingin menampilkan fragmentSatu hanya tinggal memanggil fragment ini saja. Seperti contoh di dalam method oncreate, untuk menampilkan fragmentSatu, saya hanya memanggil method  openFragmentSatu di dalam method oncreate.


Test running openFragmentSatu
Jika aplikasi dicoba untuk di jalankan, maka akan menampilkan tampilan seperti gambar diatas.

Ok, kita lanjutkan dengan aksi, yaitu aksi untuk menampilkan fragmentdua jika tombol Show Fragment Dua di klik.

Untuk itu, mari kita lanjutkan dengan membuat listener terlebih dahulu. Tetapi sebelum itu, mari kita buat package dengan nama listeners. Lalu baru buat sebuah java class baru.

Membuat listener

Yup, seperti itulah listenernya jika sudah di buat. Disitu saya menggunakan int untuk nilai yang akan dikirim, nilai ini nantinya adalah nomor dari fragment. Untuk lebih jelasnya ayo lanjutkan dulu.

Kembali ke Main activity, dan implement listener yang baru saja dibuat ke dalam Mainactivity, Ini saya lakukan karena nantinya MainActivity akan menjadi pendengar, ketika ada yang mengirim atau memberikan aksi ke listener yang sudah dibuat.

Implementasi listener ke mainActivity

Ketika sudah di implement, maka nanti akan muncul method baru yang mengoverride method yang ada di dalam listener seperti pada gambar diatas.


Menambahkan method openFragmentDua dan Tiga

Masih di MainActivity, saya menambahkan beberapa method dan juga menambahkan kondisi di dalam override yang sebelumnya, dapat dilihat pada gambar diatas.

Ok, next ayo pindah ke FragmentSatu, karena didalamnya ada tombol yang akan menjalankan aksi, untuk berpindah ke fragmentDua. Untuk itu, saya merubah FragmentDua.java menjadi seperti berikut.

Membuat fragment supaya bisa memanggil listener

Yang perlu di perhatikan. karena untuk membuka FragmentDua kita perlu berbisik terlebih dahulu ke MainActivity, maka kita harus mengetahui jika ternyata MainActivity ingin mendengarkan bisikan dari FragmentDua. caranya adalah dengan cara, MainActivity mengirimkan object listener ke dalam fragmentSatu (untuk itulah kenapa saya membuat method setFragment). Lalu di dalam override onclick. saya membuat fragment untuk berbisik kepada MainActivity melalui object listener, dan membisikkan angka 2. yang artinya nanti ketika MainActivity mendengar, akan mengeksekusi angka 2 (yaitu membuka fragmentDua).

Ayo kembali terlebih dahulu ke MainActivity, karena kita perlu membuat MainActivity mengirimkan object listener kedalam FragmentSatu.

Meminta Activity mengirimkan object listener ke fragmentSatu

Saya mengirimkan parameter listener kedalam method setFragment yang ada di fragmentSatu. Jika anda bertanya kenapa parameternya this ?, karena class MainActivity sudah implemen object FragmentNavigationListener.

Ok, sampai disini jika di coba untuk di jalankan, seharusnya sudah berjalan. (tapi hanya sampai menampilkan fragmentDua saja).

Ok, lanjutkan ke FragmentDua, kita lakukan hal yang sama seperti pada fragmentSatu.

Membuat fragment supaya bisa memanggil listener

Sama seperti FragmentSatu, di FragmentDua juga saya melakukan hal yang sama. bisa dilihat pada gambar diatas.
Dan kita kembali ke MainActivity, untuk membuat MainActivity mengirimkan object listener ke dalam fragmentDua. seperti berikut.

Meminta Activity mengirimkan object listener ke fragmentSatu

Ok, berikut preview dari semua kodingannya jika di jalankan.




Selesai, yey, project kecil ini akhirnya selesai.
Silahkan tinggalkan kritik dan sarannya pada kolom komentar dibawah.

Oh iya, ini saya lampirkan link git dari project yang baru saja dibuat. Link Project

TERIMAKASIH BANYAK
0
By at No comments:
Labels: , ,

Friday, November 30

November 30, 2018

Menentukan Jenis Operator dari No HP (Android Studio)


Selamat datang di tulisan pertama saya tentang pemrograman android. Pada tulisan kali ini, saya sedang belajar untuk menentukan jenis operator dari suatu no seluler.

Seperti yang sudah kita ketahui, bahwa sistem penomoran no hp di indonesia itu cukup sederhana, yaitu kita bisa menentukan jenis suatu operator hanya dari beberapa nomor awalnya saja.

Ok, langsung aja yuk
Ok, awal sih sama saja seperti biasa,  buat project baru, dan pilih yang empty activiti saja

Diluar method oncreate, saya membuat method baru, dengan nama getData()

    Map<String, String> getData(){
        Map<String,String> operator = new HashMap<>();
        operator.put("62811","Telkomsel");
        operator.put("62812","Telkomsel");
        operator.put("62813","Telkomsel");
        operator.put("62821","Telkomsel");
        operator.put("62822","Telkomsel");
        operator.put("62823","Telkomsel");
        operator.put("62851","Telkomsel");
        operator.put("62852","Telkomsel");
        operator.put("62853","Telkomsel");
        operator.put("62814","Indosat");
        operator.put("62815","Indosat");
        operator.put("62816","Indosat");
        operator.put("62855","Indosat");
        operator.put("62856","Indosat");
        operator.put("62857","Indosat");
        operator.put("62858","Indosat");
        operator.put("62817","XL / Axis");
        operator.put("62818","XL / Axis");
        operator.put("62819","XL / Axis");
        operator.put("62859","XL / Axis");
        operator.put("62877","XL / Axis");
        operator.put("62878","XL / Axis");
        operator.put("62879","XL / Axis");
        operator.put("62831","XL / Axis");
        operator.put("62833","XL / Axis");
        operator.put("62835","XL / Axis");
        operator.put("62836","XL / Axis");
        operator.put("62837","XL / Axis");
        operator.put("62838","XL / Axis");
        operator.put("62839","XL / Axis");
        operator.put("6288","Smartfren");
        operator.put("62899","Three");
        operator.put("62898","Three");
        operator.put("62897","Three");
        operator.put("62896","Three");
        operator.put("62895","Three");
        operator.put("62894","Three");
        operator.put("62893","Three");
        return operator;
    }

Setelah itu saya juga membuat method baru lagi, dengan nama cekOp()

Berikut kode yang saya tambahkan.
    String cekOp(String pref){
        String ret ="";
        Map<String, String> operator = getData();
        for (Map.Entry<String,String> entry : operator.entrySet()){
            if (pref.equalsIgnoreCase(entry.getKey())){
                ret = entry.getValue();
            }
        }
        if (ret.equalsIgnoreCase("")){
            ret = "Tidak ditemukan";
        }
        return ret;
    }
Kode tersebut saya gunakan untuk melakukan pengecekan dari data yang sudah di buat di method yang sebelumnya, yaitu method getData();

Cara yang saya lakukan adalah, dengan cara menyamakan antara key dari data yang dibuat sebelumnya dengan data yang di masukkan ke dalam parameter pref.

Jika datanya sama, maka akan memberikan nilai return berupa nama operatornya.

Tahap selanjutnya saya membuat form pada file activity_main.xml untuk memasukkan nomor, lalu saya juga membuat sebuah button untuk menjalankan perintah cek nomor yang di masukkan dan sebuah text view untuk menampilkan jenis operatornya.

Berikut isi dari file .xml yang saya buat.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/up"
        android:layout_width="match_parent"
        android:layout_height="match_parent">


        <EditText
            android:id="@+id/phone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ems="10"
            android:inputType="phone" />
        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Cek" />
    </LinearLayout>
    <LinearLayout
        android:layout_centerVertical="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/operator"
            android:text="Test"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </LinearLayout>

</RelativeLayout>

Ok, kembali lagi pada file MainActivity.java
Karena pada file .xml nya sudah di tambahkan beberapa element, maka kita perlu mendefinisikan element - element tersebut di MainActivity.java tersebut.
Saya mendefinisikan nya langsung di dalam method onCreate seperti berikut.

        final EditText no = findViewById(R.id.phone);
        Button button = findViewById(R.id.button);
        final TextView hasil = findViewById(R.id.operator);

Lalu saya juga membuat action onclick supaya nanti ketika button di klik, akan menjalankan pengecekan kepada nomor yang telah diberikan.

Masih di dalam onCreate, saya membuat onclik seperti berikut
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String noHp = no.getText().toString();
                if (noHp.length() > 4){
                    noHp = noHp.substring(0,5);
                }
                hasil.setText(cekOp(noHp));
            }
        });

Pada code diatas, saya membuat kondisi, jika panjang karakter dari nomor yang dimasukkan lebih dari 4, maka akan di potong dan di ambil hanya 5 karakter awalnya saja.

Lalu saya tampilkan hasilnya pada textview.

Sampai pada tahap ini, project sudah bisa di test, dan seharusnya sudah bisa melakukan pengecekan jenis operator berdasarkan nomor yang di masukkan.

Tetapi : ada beberapa kasus yang tidak sesuai
1. ketika di masukkan no dengan awal 0 , ie : 0823888 maka tidak akan ditemukan jenis operatornya.
2. ketika nomor yang di masukkan adalah nomor dengan operator smartfren maka tidak akan ditemukan juga jenis operatornya.

Penyebab pada no 1 adalah, karena ketika di cek, tidak ada nomor yang awalnya 0 pada data yang sudah di buat.
Lalu solusinya bagaimana ?
Cara yang saya lakukan adalah :
1. jika pengguna memasukkan angka 0 pada awal karakter, maka akan saya replace angka 0 tersebut dengan angka 62.

Kode pada onclik akan menjadi seperti ini jika algoritma tersebut saya lakukan.

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String noHp = no.getText().toString();
                if (noHp.length() > 4){
                    // jika panjang karakter lebih dari 4
                    if (noHp.substring(0,1).equalsIgnoreCase("0")){
                        // jika karakter pertamanya adalah 0
                        // maka replace angka 0 tersebut dengan 62
                        noHp = noHp.replace("0","62");
                    }
                    noHp = noHp.substring(0,5);
                }
                hasil.setText(cekOp(noHp));
            }
        });

Lalu bagaimana pada penyebab dari masalah no 2 ?
Penyebabnya adalah karena panjang karakter yang di cek adalah 5 karakter, sedangkan pada data yang merupakan data Smartfren, hanya ada 4 karakter yang diperlukan untuk dilakukan pengecekan.

Lalu bagaimana solusinya ?
Solusi yang saya tawarkan adalah seperti berikut :

Cek, apakah nomor yang diberikan mengandung 6288, jika iya, maka potong nomor yang diberikan tersebut, dan hanya ambil 4 karakter saja.
Jika tidak mengandung 6288 maka potong dan ambil 5 karakter saja.

Berikut full kode dari onclick setelah saya tambahkan algoritma yang baru saja saya bahas.

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String noHp = no.getText().toString();
                if (noHp.length() > 4){
                    // jika panjang karakter lebih dari 4
                    if (noHp.substring(0,1).equalsIgnoreCase("0")){
                        // jika karakter pertamanya adalah 0
                        // maka replace angka 0 tersebut dengan 62
                        noHp = noHp.replace("0","62");
                    }
                    if (noHp.contains("6288")){
                        noHp = noHp.substring(0,4);
                    }
                    else{
                        noHp = noHp.substring(0,5);
                    }
                }
                hasil.setText(cekOp(noHp));
            }
        });

Selesai, yey, project kecil ini akhirnya selesai.
Silahkan tinggalkan kritik dan sarannya pada kolom komentar dibawah.

Oh iya, ini saya lampirkan link git dari project yang baru saja dibuat. Link Project

Terimakasih banyak....
0
By at No comments:
Labels: , ,

Saturday, November 24

November 24, 2018

DESIGN DATABASE PROJECT POS (Point of Sales)

Sebelumnya saya sudah mengatakan, jika saya akan membuat catatan tentang bagaimana saya membuat aplikasi Point of Sales sederhana dan memiliki beberapa fitur yang sudah saya sebutkan sebelumnya di catatan saya yang ini.

Ok, untuk memulainya saya awali dengan melakukan design databasenya terlebih dahulu. Saya sadar saya bukan designer yang baik, tapi saya mencoba mendesign database untuk project ini sesuai dengan apa yang sudah saya sebutkan fitur apa saja yang akan dimasukkan kedalam project ini.


Langsung saja saya Create database dengan nama "pos".
Click gambar untuk memperbesar gambar

Selanjutnya silahkan import file pos.sql yang bisa di download dari sini ke dalam database yang baru saja dibuat.

link yang baru saja saya tuliskan adalah link dimana project yang saya catat ini akan saya letakkan. sehingga anda bisa dengan mudah untuk mendownloadnya. Untuk file pos.sql saya letakkan di dalam folder database.

berikut ini adalah sketsa dari relasi yang saya buat antara semua table yang sudah saya buat.
Click gambar untuk memperbesar gambar
saya akan jelaskan kenapa untuk sebuah aplikasi PoS sederhana butuh table sebanyak itu.
saya akan jelaskan table per table nya. (Semoga tidak salah dan tidak membosankan).

1. History 

table ini saya buat untuk mencatat apa saja yang sudah di lakukan oleh pengguna (admin ataupun kasir) terhadap data. Jadi nantinya ketika si user melakukan update data ataupun insert data maka akan di catat ke dalam table ini. supaya jika suatu saat ada data yang berubah, bisa di deteksi siapa sih yang melakukan itu. 
field kode disitu di gunakan untuk menyimpan kode dari data yang di insert / pun dirubah.

create_at akan otomatis mengambil time dari komputer ketika data di simpan.
create_by akan menyimpan kode atau id dari user yang melakukan proses ini.

2. Users
table ini digunakan untuk menyimpan data dari penggunanya (username, password dan lain-lain).

3. Menu
Table ini saya buat untuk menyimpan data dari menu atau fitur apa saja yang ada di dalam aplikasi ini nantinya.

4. Otoritas

Jika dilihat dari sketsa pada gambar diatas, pada table ini akan menyimpan kode_menu dan juga kode_user. Di dalam table ini nantinya akan meyimpan si user ini memiliki hak akses akan menu apa saja.

Dalam table yang memiliki relasi, ketika dua buah table berelasi dengan tipe (M to M) atau Many to Many maka akan menciptakan table baru.
sesuai dengan note diatas, karena talbe Users dan table Menu memiliki relasi dengan type (M to M) maka muncullah table baru yang disini saya beri nama Otoritas. 

Kenapa saya sebut M to M ?
karena 1 data users bisa memiliki banyak data menu.

dan juga 1 data menu bisa dimiliki banyak users.

Untuk lebih jelasnya nanti akan saya contohkan ketika dalam project. 


5. Kategori
Table ini hanya digunakan untuk menyimpan beberapa data untuk membantu mengelompokkan jenis barang.

6. Barang
Sesuai namanya, Table ini akan digunakan untuk menyimpan data dari barang - barang yang akan dijual oleh pengguna.

7. Satuan
Table ini saya buat untuk menyimpan jenis-jenis satuan dari barang. Misalnya (piece, liter, Kg, butir, dll).

8. Jenis_promo

Karena promo ada beberapa jenis dan ketentuan, maka dari itu saya buat table sendiri untuk menyimpan jenis dan ketentuannya. Oleh sebab itu saya buat field rumus di dalam table ini. fungsi field ini adalah untuk membuat rumus perhitungan tersendiri untuk jenis promo tertentu, misalnya 
(Diskon 10% + 90%) atau contoh lainnya (Beli 3 gratis 1 produk yang sama) dan lainnya.

9. Promo

Table ini saya buat untuk menyimpan promo yang sedang terjadi. Misalnya barang ini sedang ada promo dari tanggal sekian hingga sekian. Nah data tersebut saya simpan di table ini.

10. Transaksi
Ketika ada pembeli melakukan pembelian, dan akan ada data yang berkurang karena sudah di beli, maka hal ini perlu di catat supaya bisa tau, kemana dan kapan suatu barang terjual.

11. Detail_transaksi
Karena ketika suatu transaksi terjadi, pembeli bisa saja membeli suatu barang lebih dari satu jenis. Supaya data tetap tercatat secara detail, maka dari itu saya membuat table ini untuk menyimpan detail dari suatu transaksi.
Misalnya :
pembeli membeli beberapa produk, yang salah satunya ternyata ada promonya, maka harganya akan berubah, data tentang harga yang berubah ini perlu di simpan supaya bisa tau kenapa barang yang dijual sekian, tetapi uang yang masuk tidak sesuai.

Ok, itulah penjelasnnya kenapa saya membuat begitu banyak table.
Terimakasih banyak.
Ikuti terus catatan ini, hingga project ini selesai ya..

Silahkan tinggalkan komentarnya...

0
By at No comments:
Labels: , , , ,

Thursday, November 22

November 22, 2018

INTRO PROJECT POS (Point Of Sales)


Karena saya lebih suka belajar dengan cara praktik secara langsung (Mungkin ini bukan metode yang baik). Maka saya juga ingin membuat catatan yang serupa. Iya, saya akan membuat catatan yang saling berkesinambungan tentang bagaimana saya belajar menggunakan Codeigniter secara praktik. Dalam kasus kali ini saya ingin mencoba dengan membuat aplikasi sederhana yaitu Point Of Sales atau kalau bahasa kerennya itu aplikasi kasir (LoL). Karena ini berupa project, mungkin project ini akan memakan waktu cukup lama. Tapi, namanya juga catatan, semakin rapi dan semakin lengkap maka akan semakin baik (Menurut saya).


Yang saya inginkan dari aplikasi ini untuk sementara ini masih standart saja, yaitu :

  1. Multi User (admin dan kasir)
  2. Admin bisa menambah data dan merubah data (Termasuk menambahkan data kasir)
  3. Admin bisa mengatur otoritas untuk kasir
  4. Kasir hanya bisa mengakses apa yang di otoritaskan untuk dia
  5. Setiap transaksi harud ada catatannya, siapa yang melakukannya (baik itu kasir, maupun admin itu sendiri).
  6. Bisa mengaplikasikan Promo.
  7. Bisa Membuat laporan (Excel dan Pdf).
  8. Akan menggunakan template AdminLTE (Free)

sedangkan tahapan tahapan pembuatanya, yang baru terfikir adalah mendesign databasenya.

Ok, doakan supaya catatan ini berjalan dan selesai tanpa memakan waktu yang terlalu lama.

Terimakasih banyak, silahkan tinggalkan komentarnya (jika ada saran lain, juga boleh di tinggalkan di komentar).



0
By at No comments:
Labels: , , , ,

Monday, November 19

November 19, 2018

CRUD menggunakan API (CI) : Action


Akhirnya sampai tahap CRUD yang sesungguhnya juga, setelah kemarin saya hanya membuat catatan untuk persiapannya terlebih dahulu dari catatan yang ini.

nah, kali ini catatan ini benar-benar proses bagaimana saya melakukan CRUD ke dalam database dengan menggunakan CI yang sudah di persiapkan untuk dijadikan REST API.

Ok, cekibrot aja..
karena catatan kali ini akan sedikit lebih panjang.

Buka kembali project dari catatan sebelumnya.
1. Ubah mehtod GET
Click gambar untuk memperbesar gambar
ubah isi dalam method get menjadi seperti gambar.
untuk keterangan silahkan di baca pada gambar ya.

Pada method get ini, saya buat kondisi, supaya method ini bisa menampilkan 2 jenis data. Yaitu data detail (hanya menampilkan satu data) dan semua data (tampilkan semua data dari database)
2. Test tampilkan data detail.
Click gambar untuk memperbesar gambar
pada gambar diatas saya memberikan parameter id, sebagai patokan untuk ditampilkan

3. Test tampilkan semua data

Click gambar untuk memperbesar gambar
pada gambar diatas, saya menghapus parameter dari proses sebelumnya untuk menampilkan semua datanya. namun karena datanya hanya ada satu (di insert ketika proses persiapan sebelumnya) jadi datanya yang nampil sama seperti pada tahap sebelumnya, nanti setelah kita insert data lagi, maka akan tampil semua datanya.

4. Ubah method POST
Click gambar untuk memperbesar gambar
ubah isi dalam method get menjadi seperti gambar.
untuk keterangan silahkan di baca pada gambar ya.

5. Test insert data ke database.
Click gambar untuk memperbesar gambar
pada gambar diatas, saya mencoba memasukkan data baru. dan setelah saya coba send datanya, muncul tanda sukses di sebelah kanannya (bisa saja di bagian bawah).

6. Cek data yang baru di masukkan
Click gambar untuk memperbesar gambar
Setelah sebelumnya mencoba menambah data dan katanya berhasil. maka saya coba untuk menggunakan mehtod get untuk melihat datanya, apakah benar sudah masuk. Dan ternyata datanya jadi nambah setelah di test.

7. Ubah method PUT
Click gambar untuk memperbesar gambar
pada dasarnya prosesnya masih sama seperti kedua method sebelumnya, hanya saja yang membedakan adalah perintah pada eksekusinya saja. Saya tidak akan mengulang catatan saya, yang sudah saya catat di dalam kodingan.

8. Test method PUT
Click gambar untuk memperbesar gambar
untuk method put, id harus di autur sesuai dengan id yang ada datanya di dalam database. pada gambar diatas saya menggunakan id 2, supaya data yang id nya 2 lah yang di update.

9. Cek data setelah di update.
Click gambar untuk memperbesar gambar
Yeah, datanya berubah.

10. Ubah method Delete.
Method yang satu ini sedikit berbeda dari yang lainnnya. silahkan lihat bagaimana perbedaannya.
Click gambar untuk memperbesar gambar
perbedaannya saya tidak perlu menampung data yang dikirimkan, karena data yang dikirim hanya id yang merupakan identitas dari data yang ingin di hapus.

11. Test method Delete.
Click gambar untuk memperbesar gambar

Yeah, setelah di test, ternyata berhasil.

12. Cek data lagi.
Click gambar untuk memperbesar gambar
yup, ternyata datanya sudah tidak ada lagi di database, di buktikan dengan hanya satu data yang di tampilkan.


saya tidak menjelaskan tentang cara mengirimkan data ketika menggunakan postman, karena saya sudah mencatatnya di catatan sebelumnya.
Sedangkan tentang script php untuk melakukan CRUD ke databasenya sudah saya jelaskan di dalam gambarnya.

Terimakasih banyak.
Mohon maaf jika catatan saya kurang dapat di mengerti.
silahkan tinggalkan komentarnya ya..
0
By at No comments:
Labels: , , , ,

Sunday, November 18

November 18, 2018

CRUD menggunakan API (CI) : Persiapan


Sebelumnya saya sudah membuat catatan tentang mempersiapkan CI supaya bisa menjadi REST API dan juga sudah mebahas tentang Method-Method nya, dan juga tentang cara mengirim data berdasarkan Method-method tersebut. Kali ini saya ingin membuat catatan tentang melakukan CRUD ke database MYSQL dengan menggunakan REST API. Tapi sebelum itu, saya perlu membuat database terlebih dahulu, dan juga melakukan Config CI nya supaya bisa terkoneksi ke database.



Langsung aja yok lihat bagaimana cara saya mempersiapkan nya.

1. Persiapkan database
Click gambar untuk memperbesar gambar
Disini saya membuat table dengan nama "coba"
Lalu saya lanjutkan dengan membuat table "orang"
Yang didalamnya ada 3 buah field (id, nama, status).

2. INSERT DATA
proses ini sebenarnya untuk persiapan di tahapan selanjutnya, tapi saya lakukan sekarang supaya sekali jalan.
Click gambar untuk memperbesar gambar
saya lakukan insert data ke dalam table yang baru saya buat. oh iya, itu isinya bukan kode-kode kok.

Click gambar untuk memperbesar gambar
nah itu hasilnya setelah data sudah di insert.

3. Load Libaray database ke CI
Click gambar untuk memperbesar gambar

buka project CI dari project yang sebelumnya. lalu buka file autoload.php yang ada di dalam folder "application/config/".
lalu cari $autoload['libraries'] dan isikan seperti gambar diatas.

4. Config database ke CI
Click gambar untuk memperbesar gambar
masih di folder yang sama yaitu "application/config/", saya buka file database.php.
lalu pada bagian bawah saya isikan seperti pada di gambar.

Jika pengguna xampp biasanya nama host masih tetap localhost. usernamenya diisikan root, dan passwordnya di kosongkan. lalu database diisi dengan nama database yang sudah di buat pada tahap 1.
Tapi disitu saya isi seperti itu karena user untuk mysql saya sudah saya tambah dan saya rubah.

 untuk persiapannya sudah selesai, sisanya akan saya lanjutkan dengan ngoding untuk bagaimana melakukan CRUD ke database MYSQL dengan API.

Terimakasih banyak..
Silahkan tinggalkan kritikan dan saran-sarannya di kolom komentar dibawah.
0
By at No comments:
Labels: , , , ,

Saturday, November 17

November 17, 2018

Mencoba mengirim data ke API (CI)


Ketika sebelumnya saya mencoba membuat API (mungkin lebih tepatnya mencoba memahami API). Saya sudah memasukkan beberapa jenis METHOD juga, dan saya juga sudah mencoba nya. Namun di kenyataannya, kita tidak mungkin mengirim data kosong ke API, karena hakikatnya API itu berfungsi sebagai jembatan yang akan menyimpankan data yang kita kirimkan ataupun jembatan sebagai penyedia data dari database ketika kita minta. Maka kali ini saya akan mencatat bagaimana sih cara mengirim data (disini saya menggunakan alat bantu POSTMAN) ke API dan bagaimana si API bisa tau data yang saya kirimkan.


Karena ini masih lanjutan dari yang ini, maka saya masih menggunakan project yang sama.

1. GET
Ok, saya menggunakan file Coba.php dari project sebelumnya. dan saya tambahkan beberapa baris seperti berikut.
Click gambar untuk memperbesar gambar
ok, disitu karena saya sedang berada di dalam method get, maka untuk mendapatkan data yang dikirim menggunakan method get, saya menggunakan $this->get(). Ok, langsung aja saya coba menggunakan POSTMAN.
Click gambar untuk memperbesar gambar
pilih method GET tentunya, dan di url nya saya titipkan datanya.

Cara mengirim data pada method GET yaitu langsung melalui url. dengan cara di tuliskan dulu key nya baru nilainya.
Contoh : url/ci/Controller?id=30 : saya tuliskan "id" sebagai keynya, dan "30" adalah nilai yang di bawa.
Click gambar untuk memperbesar gambar
seperti yang saya tuliskan sebelumnya, cara mengirim data dengan method GET adalah dengan menitipkan langsung dari url.

ok, itu baru mengirimkan 1 (satu) data, bagaimana jika mengirimkan lebih dari satu ?

Click gambar untuk memperbesar gambar
Pertama -tama, kita siapkan kodingannya. pada gambar diatas, saya menambahkan beberapa key yang akan di tangkap, yaitu "nama" dan "status". Lalu saya juga menggunakan function bawaan dari Library yang sebelumnya sudah saya masukkan ke dalam project CI (dari catatan saya yang ini), yaitu function response untuk menampilkan datanya.

Function response adalah function yang jika kita masukkan data kedalamnya, akan langsung di representasikan sebagai data JSON.

JSON : adalah salah satu presentasi data yang datanya bisa dipahami oleh banyak bahasa pemrograman, hal inilah yang memungkinkan API menjadi bisa digunakan banyak jenis aplikasi seperti Web, Mobile, dan Desktop.

Click gambar untuk memperbesar gambar
untuk menuliskan data pada url, sama seperti sebelumnya, hanya saja butuh tanda "&" sebagai pemisah antara key dan datanya. seperti pada gambar di atas, saya memisahkan beberapa key dengan tanda "&".

2. POST
Untuk method yang ini, saya hanya melakukan copy dari isi mehtod GET dan merubah beberapa hal.
Click gambar untuk memperbesar gambar
seperti yang terlihat pada gambar, saya merubah $this-get() menjadi $this->post(). Karena ini adalah cara supaya data yang dikirim melalui method post bisa di ambil. Dan saya juga merubah penamaan variable dari $get menjadi $id (hanya merubah penamaan saja).

Ok, saya coba dulu.

Click gambar untuk memperbesar gambar
Buka postman lagi, lalu ubah Urlnya hanya sampai Controllernya saja "localhost/project/index.php/Controller". Ubah juga methodnya menjadi POST. lanjutkan dengan klik tab body->form-data. Dan isikan key dan valuenya.

Click gambar untuk memperbesar gambar
dan Jeng jeng, datanya muncul.

3. PUT
Lanjut ke method lainnya.
Ayo kita koding  copas dlu isi dari method POST ke dalam Method PUT.
Click gambar untuk memperbesar gambar
ubah sedikit kodenya, dari $this->post() menjadi $this->put().

Ayo test lagi pake tukang post (POSTMAN).
Click gambar untuk memperbesar gambar

Ubah methodnya jadi PUT. lalu pada tab body, ambil yang x-www-form-urlencoded (seperti gambar diatas). lalu masukkan key dan valuenya lagi. Jika sudah seharusnya akan menampilkand ata seperti di gambar.

4. DELETE
Ok, Untuk Delete ini dia agak spesial. Type mehodnya seperti method GET yang datanya di tuliskan langsung di URL, namun untuk lebih jelasnya, Ayo kita Coding dlu Methodnya.
Click gambar untuk memperbesar gambar
Coba di perhatikan, pada method Delete, tidak di masukkan key, melainkan langsung parameter di dalam methodnya.

function index_delete($parameter1,$parameter2,$paramete3,$parameterseterusnya).
sedangkan isinya hanya menampilkan data dari parameter.

Saya coba dlu ya.
Click gambar untuk memperbesar gambar
Buka postman, lalu ubah methodnya menjadi DELETE. 
Perhatikan penulisan URL nya, ini yang saya bilang sebelumnya, method DELETE mirip seperti GET, hanya saja pada saat penulisan URL, pada Mehtod Delete, tidak memasukkan key melainkan langsung memasukkan datanya dan untuk memisahkan antara data yang satu dengan yang lainnya, menggunakan tanda "/".
Contoh : localhost/project/index.php/Controller/data1/data2/data3
dan penulisan data pada URL juga di pengaruhi pada penulisan code pada 

method index_delete($param1, $param2,$param3).
dengan penulisan URL seperti diatas, maka "data1" akan ditangkap oleh "$param1" dan seterusnya.


Ok, selesai...

Terimakasih banyak, dan silahkan tinggalkan komentar di kolom komentar di bawah ya..
0
By at No comments:
Labels: , , ,