PELATIHAN PHP ALUMNI DAN CALON ALUMNI INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA. By: Julianto Lemantara, S,Kom., M.Eng

PELATIHAN PHP ALUMNI DAN CALON ALUMNI INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA By: Julianto Lemantara, S,Kom., M.Eng

LATAR BELAKANG PELATIHAN Coba simak beberapa lowongan PHP programmer berikut:

KEMAMPUAN DASAR PEMROGRAMAN PHP

HTML CSS JavaScript  AJAX Server Side (PHP) Database (MySQL)

KEMAMPUAN PLUS2 PEMROGRAMAN PHP

JQUERY, EXT JS, BOOTSTRAP, DKK FRAMEWORK PHP (CI, YII, DKK)

TUJUAN PELATIHAN Peserta dapat membuat web yang terkoneksi database MySQL dengan HTML, CSS, Javascript, dan PHP  Peserta dapat mengetahui komponen-komponen Jquery dan Bootstrap agar tampilan lebih mbois  Peserta mengenal Framework PHP  CodeIgniter 

ANDA MEMASUKI KAWASAN HTML

HTML HTML: HyperText Markup Language  Bahasa yang digunakan untuk membuat atau mendeskripsikan halaman web  Bersifat cross-platform  Terdiri dari sekumpulan tag-tag 

CONTOH TAG HTML DASAR

HTML FORMS  



HTML forms  untuk mengirim data ke server HTML form dapat mengandung input elements seperti: text fields, checkboxes, radio-buttons, buttons, dll. HTML form juga dapat mengandung select lists, textarea, fieldset, legend, dan label.

SOAL 1 

Buat sebuah halaman login yang terdiri dari username dan password.

SOAL 2 

Buat sebuah halaman web yang berfungsi untuk menambah artikel

ANDA MEMASUKI KAWASAN CSS

CSS CSS: Cascading Style Sheet  Bahasa yang digunakan untuk menghias dan mengatur gaya tampilan/layout halaman web supaya lebih elegan dan menarik 

CONTOH CSS SEDERHANA

SOAL 3 

Buatlah desain halaman login sebagai berikut:

ANDA MEMASUKI KAWASAN JAVASCRIPT

JAVASCRIPT Bahasa pemrograman yang bersifat client-side  Membuat interaksi antara user dengan situs web lebih cepat  Untuk validasi form, animasi mempercantik halaman web, fitur chatting, efek-efek modern, dll. 

CONTOH JAVASCRIPT

ANDA MEMASUKI KAWASAN PHP DAN MYSQL

PHP Bahasa pemrograman bersifat server-side,  PHP dapat membuat, membuka, membaca, menulis, menghapus, dan menutup file di server  PHP dapat mengumpulkan form data  PHP dapat menambah, mengubah, dan menghapus data dalam database  PHP dapat membatasi akses user pada sebuah website  PHP dapat mengenkripsi data 

KELEBIHAN PHP Multi-platform  Kompatibel dengan banyak web server (Apache, Nginx, IIS, dll)  Kompatibel dengan banyak DBMS  Free license  Mudah dipelajari  Paling banyak dicari di Indonesia untuk dunia pemrograman web 

MYSQL MySQL adalah salah satu RDBMS yang populer. Pokoknya sangat mesra dan intim dengan PHP  MySQL bersifat open source, free license  MySQL bersifat multi-platform 

SOAL 4 

Buat form untuk maintenance data kategori artikel.

ANDA MEMASUKI KAWASAN AJAX PHP

AJAX AJAX: Asynchronous JavaScript and XML  Teknologi untuk membuat respon web lebih cepat  Keunggulan: update isi web tanpa harus reload keseluruhan halaman web, bisa mengirim data ke server dalam background process, dll. 

CONTOH KASUS AJAX 

Ketika user menekan tombol simpan, maka penyimpanan data akan dikirim dalam background process dan data terbaru dapat ditampilkan tanpa harus reload halaman web.

CONTOH AJAX

SOAL 5 

Buat form maintenance data kategori artikel dengan AJAX.

ANDA MEMASUKI KAWASAN JQUERY

JQUERY JQuery adalah library Javascript yang dibuat untuk memudahkan pembuatan website dengan HTML yang berjalan di sisi Client.  Dengan Jquery, kita tidak harus secara eksplisit menambahkan event ataupun properti pada website.  Jquery bersifat open source 

KELEBIHAN JQUERY Dalam Pemakaian menggunakan seleksi element DOM  website lebih dinamis dan interaktif.  JQuery bisa memanipulasi Class pada CSS dan Support CSS 3  Event  AJAX  Efek-efek dan animasi  Ekstensi dan Plug-ins  Kompatibilitas dengan hampir semua Browser modern 

CONTOH JQUERY

SOAL 6 

Buat form maintenance data kategori artikel dengan JQUERY.

PLUGIN JQUERY Autocomplete  Datetimepicker  Tabpage  Datatable  tampilan tabel dengan fitur search, pagination, dll  bxSlider, Carousel  silde show gambar  Colorbox  preview gambar  dll 

SOAL 7 

Buat halaman web untuk menambah artikel dimana kategori dengan autocomplete, tgl expired dengan datetimepicker, isi dengan editor WYSWYG, tabel dengan datatable.

BOOTSTRAP Bootstrap: framework untuk membangun desain web secara responsif. Artinya, tampilan web yang dibuat oleh bootstrap akan menyesuaikan ukuran layar dari browser yang kita gunakan baik di desktop, tablet ataupun mobile device.  Bootstrap menyediakan HTML, CSS dan Javascript siap pakai dan mudah untuk dikembangkan. 

CONTOH TEMPLATE BOOTSTRAP (BACK-END)  TEMPLATE 1  TEMPLATE 2 (FRONT-END)  TEMPLATE 1  TEMPLATE 2

SOAL 8 

Buat halaman web untuk menambah artikel dengan template bootstrap BACK-END yang diberikan

SOAL 9 

Buat halaman web untuk menampilkan artikel dengan template bootstrap FRONT-END yang diberikan

CI CI: CodeIgniter  CI: Framework OOP  konsep MVC  Framework yang banyak diminta perusahaan sebagai nilai tambah seorang programmer PHP 

TUTORIAL CI 

TUTORIAL CI dapat dilihat pada dokumen ini

SEKIAN TERIMA KASIH