ALIF AKBAR IRDHOBILLA UMSIDA

pada tanggal

 Rangkuman Praktikum PWEB 1 - 6

BAB 1 HTML (Hypertext Markup Language)

  1. Dasar Teori

HTML adalah, (Hypertext Markup Language) sebuah bahasa standar yang digunakan oleh browser internet untuk membuat halaman dan dokumen pada sebuah Web yang kemudian dapat diakses dan dibaca layaknya sebuah artikel. HTML juga dapat digunakan sebagai link-link antara file-file dalam situs atau dalam computer dengan menggunakan localhost, atau link yang menghubungkan antar situs dalam dunia internet.

Standar minimum elemen HTML adalah:

  • Document Type Declaration (DTD)
  • Head
  • Body

Contoh penggunaan HTML

<html>
  <head>
    <title>Belajar HTML</title>
  </head>
  <body>
    Belajar HTML Pada Praktikum Pemrograman Web
  </body>
</html>


 

 TextBox tanpa validasi

<!DOCTYPE html>
<html>
<head>
<title>textbox</title>
</head>
<body>
<h2>Text Box Tanpa Validasi</h2>
<p>
<form method="post" action="">
<input name="textBox" type="text" id="textBox" size="30" />
<input name="btnSubmit" id="btnSubmit" type="submit" value="Submit"
/>
</form>
</p>
</body>
</html>

 BAB 2 CSS

  1. Dasar Teori

Cascading Style Sheet (CSS) merupakan aturan untuk mengendalikan beberapa komponen dalams ebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan bahasa pemrograman.

Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapat mengatur beberapa style, misalnya heading, subbab, bodytext, footer, images, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas (file).

Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML. CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks, warna table, ukuran border, warna border, warna hyperlink, warna mouse over, spasiantar paragraph, spasiantarteks, margin kiri, kanan, atas, bawah, dan parameter lainnya. CSS adalahbahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan adanya CSS memungkinkankitauntukmenampilkanhalaman yang samadengan format yang berbeda.

Inline Style
<html>
<head>
<title>Inline</title>
</head>
<body>
<h1 style="color:red;text-align:center;">Paragraf Pertama</h1>
<p style="color:white;background:red;font-family:arial;">
Penyakit asma telah dikenal sejak berabad-abad lalu dan sampai sekarang masih menjadi masalah kesehatan di masyarakat.
Angka kejadian pada bayi dan anak lebih tinggi dibandingkan pada orang dewasa. Meskipun demikian,
serangan asma untuk pertama kali tidak terlalu terjadi pada masa anak-anak
</p>
<h1 style="color:red;text-align:center;">Paragraf Kedua</h1>
<p style="color:yellow;background:orange;font-family:verdana;">
Yang lebih penting bagi penderita sendiri dan keluarga adalah pengetahuan mendalam mengenai penyakit asma,
termasuk cara-cara pencegahan serangan asma,
tindakan pertama untuk mengatasi serangan dan menentukan saat yang tepat untuk meminta pertolongan dokter.
</p>
</body>
</html>

 

Background

<html>
<head>
<title>Background</title>
<style type="text/css">
body {
background-color: #FFCC66;
background-image: url("umsida.png");
background-repeat:repeat;
}
h1 {
color: #33CC00;
text-align: center;
}
</style>
</head>
<body>
<h1>Hi....welcome to my simple web page</h1>
</body>
</html>

BAB 3 JAVASCRIPT

Javascript adalah bahasa scrip yang ditempel pada kode HTML dan diproses disisi klient. Dengan adanya bahasa ini, kemampuan HTML menjadi semakin luas. Contoh: untuk menvalidasi masukan pada formulir sebelum formulir dikirim ke server.

Javascript bukan bahasa java dan merupakan dua bahasa yang berbeda. Javascript diinterpretasikan oleh klient, sedang java dikompilasi oleh program dan hasil kompilasinya dijalankan oleh clien.

Pemakaian Alert Sebagai Property Windows

<HTML>
  <head>
  <title>Alert Box</title>
  </head>
  <body>
  <script language="JavaScript">
  window.alert("Ini merupakan pesan untuk anda");
  </script>
  </body>
  </HTML>

Pemakaian Metode Dalam Objek

<HTML>
  <head>
  <title>Scrip JavaScript</title>
  </head>
  <body>
  Percobaan memakai JavaScript :<br>
  <script language="JavaScript">
  document.write("Selamat Mencoba JavaScript<BR>");
  document.write("Semoga Sukses!");
  </script>
  </body>
  </HTML>

BAB 4 PHP

  1. Dasar Teori

PHP (preprocessor Hypertext) adalah bahasa scripting yang menyatu dengan HTML dan dijalankan pada server side. Artinya semua sintaks yang diberikan akan sepenuhnya dijalankan pada server sedangkan yang dikirimkan ke browser hanya hasilnya saja berupa HTML. Untuk membedakan perintah HTML dan PHP digunakan tanda <? … ?>atau<?php … ?>

PHP dapat diaplikasikan dengan berbagai macam database, seperti MySQL, PostgreSQL,, Oracle, dan lannya.

<html><head><title> Variabel </title></head>

<body><?php

$nilai_1 = 10; $nilai_2 = 3; $nilai_3 = 2 * $nilai_1 + 8 * $nilai_2;

echo "nilai= " .$nilai_3;

echo "<br>";

$jumlah = $nilai_1 + $nilai_2;

echo "hasil dari $nilai_1 + $nilai_2 adalah : $jumlah";

echo "<br><br>";

echo "\"nama : alfan\" <br>";

echo "NIM 06.10802.00149";?>

</body></html>

<html><head><title> Konversi Tipe</title></head>

<body>

                <?php

                $a = 300.4;

                echo $a;

                echo "<br>";

                echo "tipe Double : ", doubleval($a), "<br>";

                echo "tipe Integer : ", intval($a), "<br>";

                echo "tipe string : ", strval($a);

                echo "<br>";

?></body></html>



BAB 5 KONEKTIVITAS PHP dengan MYSQL

  1. Dasar Teori

mysql_conner

digunakan untuk melakukan uji dan koneksi kepada server database MySQL.

$conn = mysql_connect (“host”,”username”,”password”);

$conn  : adalah nama variable penampung status hasil koneksi kepada database.
Host    : adalah nama host atau alamat server database MySQL.
Username        : adalah nama user yang telah diberi hak untuk dapat mengakses server database
Password         : adalah kata sandi untuk username untuk dapat masuk kedalam database.

1.    Menguji interkoneksi PHP dengan MySQL

<html><head><title>Koneksi database MySQL</title></head>
<body>
<h1>Demo koneksi database MySQL</h1>
<?php
$conn=mysqli_connect ('localhost','root','');
if ($conn) {
echo "OK";} else {
echo"Server not connected";}?>
</body></html>

1.    Melihat perbedaan antara mysql_fetch_array(), mysql_fetch_assoc(), mysql_fetch_row().
a.    Buatlah table liga berikut ini, dengan 3 field :kode, Negara, champion.
Create table liga (
                Kode char(3) not null,
                Negara char(15),
Champion Int);

a.    Isilah table dengan data

INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)
VALUES ('jer','Jerman','4');
INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)
VALUES ('spa','Spanyol','4');
INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)
VALUES ('ing','Inggris','4');
INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)
VALUES ('bel','Belanda','4');



b.    Isilah table dengan data

    INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)VALUES ('jer','Jerman','4');
INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)VALUES ('spa','Spanyol','4');
INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)VALUES ('ing','Inggris','4');
INSERT INTO  `latihan`.`liga` (`Kode`,`Negara`,`Champion`)VALUES ('bel','Belanda','4');

c.    Akses database menggunakan mysql_fetch_array()

<html><head><title>Koneksi Database MyQL</title></head>

<body>

<h1>Koneksi Database dengan mysql_fetch_array</h1>
<?php
$koneksi=mysqli_connect("localhost","root","","latihan") or die ("koneksi gagal");
$query=("SELECT * FROM liga");
$hasil=mysqli_query($koneksi,$query);
while ($row=mysqli_fetch_array($hasil)){
                echo "liga ".$row[1];//array asosiatif
                echo " mempunyai ".$row[2];//array numeris
                echo " wakil di liga champion <br>";}
?>
</body></html>



d.    Akses database menggunakan mysql_fetch_assoc()

<html><head><title>Koneksi Database MySQL</title></head>
<body>
<h1>Demo koneksi database mysql_fetch_assoc</h1>
<?php
$koneksi=mysqli_connect("localhost","root","","latihan") or die ("koneksi gagal");
$query=("SELECT * FROM liga");
$hasil=mysqli_query($koneksi,$query);
while ($row=mysqli_fetch_assoc($hasil)){
                echo "liga ".$row['Negara'];//array asosiatif
                echo " mempunyai ".$row['Champion'];//array numeris
                echo " wakil di liga champion <br>";}
?>


BAB 6 DESAIN WEB MOBILE Dengan JQuery Mobile

  • Dasar Teori

jQuery Mobile adalah framework berbasis jQuery yang memudahkan kita untuk membuat web app untuk mobile. Selain jQuery mobile sebenarnya banyak frame work lain yang dapat digunakan seperti Sencha, jTouch, DHTMLX Touch, Jo dan lainnya.

Basic Template

<html><head>
<title>Alif Akbar Irdhobilla 202</title>
<link rel="stylesheet" href="jquery.mobile-1.3.2.min.css" />
<script src="jquery-1.9.1.min.js"></script>
<script src="jquery.mobile-1.3.2.min.js"></script>
</head><body>
<div data-role="page"><div data-role="header" data-theme="c">
<h1>Praktikum Web</h1></div><!--header--><div data-role="content" data-theme ="c">
<p>Membuat Aplikasi Mobile Web</p></div>
 <div data-role="footer" data-theme ="c">
<h4>&copy Umsida</h4></div></div>
</body></html>


<html><head>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>  

<title>202/Irdho</title></head>

<body><div data-role="page">

<div data-role="header"><h1>Praktikum Web</h1></div>

<div data-role="content">

<a href="#" data-role="button" class="ui-button ui-widget ui-corner-all" >Cancel</a>

<a href="#" data-role="button" data-theme="b">Save</a>

<a href="#" data-role="button" data-inline="true">Cancel</a>

<a href="#" data-role="button" data-inline="true" data-theme="e">Save</a></div><!-- /content -->

<div data-role="footer"><h1>&copy UMSIDA</h1>

</div></div></body></html>



Jangan Lupa Kunjungi

 Umsida & Fakultas Umsida





 

Komentar

Posting Komentar