Cara Membuat Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022 Form Input Data (Materi 4)
Monday, November 6, 2023
12 Comments
Widitutor - Pada materi kali ini kita akan belajar cara membuat halaman form input data catatan perjalanan, dimana inputan ini akan disesuaikan dengan database table perjalanan dengan ketentuan type data inputan yang sama.
Di aplikasi catatan perjalanan ini ada terdapat satu form inputan, dimana inputan tersebut nantinya akan disimpan pada table perjalanan dan setiap inputan akan di cek sessionnya melalui source code simpan.php
Di aplikasi catatan perjalanan ini ada terdapat satu form inputan, dimana inputan tersebut nantinya akan disimpan pada table perjalanan dan setiap inputan akan di cek sessionnya melalui source code simpan.php
Persiapan penyimpanan Source Code Halaman Catatan Perjalanan Aplikasi Catatan Perjalanan
Untuk penyimpanan source code aplikasi catatan perjalanan harus terdapat beberapa folder, diantaranya folder tambah_perjalanan, buatlah folder pada aplikasi catatan perjalanan seperti gambar dibawah ini.Cara Membuat Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022 Form Input Data (Materi 4)
Penjelasan :
Folder tambah_perjalanan : fungsinya untuk menyimpan beberapa source code yang nantinya akan memproses penyimpanan inputan yang dilakukan oleh user aplikasi, selain inputan yang terdapat pada folder tambah_perjalanan juga terdapat form edit inputan, jadi seorang user tidak hanya bisa menginputkan sebuah data melainkan bisa juga mengedit data apabila terjadi kesalahan inputan.Cara Membuat Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022 Form Input Data (Materi 4)
Berikut ini source code halaman form inputan data
Cara Simpan Source Code Halaman Form Inputan Data Catatan Perjalanan
Dalama penyimpanan source code ini harus Ada beberapa source code yang harus dibuatkan dalam folder tambah_perjalanan ini, perlu diperhatikan dalam penyimpanan source code ini aturan serta ekstensi yang harus sesuai dengan bahasa pemrograman yang digunakan.Berikut ini source code halaman form inputan data
1. Tambah.php
Source code tambah merupakan syntak yang berfungsi untuk menampilkan form inputan data catatan perjalanan, dalam syntak ini terdapat banyak sekali query data yang harus sesuai dengan inputan data pada table perjalanan.a. Inputan Tanggal, dimana inputan ini harus dengan type inputan data (tanggal). Inputan ini berfungsi agar user mudah melakukan inputan data tanggal yang sesuai dengan hari dimana user melakukan perjalanan, <input type="date" name="tanggal"class="form-control" >
penjelasan : inputan type date digunakan untuk inputan tanggal, name =”tanggal” disesuaikan dengan nama kolom pada table database, perlu diperhatikan apabila terdapat kesalahan pada penyebutan nama kolom, maka akan terdapat kesalahan dan terjadi error pada inputan aplikasi.
b. Inputan Waktu, inputan ini menggunakan type data time disesuaikan dengan kriterian inputan waktu, terdapat jam, menit dan detik. <input type="time"name="waktu" class="form-control">
name=”waktu” disesuaikan dengan nama kolom yang ada di table perjalanan agar tidak terdapat kesalahan anda bisa mengikuti cara di atas.
c. Inputan Lokasi, inputan ini digunakan untuk user mampu menunjukan tempat atau lokasi dimana pada saat itu user melakukan perjalanan. Menunjukan suatu tempat dengan menginputkan nama tempat tersebut. <input type="text" name="lokasi"class="form-control" placeholder="Masukkan Lokasi ">
untuk type inputan kita menggunakan type =”text” memudahkan user menginput nama tempat dengan type teks atau kalimat dalam bentuk abcd dan numbering. Contoh, Jl. Citarik rt 02 rw 03 kecamatan palabuhanratu, desa tonjong, kabupaten sukabumi, provinsi jawa barat.
d. Inputan Suhu, pada inputan ini merupakan inputan yang paling penting dimana user akan menginputkan suhu tubuh pada tempat tertentu. Jadi inti aplikasi catatan perjalanan ini untuk mengetahui suatu suhu tubuh user pada tempat tertentu yang dia kunjungi, kemudian nantinya akan menjadikan referensi serta laporan user untuk mengetahui berapa suhu dia pada tempat tersebut dan berapa suhu dia pada tempat yang lainnya.
<input type="number" name="suhu"class="form-control" placeholder="Masukkan Suhu Tubuh Anda ">, dengan type inputan number memudahkan user untuk penginputan data, yang artinya data tidak bisa menggunakan kata atau text hanya mampu menginputkan data nomor atau numbering.
Salin code dibawah ini, simpan dengan nama tambah.php dalam folder tambah_perjalanan yang sebelumnya kamu buat.
2. simpan.php
Sorce code simpan.php ini merespon dari source code tambah.php, contoh mudahnya jika user melakuakn penginputan maka akan di tunjukan ke halaman simpan.php (<form action="simpan.php"method="POST">) dengan action simpan.php yang sebelumnya pernah kita buat.Setelah melakukan pengimputan maka aplikasi akan memproses penginputan tersebut kemudian menyimpannya kedalam source code simpan.php, kemudian soruce code simpan.php ini memiliki fungsi untuk meneruskan inputan user ke dalam table perjalanan yang ada di database anda.
Salin code simpan.php ini kemudian simpan dengan nama simpan.php di dalam tambah_perjalanan
3. ubah.php
Setelah kita membuat form inputan data kemudian kita juga harus membuat form edit data, dimana form edit data ini fungsinya untuk mengubah inputan data yang tersimpan di table perjalanan database. Sangat penting sekali peranan ubah.php ini, agar user mampu mengubah data yang sebelumnya sudah di input dan sudah tersimpan menjadi data yang baru tanpa harus melakukan penginputan ulang. Hal ini sesuai dengan aturan aplikasi catatatn perjalan yang mengharuskan mampu mengoperasikan CRUD (creat, read, update, delet) data.Simpan source code dibawah ini dengan nama ubah.php difolder tambah_perjalanan aplikasi anda.
4. simpan_ubah.php
Jika sebelumnya kita membuat simpan.php untuk form penginputan data, maka kali ini kita akan membuat simpan_ubah.php untuk mengupdate atau memproses pengubahan data pada pengeditan data yang sebelumnya sudah di inputkan dan tersimpan pada table perjalanan database aplikasiSimpan source code dibawah ini dengan nama simpan_ubah.php difolder tambah_perjalanan aplikasi anda.
Cara menjalankan Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022
Pastikan anda sudah memiliki dan membuat source code serta sudah menyimpan syntak tersebut pada folder serta nama yang sesuai dengan materi ini. Dan anda juga perlu untuk menginstal serta mengaktifkan aplikasi Xampp control panel, buat aplikasi Xampp control panel selalu aktif selama dalam pengujian aplikasi catatan perjalanan ini. Biarkan aplikasi berjalan dilatar belakang komputer atau laptop anda, agar penginputan serta mengakses aplikasi tetap dapat digunakan dalam aplikasi web browser anda.Kesimpulan Aplikasi
Selesai sudah materi kali ini dalam pembuatan aplikasi catatan perjalanan, dimana aplikasi ini jauh sekali dari kata sempurna, user diharapkan mampu memodifikasi hasil yang sudah dipelajari dan mampu mempraktekkan dalam pembuatan aplikasi serta mampu melakukan penyempurnaan pada aplikasi tersebut.Ada beberapa hal yang harus dipersiapkan dalam proses uji aplikasi kali ini diantaranya user harus mampu memahami bahasa pemrograman HTML dasar, PHP dasar, CSS dasar. Mengapa demikian? Sebab aplikasi ini dibuat menggunakan beberapa bahasa pemrograman yang terbilang cukup mudah dan paling dasar
Hanya itu saja kali ini untuk materi Cara membuat Aplikasi Catatan Perjalanan Peduli diri Berbasis Web UKK Paket 1 2022 semoga dapat bermanfaat dan menjadikan kita menjadi manusia yang selalu semangat belajar dalam mencoba hal baru dan ilmu baru.
Salam hangat dari widitutor semoga berhasil.

Egisna XII RPL 1 sudah menyelesaikan materi 4
ReplyDeleteIkbal Nurpadilah sudah menyelesaikan materi 4
ReplyDeleteSaepul Anwar sudah menyelesaikan materi 4
ReplyDeleteAlpan sudah meyelesaikan materi 4
ReplyDeleteFajar Pratama sudah menyelesaikan materi 4
ReplyDeleteTerimakasih sekali widitutor sangat membantu saya dalam membuat aplikasi catatan perjalanan, semoga lancar selalu rejekinya,
ReplyDeleteaminnn
Yusup maulana XII RPL 1 sudah menyelesaikan materi 4
ReplyDeleteRafli ramadhani XII RPL 1 sudah menyelesaikan materi4
ReplyDeletezahran XII RPL 1 sudah menyelesaikan materi 4
ReplyDeleteRini 12 Rpl1 sudah menyelesaikan materi 4
ReplyDeleteNita 12 rpl 1 sudah menyelesaikan materi 4
ReplyDeleteMuhammad Yusuf andika 12 RPL 1 sudah mengerjakan materi 4
ReplyDelete