Aplikasi CRUD Android Sederhana Menggunakan MySQL, PHP, JSON

Assalammualaikum dan selamat siang kepada mans2 semuanyaa :D, semoga mans2 semua sehat2 aja yaa :).

Kali ini saya akan memberikan sedikit dari pengetahuan saya tentang cara membuat aplikasi CRUD (Create, Read, Update, Delete) di Android menggunakan MySQL, PHP, JSON. Program ini sangat bermanfaat jika ingin mendata banyak orang.

Tanpa memperpanjang waktu lagi akan saya jelaskan caranya. Pertama – tama kita membutuhkan peralatan yang digunakan untuk membuat aplikasi ini :

PERALATAN

Database : MySQL (Disini saya menggunakan XAMPP) bisa didownload DISINI
PHP : Notepad++ bisa didownload DISINI
Android Studio bisa didownload DISINI

PERSIAPAN

Database :
1. Buka localhost/phpmyadmin
2. Buat database dengan nama tabelbiodata
PHP :
1. Buka folder htdocs (C:\xampp\htdocs)
2. Buat folder dengan nama tips_crud_android_json_mysql
3. Di dalam folder tersebut buat sebuah file dengan server.php
Android :
1. Buatlah project baru (Start a new Android Studio Project)
2. Pada lokasi src pastikan sudah ada file :
  1. MainActivity.java
  2. KoneksiActivity.java
  3. BiodataActivity.java
3. Pada drawable sisipkan sebuah gambar, saya buat webserver.png

Jika semua persiapan sudah selesai, selanjutnya bukan AndroidManifest.xml,pastikan aplikasi sudah memiliki izin untuk mengakses internet :

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

Selanjutnya, kita akan membuat tabel dari database melalui query

CREATE TABLE IF NOT EXISTS `isibiodata` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `nama` varchar(50) NOT NULL,
  `alamat` varchar(200) NOT NULL,
  PRIMARY KEY (`id`)
)

Kemudian kita akan membuat isi dari tabel berikut

INSERT INTO `tabel_biodata` (`id`, `nama`, `alamat`) VALUES
(1, 'Evan Edsa Azola', 'Komplek Filano'),
(2, 'Harry', 'Bukittinggi'),
(3, 'Rully', 'Batusangkar');

maka hasilnya akan berbentuk seperti ini :

Selanjutnya kita akan membuat source code di server.php

<?php
$server = “localhost”;
$username = “root”;
$password = “”;
$database = “tabelbiodata”;
$con = mysqli_connect($server, $username, $password) or die(“<h1>Koneksi Mysqli Error : </h1>” . mysqli_connect_error());
mysqli_select_db($con, $database) or die(“<h1>Koneksi Kedatabase Error : </h1>” . mysqli_error($con));

@$operasi = $_GET[‘operasi’];

switch ($operasi) {
case “view”:
$query_tampil_biodata = mysqli_query($con,”SELECT * FROM isibiodata”) or die (mysqli_error($con));
$data_array = array();
while ($data = mysqli_fetch_assoc($query_tampil_biodata)) {
$data_array[]=$data;
}
echo json_encode($data_array);

break;

case “insert”:
@$nama = $_GET[‘nama’];
@$alamat = $_GET[‘alamat’];
$query_insert_data = mysqli_query($con, “INSERT INTO isibiodata (nama,alamat) VALUES(‘$nama’,’$alamat’)”);
if ($query_insert_data) {
echo “Data Berhasil Disimpan”;
}
else {
echo “Maaf Insert Ke Dalam Database Error” . mysqli_error($con);
}

break;

case “get_biodata_by_id”:
@$id = $_GET[‘id’];
$query_tampil_biodata = mysqli_query($con, “SELECT * FROM isibiodata WHERE id=’$id'”) or die (mysqli_error($con));
$data_array = array();
$data_array = mysqli_fetch_assoc($query_tampil_biodata);
echo “[” . json_encode ($data_array) . “]”;

break;

case “update”:
@$nama = $_GET[‘nama’];
@$alamat = $_GET[‘alamat’];
@$id = $_GET[‘id’];
$query_update_biodata = mysqli_query($con, “UPDATE isibiodata SET nama=’$nama’, alamat=’$alamat’ WHERE id=’$id'”);
if ($query_update_biodata) {
echo “Update Data Berhasil”;
}
else {
echo mysqli_error($con);
}

break;

case “delete”:
@$id = $_GET[‘id’];
$query_delete_biodata = mysqli_query($con, “DELETE FROM isibiodata WHERE id=’$id'”);
if ($query_delete_biodata) {
echo “Data Berhasil Dihapus”;
}
else {
echo mysqli_error($con);
}

break;

default:
break;
}
?>

Sebelum diujikan ke aplikasi android, source code ini bisa diujikan pada sebuah browser

Pengujian view :

http://localhost/tips_crud_android_json_mysql/server.php?operasi=view

Output :

Pengujian insert :

http://localhost/tips_crud_android_json_mysql/server.php?operasi=insert&nama=Rudi&alamat=Pekanbaru

Pengujian get_biodata_by_id :

http://localhost/tips_crud_android_json_mysql/server.php?operasi=get_biodata_by_id&id=1

Pengujian update :

http://localhost/tips_crud_android_json_mysql/server.php?operasi=update&nama=Ahmad&alamat=Pekanbaru&id=4

Pengujian delete :

Selanjutnya kita akan membuat source code untuk android

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:orientation="vertical"
    tools:context="com.neotelemetri.webserver.MainActivity">

    <Button
        android:id="@+id/buttonTambahBiodata"
        android:layout_width="186dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Tambah Biodata"/>

    <HorizontalScrollView
        android:id="@+id/horizontalScrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ScrollView
            android:id="@+id/verticalScrollView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <TableLayout
                android:id="@+id/tableBiodata"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="80dp">
            </TableLayout>
        </ScrollView>
    </HorizontalScrollView>
</LinearLayout>

Source Code untuk KoneksiActivity.java :

public class KoneksiActivity {

    // Mendapatkan nilai bit yang diperlukan
    public String call(String url) {
        int BUFFER_SIZE = 2000;
        InputStream in = null;
        try {
            in = OpenHttpConnection(url);
        } catch (IOException e) {
            e.printStackTrace();
            return "";
        }
        // Membaca nilai bit menjadi nilai character
        InputStreamReader inputStreamReader = new InputStreamReader(in);
        int charRead;
        String string = "";
        char[] inputBuffer = new char[BUFFER_SIZE];
        try {
            while ((charRead = inputStreamReader.read(inputBuffer)) > 0) {
                String readString = String.copyValueOf(inputBuffer, 0, charRead);
                string += readString;
                inputBuffer = new char[BUFFER_SIZE];
            }
            in.close();
        } catch (IOException e) {
            e.printStackTrace();
            return "";
        }
        return string;
    }

    // Membuka URL dan meminta respon dari inputStreamReader
    private InputStream OpenHttpConnection(String url) throws IOException {
        InputStream in = null;
        int response = -1;
        URL url1 = new URL(url);
        URLConnection conn = url1.openConnection();
        if (!(conn instanceof HttpURLConnection)) throw new IOException("Not An Http Connection");
        try {
            HttpURLConnection httpurlconnection = (HttpURLConnection) conn;
            httpurlconnection.setAllowUserInteraction(false);
            httpurlconnection.setInstanceFollowRedirects(true);
            httpurlconnection.setRequestMethod("GET");
            httpurlconnection.connect();
            response = httpurlconnection.getResponseCode();
            if (response == HttpURLConnection.HTTP_OK) {
                in = httpurlconnection.getInputStream();
            }
        } catch (Exception e) {
            throw new IOException("Error Connecting");
        }
        return in;
    }

Selanjutnya adalah Source Code untuk BiodataActivity.java :

public class BiodataActivity extends KoneksiActivity {
    // Source Code untuk URL -> URL menggunakan IP Address yang didapat dari komputer / laptop
    String URL = " http://192.168.1.109/tips_crud_android_json_mysql/server.php";
    String url = "";
    String response = "";

    // Menampilkan biodata dari database
    public String tampilBiodata() {
        try {
            url = URL + "?operasi=view";
            System.out.println("URL Tampil Biodata : " + url);
            response = call(url);
        }
        catch (Exception e) {
        }
        return response;
    }

    // Memasukkan data biodata baru ke database
    public String insertBiodata(String nama, String alamat) {
        try {
            url = URL + "?operasi=insert&nama=" + nama + "&alamat=" + alamat;
            System.out.println("URL Insert Biodata : " + url);
            response = call(url);
        }
        catch (Exception e) {
        }
        return  response;
    }

    // Melihat biodata yang diinginkan melalui ID
    public String getBiodataById (int id) {
        try {
            url = URL + "?operasi=get_biodata_by_id&id=" + id;
            System.out.println("URL Insert Biodata : " + url);
            response = call(url);
        }
        catch (Exception e) {
        }
        return response;
    }

    // Mengubah isi biodata yang sudah ada di database
    public String updateBiodata (String id, String nama, String alamat) {
        try {
            url = URL + "?operasi=update&id=" + id + "&nama=" + nama + "&alamat=" + alamat;
            System.out.println("URL Insert Biodata : " + url);
            response = call(url);
        }
        catch (Exception e) {
        }
        return response;
    }

    // Menghapus salah satu biodata pada database
    public String deleteBiodata (int id) {
        try {
            url = URL + "?operasi=delete&id=" + id;
            System.out.println("URL Insert Biodata : " + url);
            response = call(url);
        }
        catch (Exception e) {
        }
        return response;
    }
}

Berikutnya adalah source code untuk MainActivity.java :

public class MainActivity extends AppCompatActivity implements OnClickListener {

    BiodataActivity biodataActivity = new BiodataActivity();
    TableLayout tableLayout;
    Button buttonTambahBiodata;
    ArrayList<Button>buttonEdit = new ArrayList<Button>();
    ArrayList<Button>buttonDelete = new ArrayList<Button>();
    JSONArray arrayBiodata;



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Jika SDK Android diatas API Ver.9
        if (android.os.Build.VERSION.SDK_INT > 9) {
            StrictMode.ThreadPolicy policy = new StrictMode.ThreadPolicy.Builder()
                    .permitAll().build();
            StrictMode.setThreadPolicy(policy);
        }

        // Mendapatkan data widget dari XML Activity melalui ID
        tableLayout = (TableLayout) findViewById(R.id.tableBiodata);
        buttonTambahBiodata = (Button) findViewById(R.id.buttonTambahBiodata);
        buttonTambahBiodata.setOnClickListener(this);

        // Menambahkan baris untuk tabel
        TableRow barisTabel = new TableRow(this);
        barisTabel.setBackgroundColor(Color.CYAN);

        // Menambahkan tampilan teks untuk judul pada tabel
        TextView viewHeaderId = new TextView(this);
        TextView viewHeaderNama = new TextView(this);
        TextView viewHeaderAlamat = new TextView(this);
        TextView viewHeaderAction = new TextView(this);

        viewHeaderId.setText("ID");
        viewHeaderNama.setText("Nama");
        viewHeaderAlamat.setText("Alamat");
        viewHeaderAction.setText("Action");

        viewHeaderId.setPadding(5, 1, 5, 1);
        viewHeaderNama.setPadding(5, 1, 5, 1);
        viewHeaderAlamat.setPadding(5, 1, 5, 1);
        viewHeaderAction.setPadding(5, 1, 5, 1);

        // Menampilkan tampilan TextView ke dalam tabel
        barisTabel.addView(viewHeaderId);
        barisTabel.addView(viewHeaderNama);
        barisTabel.addView(viewHeaderAlamat);
        barisTabel.addView(viewHeaderAction);

        // Menyusun ukuran dari tabel
        tableLayout.addView(barisTabel, new TableLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));

        try {
            // Mengubah data dari BiodataActivity yang berupa String menjadi array
            arrayBiodata = new JSONArray(biodataActivity.tampilBiodata());
            for (int i = 0; i < arrayBiodata.length(); i++) {
                JSONObject jsonChildNode = arrayBiodata.getJSONObject(i);
                String nama = jsonChildNode.optString("nama");
                String alamat = jsonChildNode.optString("alamat");
                String id = jsonChildNode.optString("id");

                System.out.println("Nama : " + nama );
                System.out.println("Alamat : " + alamat);
                System.out.println("ID : " + id);

                barisTabel = new TableRow(this);

                // Memberi warna pada baris tabel
                if (i % 2 == 0) {
                    barisTabel.setBackgroundColor(Color.LTGRAY);
                }

                TextView viewId = new TextView(this);
                viewId.setText(id);
                viewId.setPadding(5, 1, 5, 1);
                barisTabel.addView(viewId);

                TextView viewNama = new TextView(this);
                viewNama.setText(nama);
                viewNama.setPadding(5, 1, 5, 1);
                barisTabel.addView(viewNama);

                TextView viewAlamat = new TextView(this);
                viewAlamat.setText(alamat);
                viewAlamat.setPadding(5, 1, 5, 1);
                barisTabel.addView(viewAlamat);

                // Menambahkan button Edit
                buttonEdit.add(i, new Button(this));
                buttonEdit.get(i).setId(Integer.parseInt(id));
                buttonEdit.get(i).setTag("Edit");
                buttonEdit.get(i).setText("Edit");
                buttonEdit.get(i).setOnClickListener(this);
                barisTabel.addView(buttonEdit.get(i));

                // Menambahkan tombol Delete
                buttonDelete.add(i, new Button(this));
                buttonDelete.get(i).setId(Integer.parseInt(id));
                buttonDelete.get(i).setTag("Delete");
                buttonDelete.get(i).setText("Delete");
                buttonDelete.get(i).setOnClickListener(this);
                barisTabel.addView(buttonDelete.get(i));

                tableLayout.addView(barisTabel, new TableLayout.LayoutParams
                        (LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
            }
        }
        catch (JSONException e) {
            e.printStackTrace();
        }
    }

    public void onClick (View view) {
        if (view.getId() == R.id.buttonTambahBiodata) {
            tambahBiodata();
        }
        else {
            for (int  i= 0; i < buttonEdit.size(); i++) {
                // Jika ingin mengedit data pada biodata
                if (view.getId() == buttonEdit.get(i).getId() && view.getTag().toString().trim().equals("Edit")) {
                    Toast.makeText(MainActivity.this, "Edit : " + buttonEdit.get(i).getId(), Toast.LENGTH_SHORT).show();
                    int id = buttonEdit.get(i).getId();
                    getDataByID(id);
                }
                // Menghapus data di Tabel
                else if (view.getId() == buttonDelete.get(i).getId() && view.getTag().toString().trim().equals("Delete")){
                    Toast.makeText(MainActivity.this, "Delete : " + buttonDelete.get(i).getId(), Toast.LENGTH_SHORT).show();
                    int id = buttonDelete.get(i).getId();
                    deleteBiodata(id);
                }
            }
        }
    }


    public void deleteBiodata (int id) {
        biodataActivity.deleteBiodata(id);
        finish();
        startActivity(getIntent());
    }

    // Mendapatkan Biodata melalui ID
    public void getDataByID (int id) {
        String namaEdit = null, alamatEdit = null;
        JSONArray arrayPersonal;

        try {
            arrayPersonal = new JSONArray(biodataActivity.getBiodataById(id));
            for (int i  = 0; i < arrayPersonal.length(); i++) {
                JSONObject jsonChildNode = arrayPersonal.getJSONObject(i);
                namaEdit = jsonChildNode.optString("nama");
                alamatEdit = jsonChildNode.optString("alamat");
            }
        }
        catch (JSONException e) {
            e.printStackTrace();
        }

        LinearLayout layoutInput = new LinearLayout(this);
        layoutInput.setOrientation(LinearLayout.VERTICAL);

        // Membuat id tersembunyi pada AlertDialog
        final TextView viewId = new TextView(this);
        viewId.setText(String.valueOf(id));
        viewId.setTextColor(Color.TRANSPARENT);
        layoutInput.addView(viewId);

        final EditText editNama = new EditText(this);
        editNama.setText(namaEdit);
        layoutInput.addView(editNama);

        final EditText editAlamat = new EditText(this);
        editAlamat.setText(alamatEdit);
        layoutInput.addView(editAlamat);

        // Membuat AlertDialog untuk mengubah data di Biodata
        AlertDialog.Builder builderEditBiodata = new AlertDialog.Builder(this);
        builderEditBiodata.setIcon(R.drawable.webse);
        builderEditBiodata.setTitle("Update Biodata");
        builderEditBiodata.setView(layoutInput);
        builderEditBiodata.setPositiveButton("Update", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                String nama = editNama.getText().toString();
                String alamat = editAlamat.getText().toString();
                System.out.println("Nama : " + nama + "Alamat : " + alamat);

                String laporan = biodataActivity.updateBiodata(viewId.getText().toString(), editNama.getText().toString(),
                        editAlamat.getText().toString());

                Toast.makeText(MainActivity.this, laporan, Toast.LENGTH_SHORT).show();

                finish();
                startActivity(getIntent());
            }
        });

        // Jika tidak ingin mengubah data pada Biodata
        builderEditBiodata.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                dialog.cancel();
            }
        });

        builderEditBiodata.show();
    }

    public void tambahBiodata() {
        LinearLayout layoutInput = new LinearLayout(this);
        layoutInput.setOrientation(LinearLayout.VERTICAL);

        final EditText editNama = new EditText(this);
        editNama.setHint("Nama");
        layoutInput.addView(editNama);

        final EditText editAlamat = new EditText(this);
        editAlamat.setHint("Alamat");
        layoutInput.addView(editAlamat);

        // Membuat AlertDialog untuk menambahkan data pada Biodata
        AlertDialog.Builder builderInsertBiodata= new AlertDialog.Builder(this);
        builderInsertBiodata.setIcon(R.drawable.webse);
        builderInsertBiodata.setTitle("Insert Biodata");
        builderInsertBiodata.setView(layoutInput);
        builderInsertBiodata.setPositiveButton("Insert", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                String nama = editNama.getText().toString();
                String alamat = editAlamat.getText().toString();
                System.out.println("Nama : " + nama + "Alamat : " + alamat);

                String laporan  = biodataActivity.insertBiodata(nama, alamat);
                Toast.makeText(MainActivity.this, laporan, Toast.LENGTH_SHORT).show();

                finish();
                startActivity(getIntent());
            }
        });

        builderInsertBiodata.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                dialog.cancel();
            }
        });
        builderInsertBiodata.show();


    }
}

Maka hasil aplikasi yang telah kita buat akan menjadi seperti ini :

Tampilan Insert Biodata Pada Aplikasi CRUD

Tampilan Update Biodata Pada Aplikasi CRUD

Untuk mengetahui alamat IP pada komputer / laptop mans2 bisa menggunakan command prompt dengan mengetikkan ipconfig. Caranya :

Buka command prompt terlebih dahulu

2. Ketikkan ipconfig pada command prompt

3. Maka akan muncul informasi mengenai alamat IP kita dan alamat IP tersebut yang akan kita gunakan sebagai url

NOTE ! : Pada saat me-run aplikasi, pastikan XAMPP masih aktif. Jika XAMPP tidak aktif maka aplikasi tidak akan menampilkan isi dari database (True Story :p)

Sekian dari saya mengenai cara membuat aplikasi android CRUD sederhana, mohon maaf jika ada kesalahan. Semoga bermanfaat dan selamat mencoba mans2 XD.

2 thoughts on “Aplikasi CRUD Android Sederhana Menggunakan MySQL, PHP, JSON”

Aziz says:

June 19, 2017 at 8:30 am

#ASK
kenapa ya mas pada saat saya run aplikasinya nge load layoutnya lumayan lama + tombol tambah biodata ga bisa dipencet

1. Evan Edsa Azola says:
  
  August 13, 2017 at 9:01 am
  
  Selamat siang mas aziz, Maaf baru saya bales.
  
  Untuk masalah loading layout, coba dicheck terlebih dahulu kecepatan internet mas aziz. Dan untuk masalah tombol tambah biodatanya, apakah dalam kodingan tombol nya sudah didefine terlebih dahulu menggunakan “findViewById()” ?

Blog Neo Telemetri