Pemrograman Web 3 Dasar Pemrograman Web dengan Adam Hendra Brata
- Definisi Dasar Pemrograman Website Statis vs Website Definisi Dasar Pemrograman Variabel Aliran Kontrol Program Percabangan Perulangan Fungsi Form
Website Statis - Definisi HTML + CSS = Well Designed Web Web yang dibangun menggunakan HTML dan CSS memiliki konsep desain yang apik Namun belum mempunyai fitur fitur yang menjadikan sebuah web dikatakan hidup Penggunaan HTML + CSS dalam pembangunan sebuah website masih memiliki banyak keterbatasan
- Definisi Website Statis Diskusi Misalkan, kita memiliki sebuah website yang dibangun dari HTML dan CSS Dalam website tersebut kita memiliki 100 halaman web Kemudian apabila kita ingin merubah isi informasi yang ada dalam 100 halaman web tersebut, apa yang akan kita lakukan? Merubah isi halaman tersebut satu-satu sampai 100 halaman web tersebut dirubah semua?
Website - Definisi Untuk membangun website yang utuh dan hidup, diperlukan adanya pemrograman yang lebih lanjut Pemrograman ini memungkinkan sebuah webiste menjadi lebih dinamis dalam pengelolaan informasi, mudah dalam penggunaan dan menjadikan sebuah website menjadi lebih hidup Pemrograman ini umumnya dilakukan pada sisi server atau sering disebut server side scripting, ASP dan JSP menjadi bahasa yang populer untuk kategori ini
- Definisi adalah kependekan dari Hypertext Preprocessor diciptakan oleh Rasmus Lerdorf pada tahun 1994 Fungsi utama adalah digunakan untuk membuat situs web yang dinamis Bisa memiliki isi yang berbeda tergantung konteks (tidak statis) Bisa melakukan antarmuka dengan servis lain, misalnya: database, email, xml dll Bisa meng-autentifikasi user Bisa memproses informasi dari form
- Definisi merupakan bahasa pemrograman berbasis web yang memiliki kemampuan untuk memproses dan mengolah data secara dinamis dapat dikatakan sebagai sebuah server-side embedded script language, artinya semua sintaks dan perintah program yg ditulis akan sepenuhnya dijalankan oleh server, tetapi dapat disertakan pada halaman HTML biasa Pada umumnya semua aplikasi yang dibangun menggunakan akan memberikan hasil pada web browser, tetapi prosesnya secara keseluruhan dijalankan pada server
Pemrograman - Definisi merupakan bahasa pemrograman yang mirip dengan bahasa C / C++, Java dan varian bahasa turunan C lainnya diciptakan untuk memberikan sebuah website fitur dan fungsi yang menjadikannya sebuah program komputer yang dinamis dan utuh karena disertai dengan logika dan algoritma pemrograman Sebagai bahasa pemrograman yang sifatnya server side scripting, dikompilasi dan dieksekusi dalam web server Apache
Pemrograman - XAMPP - Definisi XAMPP merupakan sebuah aplikasi web server yang terintegrasi Apache Cgi Bin MySQL FTP Mercury Mail (SMTP) MyAdmin perl Webalizer Dll https://www.apachefriends.org/index.ht ml
Pemrograman - Definisi Script disimpan sebagai plain text dalam format ASCII, yang memungkinkan script dapat ditulis di hampir semua text editor seperti : Notepad, Wordpad, adobe Dreamweaver dll Script adalah kode yang disertakan di sebuah halaman HTML & kode tersebut dijalankan oleh server yang akan dieksekusi sebelum dikirim ke browser
Pemrograman - Definisi Jika Browser meminta file HTML (halaman statis), maka : server hanya langsung mengirimkan file HTML tersebut. Browser Minta HTML via HTTP Web Server KODE HTML
Pemrograman Jika Browser meminta file, maka : Server membaca file, menjalankan kode-kode script yang ada didalamnya, kemudian mengirimkan hasilnya ke browser - Definisi Browser Minta via HTTP Tanggapan via HTTP Web Server Skrip Mesin KODE HTML
Pemrograman - Definisi Script ditulis dengan cara yang sama seperti pada bahasa pemrograman yang lain, yaitu ditandai dengan tanda pembuka dan penutup script karena berjalan bersama dengan HTML, maka menggunakan tag sebagai penanda
Pemrograman - Definisi Hello World <html> <head> <title> Test</title> </head> <body> <?php echo '<p>hello World</p>';?> </body> </html>
Pemrograman - Definisi Ada kalanya kita sebagai pemrogram, karena banyaknya kode program atau variabel dalam program, perlu menandai atau memberi komentar pada program Komentar pada program merupakan tulisan pada program yang tidak dieksekusi Pada, ada 3 macam cara penulisannya : /* komentar */ Sesuai untuk komentar dengan banyak baris // komentar # komentar
Variabel - Definisi Dalam, penulisan variabel diawali dengan karakter $, kemudian diikuti dengan huruf sebagai karakter pertama. Setelah itu, dapat dilajutkan dengan kombinasi huruf dan angka Variabel tidak boleh mengandung spasi maupun tanda baca di dalamnya, kecuali underscore ( _ ) Variabel pada bersifat case sensitif, yang berarti Anda harus memperhatikan penulisan huruf besar dan huruf kecil. Variabel $jumlah berbeda dengan $Jumlah
Variabel - Definisi Contoh penamaan variabel yang salah : $nama pemakai $3kota $us\er1 Contoh penamaan variabel yang benar : $nama_pemakai $kota_3 $user1 $kodehuruf
- Definisi Data type Boolean Integer Float String Array Object Resource NULL Variabel Tipe Data Description Scalar; either True or False Scalar; a whole number Scalar; a number which may have a decimal place Scalar; a series of characters Compound; an ordered map (contains names mapped to values) Compound; a type that may contain properties and methods Special; contains a reference to an external resource, such as a handler to an open file Special; may only contain NULL as a value, meaning the variable; explicitly does not contain any value
- Definisi Assignment = Arithmetic +, -, /, *, % Concatenation. Negation! Logic, &&, >, <, ==, >=, <=,!=, ===,!===, and, or Increment ++, -- Variabel Operator
Variabel Scope Variabel - Definisi Variabel Lokal Variabel yang digunakan di dalam 1 fungsi tertentu <?php function send_data() { $my_data = "Inside data"; echo $my_data; // echoes $my_data value } // throws an error messages echo $my_data;?>
Variabel Scope Variabel - Definisi Variabel Global Variabel yang dapat digunakan di semua fungsi atau di luar fungsi <?php?> $a = 1; $b = 2; function Sum() { global $a, $b; } Sum(); $b = $a + $b; // executing Sum() function echo $b; // will echo 3
Array Variabel Built-In Variable Description - Definisi $GLOBALS $_SERVER $_GET $_POST Has a reference to every variable that has global scope in a program. Many of the variables in it are also in other superglobal arrays Includes everything sent by server in the HTTP response, such as the name of the currently executing script, server name, version of HTTP, remote IP address, and so on. Although most Web server software produces the same server variables, not all do, and not all server variables necessarily have data in them Contains all the querystring variables that were attached to the URL, or produced as a result of using the GET method Contains all the submitted form variables and their data. You use variables from the $_POST or $_REQUEST arrays extensively in most of your programs. For example, to make use of a username or password (or any other data) submitted as part of a form, you'll use variables from the $_REQUEST array
Array Variabel Built-In Variable Description - Definisi $_COOKIE $_FILES $_ENV $_REQUEST Contains all cookies sent to the server by the browser. They are turned into variables you can read from this array, and you can write cookies to the user's browser using the setcookie() function. Cookies provide a means of identifying a user across page requests (or beyond, depending upon when the cookie expires) and are often used automatically in session handling Contains any items uploaded to the server when the POST method is used. It's different from the $_POST array because it specifically contains items uploaded (such as an uploaded image file), not the contents of submitted form fields Contains data about the environment the server and are operating in, such as the computer name, operating system, and system drive Contains the contents of the $_GET, $_POST, and $COOKIE arrays, all in one
Variabel Print Variabel - Definisi Mencetak nilai variabel <?php $x = 20; $y[] = 10; $z['name'] = "John Doe"; echo $x; // 20 echo "x=$x"; // x=20 echo 'x=$x'; // x=$x echo 'x='.$x; // x=20 echo $y; // Array echo $y[0]; // 10 echo "$y[0]"; // 10 echo '$y[0]'; // $y[0] echo "Name = ".$z['name'];// Name = John Doe echo "Name = $z[name]"; // Name = John Doe?>
Variabel Array - Definisi Array Dalam, Array bisa diciptakan dengan menggunakan konstruksi array Untuk menambahkan menggunakan kurung kotak tanpa isi index ( [] ) Tipe element tidak perlu di sebutkan, bisa berisi tipe macam-macam
Percabangan - Definisi Percabangan Dalam, untuk percabangan sama seperti di bahasa pemrograman C dan turunannya If If...Else If...Else If... Else Switch Case
Percabangan If Else - Definisi <?php $x = 1; if($x == 1) { // true statement } else { // false statement } if($x == 2) : // true statement else: // false statement endif;?>
Percabangan Switch Case - Definisi <?php $x = 1; switch($x) { case 0: echo $x; // do 0 statement break; case 1: echo $x; // do 1 statement break; case 2: echo $x; // do 2 statement case 3: echo $x; // do 3 statement break; default: echo $x; // do default statement break; } // if $x value is 2? What is going to happen??>
Perulangan - Definisi Perulangan Dalam, untuk perulangan jampir sama seperti di bahasa pemrograman C dan turunannya While For Do... While Foreach biasanya dipakai untuk array
Perulangan While - Definisi <?php $x = 10; while( $x > 0 ){ echo $x; $x--; }?> // will prints 10 to 1
Perulangan For - Definisi <?php for($x = 1; $x <= 10; $x++) { echo $x; }?> // will prints 1 to 10
Perulangan Do...While - Definisi <?php $x = 10; do { echo $x; } while ($x < 9);?> // will prints 10, why?
Perulangan Foreach - Definisi <?php $arr = array('name'=>'john', 'age'=>20); foreach ($arr as $key => $value) { }?> echo $key. '='. $value; // will prints: // name=john // age=20
Fungsi - Definisi Fungsi Sama seperti bahasa pemrograman lain, pada secara umum juga dikenal 2 jenis fungsi : System-defined Function User-defined Function
Fungsi - Definisi Fungsi System-defined Seperti bahasa pemrograman yang lain, di juga terdapat banyak systemdefined function yang siap dipakai untuk mempermudah kita dalam membuat program Contoh Fungsi explode() untuk memecah string yang berupa kalimat menjadi sebuah array yang berisi kata per kata
Fungsi - Definisi Fungsi User-defined Dalam, untuk fungsi sama seperti di bahasa pemrograman C dan turunannya, hanya saja harus diawali dengan keyword function sebelum mendefinisikan nama fungsi <?php function sum($a) { // define function content here... $b = 2 $v = $a + $b + 1; // optionally put a return value return $v; } // calling the function $x = sum(4); echo $x; // will prints 7?>
Form - Definisi Dalam pemrograman web, kita selalu bertemu dengan model interaksi menggunakan form Pada HTML, form didesain untuk memberikan masukan pada web Namun tanpa adanya pemrograman yang mengatur pemrosesan data yang dikirimkan melalui form, maka website akan menjadi statis dan hambar dengan salah satu kelebihannya yang memiliki skenario form handling yang simpel, membuat pemrosesan data yang dikirimkan melalui form menjadi sangat mudah
Standar HTML untuk Form - Definisi Text Fields <input type="text" name="text1" /> Password Field <input type="password" name ="pass" /> Radio Buttons <input type="radio" name="radio1" value="men" /> <input type="radio" name="radio1" value="women" /> Checkboxes <input type="checkbox" name="vehicle" value="bike" /> Submit Button <input type="submit" value="submit" /> Hidden fields <input type="hidden" name="product_id" value="122" />
Form - Request - Definisi Dalam pengiriman data melalui form di, terdapat 2 metode dasar yang digunakan, yaitu : POST Sending request variables through the POST body. Variable name and it s value will not be shown on the URL GET Sending request variables through an URL as a Query String
Teknik Penanganan Form - Definisi Menangani form HTML menggunakan merupakan proses yang paling penting pada website dinamis Terdapat dua proses dasar pada penanganan form : Membuat HTML form itu sendiri Membuat script yang akan menerima dan memproses data yang dikirim dari form HTML form dibuat menggunakan tag form dan beberapa element untuk mengambil inputan.
Teknik Penanganan Form - Definisi Tag form terlihat seperti berikut : <form action="script.php" method="post" > script 1 script 2 script n </form>
- Definisi Teknik Penanganan Form Terdapat 3 bagian utama pada pembuatan form di web, yaitu : 1. Method Method dari sebuah form menentukan bagaimana data inputan form dikirim. Method ini ada dua macam, yaitu GET dan POST. Method ini menentukan bagaimana data inputan dikirim dan diproses oleh. 2. Action Method dari sebuah form menentukan bagaimana data inputan form dikirim. Method ini ada dua macam, yaitu GET dan POST. Method ini menentukan bagaimana data inputan dikirim dan diproses oleh.
Teknik Penanganan Form - Definisi 3. Submit Button Submit button merupakan sebuah tombol (pada umumnya) yang berfungsi sebagai trigger pengiriman data dari form inputan. Jika tombol ini ditekan, maka data form akan dikirimkan (diproses) di halaman yang sudah ditentukan pada atribut action.
Syntax Form - Definisi Sintax dasar form terlihat seperti berikut : Form <FORM ACTION="proses02.php" METHOD="POST NAME="input"> Nama Anda : <input type="text" name="nama"><br> <input type="submit" name="input" value="input"> </FORM> Sintax dasar untuk menangkap nilai dari form terlihat seperti berikut : <?php if (isset($_post['input'])) { $nama = $_POST['nama']; echo "Nama Anda : <b>$nama</b>"; }?>
Perhatian Perhatian Dikarenakan materi yang disampaikan pada presentasi kuliah ini hanya sebagai pengantar dasar saja, maka diharapkan membaca dan mencari referensi lain sebagai pengayaan pengetahuan tentang dasar dasar pemrograman web dengan Cari dan baca artikel / tutorial dari internet atau buku tentang desain web Lihat video-video tutorial dari Youtube atau website lain tentang tutorial dasar pemrograman web dengan Explorasi kembali materi tentang pemrograman web dengan
Terimakasih dan Semoga Bermanfaat ^^