Tukang IT: Aplikasi sederhana dengan HTML dan PHP

Malem semua, kebetulan malem ini malem minggu :v dan gregetnya mati listrik di wilayah tempat tinggal ts :3

bahan-bahannya
1. ~~sabun~~ XAMPP :v
2. PC/Laptop ~~Tangtop~~
3. Niat dan Doa
4. Jari untuk mengetik
5. Mata untuk melihat

ok mari kita bahas cara bikin aplikasi sederhana :3
ok sebelumnya jika ada yg belum tahu ~~bulat~~ tentang apa sih HTML (Hypertext Markup Language) sama ~~Pemberi Harapan Palsu~~ PHP (Hypertext Preproccessor) :3 mari tanya ke ~~rumput yg bergoyang~~ mbah gugel atau ke om wiki :3

ok mari langsung aja saya kasih script sederhananya di bawah :3
utuk penjelasannya di bawahnya lagi :v

1. kita buat folder project kita

folder disini dimaksudkan agar saat kalian bikin project selanjutnya kaga bingung sama aplikasi yg nyampur2 kaya es campur :3

misalnya project_1 letakan di dalam folder xampp/htdocs/disini :3

2. buka text editor kesukaan kalian

ok disini kalian menyiapan text editor buat nanti kalian mijit2 keyboard :3

3. Script 1

Copy bahasa ~~alien~~ HTML ini ke text editor kalian :3

<html>
  <head>
    <title>Aplikasi Sederhana</title>
  </head>
  <body>
  <h1>Aplikasi Sederhana Dengan HTML dan PHP</h1>
  <br>
  <table>
  <form action="proses.php" method="POST">
  <tr><td>Nama Lengkap</td><td><input type="text" name="nama_lengkap"></td></tr>
  <tr><td>Tempat, Tgl Lahir</td><td><input type="text" name="ttl"></td></tr></tr>
  <tr><td>Alamat</td><td><textarea name="alamat"></textarea></td></tr></tr>
  <tr><td><input type="submit" value="Ok Sip"></td></tr>
  </form>
  </table>
  </body>
</html>

lalu simpan dengan nama index.html
contoh jika anda menggunakan notepad biasa :3 sesuaikan dengan editor masing2

lalu buka dengan browser kesayangan kalian lalu ketikan di URL browser dengan 127.0.0.1/project_1

maka akan nongol seperti ini :v

4. penjelasan Script 1

<html>
  <head>
    <title> ... </title>
  </head>
  <body>
  ...
  </body>
</html>

tag <head> ... </head> adalah tag tempat menempatkan elemen judul suatu website atau disain suatu website
tag <title> ... </title> adalah tempat dimana judul suatu website berada, coba kalian perhatikan di bagian pojok atas kiri browser kalian saat membuka website, ya tepat sekali title berada di situ :3
tag <body> ... </body> adalah tempat dimana isinya suatu website berada :v bisa kalian isi sesuka hati, contohnya script diatas :v

  <h1>Aplikasi Sederhana Dengan HTML dan PHP</h1>
  <br>
  <table>
  <form action="proses.php" method="POST">
  <tr><td>Nama Lengkap</td><td><input type="text" name="nama_lengkap"></td></tr>
  <tr><td>Tempat, Tgl Lahir</td><td><input type="text" name="ttl"></td></tr></tr>
  <tr><td>Alamat</td><td><textarea name="alamat"></textarea></td></tr></tr>
  <tr><td><input type="submit" value="Ok Sip"></td></tr>
  </form>
  </table>

tag <h1> ... </h1> gunanya untuk header atau kepala :v maximal sampai h7
tag <table ... <table> berguna untuk bikin tabel :3
tag <tr> ... </tr> kepanjangan dari table row fungsinya membuat baris pada table :3
tag <td> ... </td>kepanjangan dari table data fungsinya buat tempat dimana data dalam table di letakan :3
tag <form> ... </form> dipake buat menerima masukan dari user buat di kirim ke server, action="proses.php" adalah tempat tujuan mengirimkan data dari user ke server, method="POST" berguna ngasih tau keserver metode apa yg kita pakai apakah POST atau GET :3
tag <input> gunanya buat tempat kalian memasukan karakter, type="text" untuk memasukan karakter text, type="submit" untuk membuat tombol untuk mengirim karakter :3
tag <textarea> ... </textarea> hampir sama dengan input hanya saja tag ini lebih banyak mengisikan karakter :3

5. script 2
nah script sebelumnya berisikan code buat user alias buat pemakai untuk sebuah aplikasi dapat berjalan harus punya script proses :3
contohnya

<html>
  <head>
    <title>Aplikasi Sederhana</title>
  </head>
  <body>
  <h1>Aplikasi Sederhana Dengan HTML dan PHP</h1>
  <br>
  <table>
  <tr><td>Nama Lengkap</td><td> : <?php echo $_POST['nama_lengkap']; ?></td></tr>
  <tr><td>Tempat, Tgl Lahir</td><td> : <?php echo $_POST['ttl']; ?></td></tr></tr>
  <tr><td>Alamat</td><td> : <?php echo $_POST['alamat']; ?></td></tr></tr>
  </table>
  </body>
</html>

lalu simpan dengan cara seperti sebelumnya dengan nama proses.php

tag <?php ... ?> mendefiniskan itu adalah bahasa PHP :3
tag echo hanya untuk php berguna untuk menampilkan suatu data :v
tag $_POST[' ... '] berguna untuk mengambil data yg dikirimkan user ke server :v

6. Uji nyali :v
ok tahap ini adalah tahap uji nyali eh coba maksudnya :v
kalian isikan inputan yg tersedia lalu klik tombolnya :v

setelah di klik tombolnya

jika berhasil maka selamat anda menjadi programer :v

sekian dari saya jika da kesalahan mohon di koreksi kripik pedas dan saran tolong komen aja gan :v

disana gunung disini gunung di tengah2nya pulau jawa

jika ada umur yg panjang pasti kita berjumpa lagi :v wkwkw :D

wasalam :3

Tukang IT

Saturday, 27 August 2016

Aplikasi sederhana dengan HTML dan PHP

3 comments:

Contact Me

Ini Profil