Selasa, 21 November 2023

Memahami Dasar Jaringan dan Membuat Form Login Sederhana dengan PHP

Pada kali ini kita akan membahas langkah-langkah penting, mulai dari memeriksa alamat IP hingga membuat aplikasi sederhana dengan form login sederhana menggunakan PHP.

Langkah 1: Mengaktifkan Apache pada Aplikasi XAMPP

Langkah pertama adalah pastikan telah meng-instal aplikasi Xampp lalu buka dan aktifkan Apache di dalamnya.



Langkah 2: Memeriksa Alamat IP Komputer dan Melakukan Ping ke Alamat IP

Selanjutnya melihat alamat IP komputer kita dengan cara buka Command Prompt dan ketikan ipconfig. Temukan alamat IPv4 di bagian yang disebut "Ethernet adapter" atau "Wireless LAN adapter." Setelah mengetahui alamat IP komputer kita, kita bisa melakukan ping ke alamat tersebut untuk memeriksa konektivitas jaringan. Ketik ping [alamat IP] di Command Prompt untuk melihat respons dari alamat tersebut.



  • Langkah 3: Memeriksa Alamat IP di Internet

    Selain alamat IP lokal, kita juga dapat mengetahui alamat IP eksternal kita saat terhubung ke internet. Buka peramban yang kalian gunakan lalu ketikan IP pada bar pencarian hingga muncul seperti ini.


  • Langkah 4: Membuat Folder Baru

    Langkah selanjutnya, mari kita buat folder baru di dalam folder xampp>htdocs. Di sini saya membuat folder baru dengan nama "Nurhidayah" yang mana folder ini nantinya akan digunakan untuk menyimpan file source code PHP yang akan kita buat.


Langkah 5: Membuat Source Code Halaman Login

Selanjutnya kita ciptakan halaman HTML yang akan menjadi tempat bagi formulir login kita.

index.php




Sourcecode:

<html>
<head>
<title>Login</title>
</head>
<body>
<center>
<H1>Halaman Login</H1>
<FORM METHOD="GET" ACTION="proses.php">
<INPUT TYPE="TEXT" NAME="nama" PLACEHOLDER="NAMA              PENGGUNA">
<BR>
<BR>
<INPUT TYPE="PASSWORD" NAME="sandi" PLACEHOLDER="SANDI PENGGUNA">
<BR>
<BR>
<INPUT TYPE="SUBMIT" VALUE="KIRIM">
</FORM>
</center>
</body>
</html>


Keterangan :
  • <html>, <head>, <body>: Struktur dasar halaman web menggunakan HTML.
  • <title>Login</title>: Menentukan judul halaman web yang akan ditampilkan pada tab browser.
  • <H1>Halaman Login</H1>: Menampilkan judul besar pada halaman login.
  • <FORM METHOD="GET" ACTION="proses.php">: Membuka sebuah form dengan metode GET yang akan mengirimkan data ke proses.php saat formulir dikirimkan.
  • <INPUT TYPE="TEXT" NAME="nama" PLACEHOLDER="NAMA PENGGUNA">: Input teks untuk nama pengguna dengan atribut name sebagai nama.
  • <INPUT TYPE="PASSWORD" NAME="sandi" PLACEHOLDER="SANDI PENGGUNA">: Input sandi dengan atribut name sebagai sandi (tipe "password" untuk menyembunyikan karakter).
  • <INPUT TYPE="SUBMIT" VALUE="KIRIM">: Tombol "KIRIM" untuk mengirimkan formulir.

Kode di atas menunjukkan pembuatan halaman login sederhana dengan dua input yaitu nama pengguna dan sandi pengguna. Form ini akan mengirimkan data ke proses.php menggunakan metode GET saat tombol "KIRIM" ditekan.

proses.php


Sourcecode:

<?php
$namakiriman=$_GET["nama"];
$sandikiriman=$_GET["sandi"];
echo "<h1> Nama Kamu : ".$namakiriman."<br>".
"Sandi Kamu : ".$sandikiriman."</h1>";


Keterangan:
  • <?php dan ?>: Menandakan awal dan akhir dari kode PHP.
  • $namakiriman=$_GET["nama"]; dan $sandikiriman=$_GET["sandi"];: Mengambil nilai dari URL yang dikirim melalui metode GET dengan variabel nama dan sandi.
  • echo "<h1> Nama Kamu : ".$namakiriman."<br>" . "Sandi Kamu : ".$sandikiriman."</h1>";: Menampilkan nilai variabel $namakiriman dan $sandikiriman dalam format HTML menggunakan tag <h1> untuk menampilkan teks besar.menggunakan metode GET di PHP. Data ini kemudian ditampilkan kembali dalam format HTML.

Langkah 6: Mengecek Form Login di Alamat

Kunjungi alamat IP di web browser dengan ditambah alamat folder dan file PHP yang telah dibuat untuk melihat formulir login yang telah dibuat. (10.254.20.121/Nurhidayah/index.php)

Langkah 7: Hasil Form Login

Setelah itu akan tampil halaman login seperti dibawah maka selanjutnya mengisi formulir login.


Data yang dimasukkan akan diproses oleh "proses.php" dan menampilkan hasilnya.


Formulir login sederhana ini memberikan pemahaman dasar tentang bagaimana data dikirimkan dan diolah di PHP. Namun, dalam aplikasi sebenarnya, penting untuk mempertimbangkan keamanan, seperti menggunakan metode POST untuk mengirimkan data agar tidak terlihat langsung di URL, serta melakukan validasi dan sanitasi data untuk menghindari kerentanan keamanan.

Demikianlah penjelasan singkat tentang formulir login menggunakan PHP. Semoga artikel ini bermanfaat bagi pengembangan aplikasi web Anda!





Kamis, 09 November 2023

Membuat Aplikasi Diary Sederhana Menggunakan MIT App Inventor

Apakah kamu pernah ingin memiliki tempat khusus untuk mencatat pikiran, perasaan, atau pengalaman sehari-hari kamu? Dalam dunia yang semakin terhubung, aplikasi diary sederhana bisa menjadi solusi yang sempurna untuk tujuan tersebut. Dalam panduan ini, kita akan belajar cara membuat aplikasi diary sederhana menggunakan MIT App Inventor. MIT App Inventor adalah platform pengembangan aplikasi yang ramah pengguna dan tidak memerlukan pengetahuan pemrograman yang mendalam.


**Langkah 1: Mempersiapkan Akun MIT App Inventor**

Langkah pertama adalah mempersiapkan akun MIT App Inventor. Untuk melakukannya, kunjungi [situs web MIT App Inventor](MIT App Inventor) dan buat akun atau masuk dengan akun Google.


**Langkah 2: Membuat Proyek Baru**

Setelah memiliki akun MIT App Inventor, buat proyek baru dengan mengklik "Start New Project." Berikan nama proyek Anda (misalnya, "Dear_Diary").


**Langkah 3: Tampilan Splash_Screen**

Pertama, kita akan membuat tampilan Splash_Screen. Pada Screen dapat menambahkan berbagai elemen seperti Image dan Teks dengan mudah. Jika kesulitan menambahkan mengatur elemen tersebut gunakan layout seperti HorizontalArrangement. Lalu ketik Blocks untuk membuat sambungan Blocks yang akan membuat Splash Screen bekerja.


**Blocks Tampilan Splash Screen**



**Hasil Tampilan Splash Screen**


**Langkah 4: Tampilan Halaman Utama**

Kita perlu menambahkan Screen baru dengan menggunakan Add Screen dan atur namanya menjadi Halaman Utama. Pada Halaman Utama ini tambahkan elemen-elemen yang dibutuhkan seperti Button, Image, Label, dll. Jangan lupa gunakan Layout agar tampilan menjadi rapi. Lalu ketik Blocks untuk membuat sambungan Blocks yang akan membuat halaman utama bekerja.


**Blocks Tampilan Halaman Utama**



**Hasil Tampilan Halaman Utama**


**Langkah 5: Tampilan Halaman Menulis**

Lakukan hal yang sama untuk menambah Screen baru untuk Halaman Menulis. Pada Halaman ini tambahkan elemen-elemen seperti Button, TextBox, DatePicker, dan TinyDB sebagai penyimpanan nantinya. Lalu ketik Blocks untuk membuat sambungan Blocks yang akan membuat Halaman Menulis bekerja.



**Blocks Tampilan Halaman Menulis**



**Hasil Tampilan Halaman Menulis**




Kurang lebih seperti itulah pembuatan aplikasi diary sederhana menggunakan MIT App Inventor. Dengan MIT App Inventor, kamu memiliki kebebasan untuk mengembangkan aplikasi sesuai dengan kebutuhan dan preferensi kamu. Gunakan tutorial ini sebagai dasar untuk membuat aplikasi diary sederhana dan teruslah bereksperimen untuk meningkatkannya sesuai dengan ide Kamu sendiri. Selamat Berkarya!

PANDUAN INSTALASI ODOO DI WINDOWS

Odoo adalah platform ERP (Enterprise Resource Planning) yang open-source dan dapat disesuaikan, yang mencakup berbagai fitur bisnis seperti ...