Web Programming I

Sabtu, 25 April 2020

Latihan Slide pertemuan ke-5 Form Input Komentar Web Programming 1

Buat file untuk menampilkan form input dan output seperti gambar dibawah ini. Simpan dengan nama: forminputkomentar.php dan tampil komentar.php Form Input :

Form input komentar :

Scrip php untuk tampilan diatas:

<html>

<head>

<title>Latihan</title>

</head>

<p>Komentar dan Saran Anda Sangat Kami Butuhkan<br>

Untuk Meningkatkan Kualitas Situs Kami<br></p>

<hr/>

Nama Anda : <input type="text" name="nama" size="25">

Email Anda : <input type="text" name="email" size="25">

Komentar Anda : <textarea input type="text" name="komentar" size="25" rows="5" cols="35"></textarea>

</form>

</body>

</html>

Isi tampilan form input komentar :

Isi php untuk tampilan diatas :

<html>

<head>

<title>Latihan</title>

</head>

<body>

<?php

$nama=$_POST['nama'];

$email=$_POST['email'];

$komentar=$_POST['komentar'];

<b><h1>Data Komentar Anda</h1></b>

<hr/>

Nama Anda : <?php echo $nama;?><br>

Email Anda : <?php echo $email;?><br>

Komentar Anda :<?php echo $komentar;?><br>

<a href="forminputkomentar.php">INPUT DATA LAGI</a>

</body>

</html>

Rabu, 15 April 2020

Tugas 06 : Pembuatan dan Pemanggilan Form Modul Web Programming 1

Pengolahan Data Dari Form Form di HTML dikenal dengan adanya tag <FORM> dan ditutup dengan tag </FORM>. Di dalam tag pembuka <FORM> diikuti dengan atribut action dan method. Action menjelaskan ke halaman yang digunakan untuk memproses input, sementara method digunakan untuk mengatur cara mem-parsing konten Web menerima input dari user atau pengunjung menggunakan metode GET dan POST. GET akan mengirimkan data bersama dengan URL, sedangkan POST akan mengirimkannya secara terpisah. User mengirimkan data input dengan mengisi teks atau pilihan pada attibut form html.

Proses Form dengan metode POST dengan nama file formregistrasi.php

<html>

<head>

<title>Tugas 06</title>

</head>

<h1><b>Form Registrasi</b></h1>

Isikan Data Dibawah Ini:

Nama <input type="text" name="nama" size="25">

Alamat <textarea input type="text" name="alamat" size="25" rows="5" cols="35"></textarea>

Tempat Lahir <input type="text" name="tempat" size="25">

Tanggal Lahir <input type="text" name="tanggal" size="25">

</font></pre>

Jenis Kelamin

<input type="radio" name="jenis" value="Laki-Laki">Laki-Laki

<input type="radio" name="jenis" value="Perempuan">Perempuan

<p>

Pendidikan <select name="Pendidikan">

<option value="SMA/SMK">SMA/SMK

<option value="D3">D3

<option value="S1">S1

</select>

<p>

</form>

</body>

</html>

Hasilnya:

File untuk memproses variable yang diberikan oleh file formregistrasi.php diberi nama file dengan isiform.php

<html>

<head>

<title>Tugas 06</title>

</head>

<body>

<?php

$nama=$_POST['nama'];

$alamat=$_POST['alamat'];

$tempat=$_POST['tempat'];

$tanggal=$_POST['tanggal'];

$jenis=$_POST['jenis'];

$Pendidikan=$_POST['Pendidikan'];

<b><h1>Data Registrasi</h1></b>

<tr><td>Alamat</td><td><?php echo $alamat;?></td></tr>

<tr><td>Tempat Lahir</td><td><?php echo $tempat;?></td></tr>

<tr><td>Tanggal Lahir</td><td><?php echo $tanggal;?></td></tr>

<tr><td>Jenis Kelamin</td><td><?php echo $jenis;?></td></tr>

<tr><td>Pendidikan</td><td><?php echo $Pendidikan;?></td></tr>

</table>

</body>

</html>

Hasilnya :

Sabtu, 11 April 2020

SLIDE Tugas 05 : Penggunaan Operator Modul Web Programming 1

Buat script menggunakan bahasa pemrograman PHP untuk menghitung volume Kubus menggunakan fungsi operator aritmatika dan operator string dengan ketentuan sebagai berikut:

Panjang sisi kubus = 15cm

Hitung volume balok dengan rumus = sisi x sisi x sisi

Buat variable teks1 yang berisi = “Belajar Menghitung” dan teks2 yang berisi = “Volume Kubus”. Buat perintah untuk menggabungkan nilai dari variable teks1 dan teks2 menggunakan operator string.

Outputnya sebagai berikut :

Script php untuk tampilan di bawah ini :

<?php

$teks1="Belajar Menghitung Volume Kubus";

$teks2="Panjang Sisi Kubus";

$teks3="Volume Kubus";

$teks4="cm3";

$sisi="15";

$volume=$sisi*$sisi*$sisi;

echo "$teks1<br>";

echo "$teks2 = $sisi<br>";

echo "$teks3 = $volume $teks4<br>";

Jumat, 10 April 2020

Tugas 04 Modul Web Programming 1

Tipe Data Berbeda dengan bahasa pemrograman lain, variable di PHP lebih fleksibel. Kita tidak perlu mendefinisikan jenisnya ketika mendefinisikan pertama kali. Ada 6 Tipe data dasar yang dapat diakomodasi di PHP, seperti terlihat di tabel.

Jenis-jenis type data :

Tipe	Contoh	Penjelasan
Integer	134	Semua angka bukan pecahan
Double	5.1234	Nilai Pecahan
String	“Asep”	Kumpulan karakter
Boolean	False	Salah satu nilai true atau false
Object		Sebuah instance dari class
Array		Larik

Untuk mengetahui tipe data sebuah variable, kita bisa menggunakan perintah gettype, misalnya :

Print gettype ($nama_variabel);

Anda juga bisa mengubah jenis variable tertentu dengan perintah :

(jenis_variabel) $nama_variabel;

Misalnya untuk mengubah variable menjadi string, kita dapat menggunakan perintah:

$var_string = (string) $angka;

Tugas 04 :

Script php untuk tampilan di bawah ini :

<html>

<head>

<title>Biodata</title>

</head>

<?php

$nama="Widi Mawardi";

$alamat="Jl Ibu Ganirah No 252 D Cimahi-Bandung";

$ttl="Jakarta, 20 Oktober 1990";

$no_telp="0876778778";

echo "Nama Saya : $nama<br>";

echo "Alamat : $alamat<br>";

echo "Ttl : $ttl<br>";

echo "No Telepon : $no_telp<br>";

</body>

</html>

Minggu, 05 April 2020

Pertemuan: 3&4 Tanggal: 30 Maret 2020 Mata Kuliah: Web Programming I

Dikerjakan oleh:

1. Hari Rahmadi (12192864)

2. Tri Astrhiono (12191697)

3. Mida Maridha (12191421)

4. Nadya Putri (12191473)

5. Nurul Maulida (12192564)

Tugas Diskusi

Berikut pertanyaan dan Jawaban

A. Apa perbedaan/kelebihan dr bahasa html dan php yang kalian ketahui ?

Jawab : (dikerjakan oleh Nurul Maulida)

1. HTML : Bahasa markup sedangkan

    PHP    : Bahasa scripting.

2. Output PHP : Menggunakan kode HTML yang kemudian ditafsirkan oleh browser.

3. HTML : Bersifat statis selalu sama setiap kali dibuka.

    PHP    : Bersifat dinamis dan hasilnya tidak selalu sama.

4.HTML lebih mudah karena dapat men-tolerir kesalahan dalam penulisan kode, sedangkan PHP tidak.

5. HTML : Dimanfaatkan untuk dinamisasi web.

    PHP    : Untuk berinteraksi dengan server.

B. Ketikan struktur dasar pembuatan codingan HTmL dan jelaskan !

Jawab : (dikerjakan oleh Nurul Maulida)

- Elemen

Elemen terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup.

- Tag

Tag merupakan teks khusus berupa dua karakter "<" dan ">", contoh <body> tag dengan nama body. Tag ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag penutup, ditambahkan karakter "/" setelah karakter "<".

Tag-tag dasar HTML :

Ø <html> </html> : Untuk menandai awal dan akhir dari suatu file HTML.

Ø <title> </title> : Ditampilkan oleh browser bagian title dan merupakan title dari jendela browser.

Ø <head> </head> : Berisi keterangan informasi, seperti title dan jenis dokumen.

Ø <body> </body> : Menandai awal dan akhir dari badan dokumen HTML. Memiliki sejumlah attribut yang dapat ditentukan.

- Atribut

Atribut terdapat di dalam script sebuah elemen dan memberikan informasi tambahan tentang elemen. Atribut dapat ditulis dalam pasangan nama/nilai. Nilai dari atribut harus selalu tertutup dalam tanda kutip. Tanda kutip ganda yang paling umum, Misalnya: name = 'John "shotgun" Nelson'.

C. sebutkan dan jelaskan bahasa pemograman berbasis web yang anda ketahui ? Sebutkan kelemahan dan kelebihannya ? berikan contoh!

Jawab : (dikerjakan oleh Nurul Maulida)

-HTML (HyperText Markup Language) adalah bahasa markup standar digunakan untuk membuat halaman web dan menampilkan berbagai informasi di dalamnya.

Kelebihan : Dapat dibuat mengunakan berbagai platform, artinya bisa dibuat mengunakan berbagai jenis komputer dengan sistem operasi yang berbeda-beda.

Kelemahan : Tidak bisa berdiri sendiri sebagai bahasa pemrograman web.

Contoh dari Script HTML :

<html>

<head>

<title> Script HTML </title>

</head>

<body>

<p>Ini adalah HTML</p>

</body>

</html>

-PHP (Hypertext Preprocessor) adalah adalah bahasa skrip yang dapat ditanamkan atau disisipkan ke dalam HTML.

Kelebihan : Mendukung beberapa paket Database seperti MySQL, Oracle, PostgrSQL.

Kelemahan : Tidak mempunyai sistem pemrograman berorientasi objek.

Contoh dari Script PHP :

<html>

<body>

<form action="upload_file.php" method="post" enctype="multipart/form-data">

<label for="file"> filename:</label>

<input type="file" name="file" id="file" />

<br>

<input type="submit" name="submit" value="submit"/>

</form>

</body>

</html>

-Javascript adalah bahasa skrip yang dapat bekerja di sebagian besar browser.

Kelebihan : Tidak menggunakan resource memory yang besar.

Kelemahan : Tidak dapat digunakan untuk untuk mengembangkan aplikasi stand alone.

Contoh dari Script Javascript :

<HTML>

<BODY><H3>Latihan Objek Document</H3>

<hr>Dengan perintah ini maka teks dalam dokumen ini akan berwarna putih<BR>

<SCRIPT LANGUAGE="Javascript">nama="Mikaela";

document.bgColor="blue";document.fgColor="white";document.title="Belajar buat Javascript";document.linkColor="red";document.vlinkColor="green";document.alinkColor="white";namakulink=nama.link('ir.html');document.writeln('Warna Link = '+

namakulink +'<BR>');</SCRIPT></BODY>

</HTML>

D. berikan contoh bentuk coding untuk komentar dalam php ?

Jawab : (dikerjakan oleh Nadya Putri)

Hasil:

E. Jenis – jenis operator:

1. operator aritmatika

2. operator perbandingan

3. operator logika

4. operator string

Sebutkan, berikan contoh coding dan jelaskan, dari jenis jenis operator diatas!

Jawab:

1. Operator Aritmatika adalah (dikerjakan oleh Mida Maridha)

Operator aritmatika merupakan simbol-simbol yang sering kita temui dalam kegiatan sehari-hari. Simbol-simbol ini biasanya ada pada matematika yang berupa seperti penambahan, pengurangan, perkalian dan juga yang lainnya

Operator pada atritmatika

+ untuk penjumlahan contoh $a + $b artinya $a ditambah $b

- untuk pengurangan contoh $a - $b artinya $a dikurang $b

* untuk perkalian contoh $a * $b artinya $a dikali $b

/ untuk pembagian contoh $a / $b artinya $a dibagi $b

% untuk modulus contoh $a % $b artinya sisa $a dibagi $b

** untuk exponensial $a ** $b artinya pembesaran $a dikuatkan $b

Contoh Penggunaannya sebagai berikut :

Hasil:

2. Operator Perbandingan (dikerjakan oleh Mida Maridha)

Operator perbandingan adalah simbol-simbol yang digunakan untuk membandingkan dua atau lebih objek. Objek tersebut biasanya berupa variabel atau bisa juga berupa angka.

Simbol operator perbandingan pada php yang paling sering digunakan

== sama dengan (bukan pemberi nilai : akan bernilai true atau 1 jika dua kondisi yang dibandingakn memiliki nilai yang sama, selain itu bernilai false atau 0

!= tidak sama dengan : akan bernilai true atau 1 hanya jika kedua kondisi yang dibandingkan memiliki nilai yang tidak sama (selain itu bernilai false atau 0)
> lebih dari : akan bernilai true atau 1 hanya jika nilai yang disebelah kiri lebih besar dari sebelah kanan (selain ini akan bernilai false atau 0)
< kurang dari : akan bernilai true atau 1 hanya jika nilai yang disebelah kiri lebih kecil dari yang sebelah kanan

>= lebih dari sama dengan : akan bernilai true atau 1 hanya jika nilai yang disebelah kiri lebih besar atau sama dengan dari sebelah kanan (selain ini akan bernilai false atau 0)

<= kurang dari samadengan : akan bernilai true atau 1 hanya jika nilai disebelah kiri lebih kecil atau sama dengan dari sebelah kanan (selain ini akan bernilai false atau 0)

Contoh :

Hasil:

3. Operator Logika (dikerjakan oleh Mida Maridha)

Operator Logika adalah operator yang digunakan untuk membandingkan 2 kondisi logika, yaitu logika benar (TRUE) dan logika salah (FALSE). Operator logika sering digunakan untuk kodisi IF, atau untuk keluar dari proses perulangan (looping).

&& : simbol dari operator AND. Hasilnya akan bernilai 1 jika kedua kondisi memiliki nilai 1, selain itu hasilnya akan bernilai 0

|| : simbol dari operator OR. Hasilnya akan bernilai 0 jika kedua kondisi memiliki nilai 0 : selain itu hasilnya akan bernila 1

Xor, operator Xor akan menghasilkan nilai 1 jika kedua kondisi sama, dan 0 jika keduanya tidak sama

! : simbol dari operator NOT, akan menghasilkan nilai yang berlawanan. Jika 1 akan menjadi 0, sedangkan 0 akan menjadi 1

Contoh penggunaannya sebagai berikut :

Hasil:

4. Operator string (dikerjakan oleh Nadya putri) Dalam PHP juga tersedia operator string, yaitu digunakan untuk operasi penggabungan teks. Adapun symbol yang digunakan yaitu berupa karakter titik (.)
contoh:

Hasil:

F. Apa yang dimaksuk operator Aritmatika? Dan pada saat membuat program apakah kita menggunakan operator tersebut?

Jawab : (dikerjakan oleh Hari Rahmadi)
Operator Aritmatika adalah operator matimatik dalam pemrograman yang digunakan untuk menyelesaikan operasi matematika dalam pemrograman. Terdapat beberapa jenis operator aritmatika, yaitu: Penjumlahan, Pengurangan, Perkalian, Pembagian dan modulus.Pada saat pembuatan program kita menggunakan operator aritmatika

G. Pada saat apa sebuah program menggunakan operator perbandingan? Jelaskan cara menggunakan operator perbandingan? Berikan contoh coding dan jelaskan!

Jawab: (dikerjakan oleh Nadya putri)

Operator perbandingan digunakan untuk menghasilkan 2 nilai yang hasil akhirnya adalah nilai Boolean true dan false. Operator ini sangat berguna dalam pemrograman karena bisa menentukan arah pemrograman.

== yg artinya sama dengan

!= yg artinya tidak sama dengan

< lebih kecil daripada

>lebih besar daripada

<= lebih kecil atau sama dengan

=>lebih besar atau sama dengan

H. Contoh coding: (dikerjakan oleh Nadya putri)

Hasil:

I. Cara biar website statis tanpa php

Jawab: (dikerjakan oleh Tri Astrhiono)

Static website bias tanpa php karena web statis adalah sebuah kumpulan item seperti teks, gambar, dan elemen multimedia lainnya yg terdiri dari konten marked-up yg dibuat dgn menggunakan Hyper Text Markup Languange atau lebih dikenal dengan nama HTML yg disimpan di server website tersebut. Jadi web statis menggunakan HTML.

Sekian jawaban dari kelompok kami, apabila ada kesalahan kata ataupun kepuasan dalam menjawab mohon dimaafkan.

Kamis, 26 Maret 2020

Pertemuan: 1&2 Tanggal: 23 Maret 2020 Mata Kuliah: Web Programming I Jenis tugas: Tugas Diskusi

Tugas dikerjakan oleh:

1. Hari Rahmadi (12192854)

2. Tri Astrhiono (12191697)

3. Mida Maridha (12191421)

4. Nadya Putri (12191473)

5. Nurul (12192564)

Berikut tugas yg kami kerjakan:

Pertanyaan:
No. 1) Struktur Navigasi adalah? Gunanya untuk?

Jawaban (dijawab oleh Mida Maridha) :

Struktur Navigasi adalah struktur atau alur informasi dari suatu program, yang berguna pada sebuah website untuk mempermudah mengakses halaman-halaman yang tersedia pada website. Struktur navigasi juga bisa diartikan seperti jenjang atau tingkatan dari menu yang ada di sebuah website. Dengan menggunakan struktur navigasi yang tepat maka sebuah program memiliki suatu arahan informasi yang jelas

Pertanyaan :
No. 2) Kapan harus membuat Struktur Navigasi? Kenapa kita harus menggunakan Struktur Navigasi itu?

Jawaban ( dijawab oleh Nadya Putri) :

struktur navigasi dibuat sebelum program karena akan menentukan mana form atau menu yg akan menjadi awal dan akhir.

struktur navigasi digunakan untuk membuat tingkatan dr menu yg ada di web // struktur navigasi campuran lebih sering digunakan karena dapat memberikan keinteraksian yg lebih tinggi

Pertanyaan:
No. 3) Sebutkan Struktur Navigasi yg ada dan berikan contohnya!

Jawaban (dijawab oleh Nurul) :
Struktur navigasi dikelompokkan menjadi 4 struktur, yaitu linier, non linier, hirarki dan campuran.

Linier/satu alur ialah struktur yang hanya menampilkan satu demi satu rangkaian cerita tampilan layar secara berurutan, tidak ada percabangan. Biasanya digunakan untuk membuat halaman web presentasi.

Struktur non linier/tidak berurut ialah struktur penjejakan linier membuat penjejakan bercabangan. Percabangan yang dibuat pada struktur Non Liner ini berbeda dengan percabangan struktur Hirarki, karena setiap tampilan mempunyai kedudukan yang sama tidak ada Index dan Slave Page.

Struktur navigasi hirarki/struktur bercabang
Ialah struktur yang mengandalkan percabangan untuk menampilkan data berdasarkan kriteria tertentu. Tampilan pada menu pertama Master Page (halaman utama pertama), halaman utama mempunyai halaman percabangan yang disebut Slave Page (halaman pendukung).

Struktur navigasi campuran ialah gabungan dari ketiga struktur linier, non-linier dan hirarki. Struktur navigasi disebut dengan struktur navigasi bebas, digunakan dalam pembuatan multimedia karena struktur ini dapat dalam pembuatan multimedia sehingga dapat memberikan ke-interaksian yang lebih tinggi.

Pertanyaan :
No. 4) Apa itu Web Server? Berikan contoh yg kamu tau dan kenapa memilih Web Server itu?

Jawaban (dijawab oleh Tri Astriono) :

Web Server adalah sebuah software yang berfungsi untuk menerima dan melayani permintaan yang dikirimkan user melalui browser kemudian ditampilkan kepada user sesuai dengan permintaan yang dikirimkan ke server.

Nah untuk alurnya sendiri yaitu User melakukan permintaan melalui browser terhadap server (HTTP Request), Kemudian Server Menerima request dan dan memprosesnya menjadi halaman situs web (HTTP Response).

Contohnya Apache, Nginx, Lighttpd, IIS
Karena
1. Sangat fleksibel, konfigurasi dan pengaturan apache sangat mudah dan simple
2. Proses instalasinyapun sangat mudah ketika masuk kedalam freeware
3. Mampu bekerja dalam berbagai sistem operasi (open source) dibanding web server lainnya
4. Tidak terbatas dalam komunitas sehingga sangat luas.

Pertanyaan :
No. 5) Langkah apa saja yg harus kita lakukan supaya coding yg kita buat dari notepad bisa berjalan di browser?

Jawaban (dijawab oleh Hari) :

1. buat coding dinotepad dan save dgn format " .html "
2. pastikan memilih 'all files' pada 'save as type'
3. buka aplikasi Xampp Control Panel jalankan module Apache
4. buka Mozila Firefox lalu ketik " localhost/nama file coding yg sudah kita buat"
5. file tsb akan muncul
6. klik file tsb maka hasilnya sudah bisa dilihat

Berikut tugas lainnya:

Tugas 01 :
Buatlah Struktur Navigasi dari sebuah halaman website.

Tugas 02 :

Buatlah script html sehingga menghasilkan tampilan berikut ini :

<html>
<head>
<title>Tugas 02</title>
</head>
<body bgcolor="#FFOOFF" text="000000">
<p>Perhatikan bahwa halaman ini berwarna magenta</p>
<h1>Ini adalah heading 1</h1>
<h2>Ini adalah heading 2</h2>
<h3>Ini adalah heading 3</h3/>
<h4>Ini adalah heading 4</h4>
<h5>Ini adalah heading 5</h5>
<h6>Ini adalah heading 6</h6>
<p>Gunakan tag heading hanya untuk membuat heading saja. Jangan menggunakan tag tersebut hanya untuk membuat tampilan huruf tebal. Gunakan tag lain untuk keperluan itu</p>
<center><h1>Ini adalah heading 1</h1></center>
<p>Heading diatas telah diposisikan untuk berada di tengah halaman ini.</p>
</body>

</html>

Tugas 03:
Buat script HTML untuk bentuk tampilan di bawah ini :

<html>
<head>
<title>tugas modul ke tiga</title>
</head>
<body background = "rem.png">
<table width="520" border="7" align"center" cellpading="1" cellpascing="1" bordercolor="#ffffff"bgcolor="violet">
     <th colspan="3"bgcolor="BISQUE">
     <p>DAFTAR PRODUK</p>
     </th>
     </tr>

<tr>
<td bgcolor="YELLOW" width="120" rowspan="100" height="100"><img src="pikachu.jpg"width="120"height="100"></td>
<td bgcolor="LIGHTGREEN" height="40">nama<br>Produk <bgcolor="YELLOW">
</td>
<td>CANON EOS M10 Kit EF-M 15-45mm</td>
</tr>
<tr>
<td bgcolor="LIGHTGREEN"height="25">Harga</td>
<td>Rp 4.899.000</td>
</tr>

<tr>
<td bgcolor="LIGHTGREEN">Fitur<br>Produk</td>
<td>
        <li>Kamera mirrorless</li>
        <li>Efektifitas Piksel:18MP</li>
        <li>Tipe Sensor : CMOS DIGIC 6</li>
        <li>Layar : 3.0 Inch</li>
                       <li>Memiliki Lampu flash dengan jarak jangkauan hingga 5 meter</li>
</td>
</tr>

</table>
</body>
</html>

Sekian jawaban dari kelompok kami, bila ada jawaban yg kurang memuaskan mohon dimaafkan.

Web Programming I

Cari Blog Ini

Sabtu, 25 April 2020

Latihan Slide pertemuan ke-5 Form Input Komentar Web Programming 1

Rabu, 15 April 2020

Tugas 06 : Pembuatan dan Pemanggilan Form Modul Web Programming 1

Sabtu, 11 April 2020

SLIDE Tugas 05 : Penggunaan Operator Modul Web Programming 1

Jumat, 10 April 2020

Tugas 04 Modul Web Programming 1

Minggu, 05 April 2020

Pertemuan: 3&4 Tanggal: 30 Maret 2020 Mata Kuliah: Web Programming I

Kamis, 26 Maret 2020

Pertemuan: 1&2 Tanggal: 23 Maret 2020 Mata Kuliah: Web Programming I Jenis tugas: Tugas Diskusi

Latihan Slide pertemuan ke-5 Form Input Komentar Web Programming 1

Web Programming I

Laporkan Penyalahgunaan