Cara Membuat Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022 (Materi 1)

Bagi anda siswa kelas 3 jurusan rekayasa perangkat lunak (RPL) tentunyaa sebentar lagi akan melaksanakan ujikom (ujian kompetensi) dengan tugas membuat aplikasi berbasis web ataupun berbasis desktop. 

Hal ini menjadi syarat asessment ataupun penilaian sebagai tanda kelulusan anda dalam melaksanakan ujian kompetensi. Pada kesempatan ini widitutor akan menjelaskan bagaimana cara membuat aplikasi catatan perjalanan.

Sekilas Aplikasi

Aplikasi catatan perjalanan ini awalnya dibuat untuk merekap history perjalanan seseorang dari suatu tempat ke tempat lain dengan tujuan membuat laporan suhu tubuh seseorang disetiap tempat yang dia kunjungi dimasa pandemi. Aplikasi ini memudahkan kita untuk mengetahui beraha suhu tubuh kita pada tempat yang kita kunjungi, dengan fitur yang dibuat diharapkan mampu memudahkan seseorang untuk mengetahui kesehatannya serta dapat membuat laporan catatan perjalanan yang selama ini dia tempuh.

Cara Membuat Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022 (Materi 1)

Komponen yang perlu di siapkan

Pada aplikasi catatan perjalan ada beberapa hal yang harus di persiapkan, diantaranya aplikasi atau software sebagai pendukung pembuatan aplikasi catatan perjalanan. 

1. Sublime text (atau text editor, untuk membuat codingan atau code program)

2. Xampp control Panel V3.2.2, untuk menjalankan web server yang nantinya akan digunakan untuk mengakses database melalui localhots/phpmyadmin

3. Aplikasi Web browser, untuk menjalankan aplikasi (google chrome, ataupun web browser lainnya)

Tutorial Aplikasi

Hal pertama yang harus kita buat adalah database aplikasi catatan perjalanan, database ini fungsinya untuk menyimpan setiap inputan dari aplikasi dan kemudian data yang sudah diinput ke dalam aplikasi tersimpan pada database harus di tampilkan di apilikasi. Hal ini menjadi syarat penilaian ujian kompetensi, aplikasi kita harus bisa melakukan CRUD (create, read, update, delete)

1. Langkah Membuat Database

A. Buka Xampp control Panel

Hal pertama yang harus dilakukan adalah membuka aplikasi xampp control panel kemudian aktifkan Apache dan MySql seperti gambar dibawah ini. Klik tombol start pada apache dan mysql apabila berubah menjadi tombol stop maka sudah dipastikan xampp control panel sudah aktif, setelah itu minimize aplikasi xampp control panel biarkan berjalan dilatar belakang komputer anda.

B. Buka Aplikasi Web Browser

Buka aplikasi web browser seperti google crome kemudian pada url address ketikkan perintah localhost/phpmyadmin untuk mengakses tampilan dashboard phpmyadmin. Perhatikan gambar dibawah ini

2. Membuat Database

Setelah localhost/phpmyadmin di akses maka anda akan disuguhkan pada halaman dashboard phpmyadmin, kemudian langkah awal yang harus dilakukan adalah membuat database aplikasi catatan perjalanan. Database yang akan kita buat adalah catatan_perjalanan. Ada aturan yang harus diapahami terlebih dahulu dalam membuat database dimana kita tidak boleh menggunakan spasi, jika dalam nama database memiliki karakter lebih dari satu kata maka anda bisa menggunakan garis bawah untuk menjadikannya agar tidak terpisah seperti (catatan_perjalanan)

Pilih new untuk membuat database baru kemudian masukan nama database yang akan anda buat setelah itu klik buat atau create, perhatikan gambar dibawah ini

Setelah itu anda akan membuat table untuk database aplikasi catatan perjalanan, table ini nantinya digunakan untuk menampung ataupun menyimpan setiap inputan data pada aplikasi. Pada aplikasi catatan perjalanan ini terdapat 2 table yang harus dibuat pada database aplikasi diantaranya,

1. Table Login

2. Table Perjalanan

A. Membuat table login

Setelah membuat database maka selanjutnya anda akan berlanjut ke halaman membuat table, untuk table pertama kita akan membuat table login, dimana table login ini nantinya untuk menyimpan data login user serta menyimpan data register user pada aplikasi catatan perjalanan peduli diri.

Perhatikan contoh gambar dibawah ini, buatlah nama table dengan nama login kemudian tuliskan angka 3 untuk jumlah kolom pada table setelah itu klik kirim. Perhatikan contoh dibawah ini

Setelah membuat nama table dan menentukan jumlah kolom, anda harus membuat nama kolom tersebut diantaranya ID, NIK dan NAMA. 

Pada aplikasi catatan perjalanan setiap user login menggunankan NIK dan Nama, mengapa data NIK menjadi dasar utama untuk login ? karna setiap warga negara indonesia memiliki data NIK yang berbeda – beda dan tidak ada yang sama sekalipun dalam 1 keluarga, jadi NIK menjadi data untuk login di aplikasi catatan perjalanan ini untuk menghindari tidak adanya duplikat data. Buatlah nama kolom pada table login seperti contoh gambar dibawah ini. 

Penjelasan :

ID : dengan jenis type data integer dikarenakan id merupakan inputan untuk numbering (type data angka) dengan panjan nilai tidak ditentukan dikarenakan id akan dibuatkan AUTO_INCREMENT yang artinya setiap inputan data akan otomatis melanjutkan inputan sebelumnya sehingga terhindar dari duplikat data. Jadi id ini merupakan primary key atau kata kunci pada setiap data user, setiap data user memiliki id yang berbeda sekalipun terdapat kesamaan pada nama user tersebut.

NIK : menggukan type data varchar untuk memudahkan inputan data nik, sebetulnya bisa saja menggunakan type data integer sama seperti id karna type data nik merupakan angka dengan panjang nilai 33

NAMA : merupakan type data varchar bertujuan memudahkan user untuk menambahkan nama huruf dengan angka seperti widitutor1

Setelah itu klik simpan untuk menyimpan kolom tersebut. Maka hasilnya akan seperti gambar dibawah ini

1. Input data user

Pilih menu tambahkan atau insert untuk menambahkan data user yang nantinya akan digunakan untuk user melakukan login di aplikasi catatan perjalanan berbasis web.

Perhatikan gambar dibawah ini anda bisa menginputkan nik anda dan nama anda untuk inputan anda nanti login di aplikasi catatan perjalanan, untuk id jangan inputkan data, karena id ini sifatnya auto_increment yang artinya dia akan otomatis terinput dengan sendirinya menyesuaikan urutan dari sebelumnya, seperti contoh gambar dibawah ini. Jika sudah sama dengan contoh dibawah ini klik kirim

Hasilnya akan seperti gambar ini

B. Membuat Table Perjalanan

Setelah membuat table login kita akan membuat table perjalan pada database catatan perjalanan.

Klik new dibawah database seperti gambar dibawah ini untuk membuat table baru

Setelah itu buat nama table dengan nama perjalanan dan jumlah kolom 5 seperti contoh gambar dibawah ini

Penjelasan : 

ID : Sama seperti table sebelumnya untuk table perjalanan id dibuatkan auto_increment (primary key)

Tanggal : inputan untuk menentukan tanggal perjalanan pengguna aplikasi

Waktu : inputan untuk menunjukan waktu pada saat perjalanan pengguna aplikasi

Lokasi : data inputan tempat yang di tuju oleh user di aplikasi

Suhu : data untuk mengukur suhu tubuh seseorang dalam menempuh perjalanan dan ditempat tujuan tersebut.

Klik simpan untuk menyimpan data tersebut. 

C. Tampilan Akhir

Berikut ini merupakan hasil akhir dari database catatan perjalanan. Jika database sudah dibuat maka langkah selanjutnya adalah membuat program aplikasi catatan perjalanan. Perlu diperhatikan bahwa membuat database merupakan langkah awal yang harus dilakukan dalam membuat aplikasi. Menurut widitutor.my.id database merupakan langkah awal sebagai wadah atau penampung data dalam pembuat aplikasi, setelah itu barulah kita membuat aplikasi disesuaikan dengan perancangan table pada database aplikasi. 

Pastikan database yang anda buat sudah memiliki dua table seperti gambar diatas, jika dipastikan sudah maka materi untuk membuat database aplikasi catatan perjalanan dinyatakan selesai. Sekian terimakasih.

Siapa saja boleh

Seorang biasa yang belajar menulis blog

Share this post