Membuat Aplikasi Chating Sederhana dengan Jquery, Codeigniter dan Bootsrap
|
|
- Hadi Kusnadi
- 7 tahun lalu
- Tontonan:
Transkripsi
1
2 Membuat Aplikasi Chating Sederhana dengan Jquery, Codeigniter dan Bootsrap Oleh: Dadan Jumpa lagi dengan saya disini yang tetap tampil sederhana. Karena sebelumnya saya menuliskan cara membuat sistem keranjang dan pertemanan yang sederhana. Sekarang juga saya akan tetap sederhana dengan topik artikel ini. Sambil menunggu buka puasa di warung makan sederhana. Saya jadi menuliskan rangkaian k... Jumpa lagi dengan saya disini yang tetap tampil sederhana. Karena sebelumnya saya menuliskan cara membuat sistem keranjang dan pertemanan yang sederhana. Sekarang juga saya akan tetap sederhana dengan topik artikel ini. Sambil menunggu buka puasa di warung makan sederhana. Saya jadi menuliskan rangkaian kata sederhana ini, sudahlah... Oke para warga jagocoding sekalian. Kali saya akan menjelaskan cara pembuatan aplikasi chating sederhana dengan paduan tiga teknologi termuktahir saat ini. (gayanya muktahir). Iya dong, kenapa saya bilang muktahir karena kita akan menggunakan tiga framework termuktahir dalam pembuatan aplikasi website. Apa saja itu, berikut adalah kanidatnya. Alasan pakai Boostrap Ini jagonya framework untuk CSS. Dengan bootstrap kita bisa membuat desain web dengan mudah dan cepat. Tak hanya itu, layout web yang kita buat akan responsive menyesuaikan ukuran layar. Jadi aplikasi web kita bisa tampil mantap di layar mobile seperti Hp atau tablet. Kurang bagus apa lagi coba? Alasan pakai Jquery
3 Kalau yang ini jagonya framework untuk javascript. Dahulu kala kalau kita mau menulis kode javascript super ribet nan repot. Sekarang bersyukurlah sudah datang mukzizat dari atas dengan kedatangan jquery (weleh). Dengan framework ini kita bisa menulis kode jquery dengan lebih singkat dan simpel. Alasan Pakai Codeigniter Nah inilah favorit framework PHP abad ini. Sampai-sampai si empu PHP-nya (Rasmus Lerdorf) bilang ini framework paling tercepat di jagat raya. Framework ini juga begitu terkenal di toko buku. Sudah banyak panduan Codeigniter sehingga kita tidak sulit jika ingin mencari referensi tambahan. Jadi gak salahkan kalau saya memilih Codeigniter untuk tutorial kali ini. Selain itu, jika nanti aplikasi Chating ini ingin dikembangkan lebih lanjut akan lebih mudah karena Codeigniter sudah menganut OOP. Satu lagi, alasan saya yang paling mendasar menggunakan ketiga framework diatas karena GRATIS. Hehe, jangan salah paham dulu. Bukan berarti ane tampang orang pelit dengan kantong melilit. Tapi karena dengan memaksimalkan yang gratis kita bisa menjadi orang kreatif. ingat yah, orang pelit hanya menggunakan yang gratis. Tapi orang kreatif bisa memaksimalkan yang gratis. Sebelum mengikuti turorial ini diharapkan Anda sudah mengerti dasar-dasar tentang ketiga framework diatas. Karena saya tidak akan menjelaskan tentang pengkonfigrasian dasar tentang codeigniter. Saya akan bahas langsung ke inti pemograman saja. Jika belum paham mengenai ketiga framework diatas silahkan mencari referensi dahulu di luar. Nah lanjut lagi nih, sistem chating yang akan saya tunjukan adalah dasar dari segala dasar sistem chating. Jadi disini Anda jangan berharap sistem chating nan canggih kayak di facebook dulu. Tapi setidaknya kalau Anda sudah paham alur kerja dari sistem chating ini, diharapkan Anda akan mudah untuk mengembangkan menjadi lebih bagus. Oke, langsung kita praktik. Pertama-tama kita buat dahulu databasenya. Adapun struktur dari databasenya sebagai berikut Karena ini sistem masih sederhana, kita buat database bernama cichat dengan satu tabel bernama chat. untuk field waktu kita gunakan jenis timestamp agar jika ada data masuk secara otomatis terisi dengan waktu saat data itu masuk. Selanjutnya silahkan siapkan file-file codeigniter dan tempatkan pada localhost masing-masing. Buat
4 folder ci-chat didalam folder htdocs (jika pakai xammp) dan paste file-file codeigniter didalam situ. Lalu didalam folder ci-chat buat lagi folder asset yang nantinya untuk menyimpan file dari boostrap dan jquery. Sehingga struktur direktori folder ci-chat akan terlihat seperti ini. Lalu siapkan file bootsrap dan jquerynya masukan ke dalam folder asset yang baru saja kita buat. Sehingga struktur folder asset akan menjadi seperti ini Selanjutny lakukan penyesuaiann pada file config.php yang berada pada folder aplication/config. Pada baris ke 17 pengaturan base url sesuaikan kodenya menjadi seperti ini $config['base_url'] = ' masih dalam file config.php sesuaikan baris ke-344 menjadi seperti ini $config['rewrite_short_tags'] = TRUE; pengaturan diatas untuk menyingkat penulisan tag. Misalnya pada php biasa kita biasa menggunakan perintah <?php echo "hai";?> maka dengan pengaturan diatas akan disingkat menjadi <?=hai;?> buka file database.php yang masih berada pada satu folder dengan config.php. lalu pada baris ke sesuaikan kodenya menjadi $db['default']['hostname'] = 'localhost'; $db['default']['username'] = 'root'; $db['default']['password'] = ''; $db['default']['database'] = 'cichat';
5 Selanjutnya buka file autoload.php yang masih berada pada satu folder dengan config.php. lalu pada baris ke-55 sesuaikan kodenya menjadi $autoload['libraries'] = array('database'); pada baris ke-67 sesuaikan menjadi $autoload['helper'] = array('url','form'); Lanjut lagi, buka file routes.php yang masih satu folder dengan file diatas. Lalu sesuaikan baris-41 menjadi $route['default_controller'] = "C_chat"; Selanjutnya buat file controler baru bernama C_chat.php di folder application/controler dengan source kode sebagai berikut <?php if (! defined('basepath')) exit('no direct script access allowed'); class C_chat extends CI_Controller { public function index() { $this->load->view('v_chat'); public function kirim_chat() { $user=$this->input->post("user"); $pesan=$this->input->post("pesan"); mysql_query("insert into chat (user,pesan) VALUES ('$user','$pesan')"); redirect ("C_chat/ambil_pesan"); public function ambil_pesan() { $tampil=mysql_query("select * from chat order by waktu desc"); while($r=mysql_fetch_array($tampil)){ echo "<li><b>$r[user]</b> : $r[pesan] (<i>$r[waktu]</i>)</li>";
6 FIle diatas berguna sebagai controler untuk sistem aplikasi chating ini. Sudah paham konsep MVC kan? Nah file C_chat.php inilah yang bertugas mengatur arah program berjalan. Ibarat kapten kapal yang memandu kapalnya. hehe. Namun perlu diingat yah disini kita belum sampai membuat file yang bertugas sebagai model. Karena sistem ini masih sederhana. Namun Anda nantinya dapat mengembangkan sendiri kedepannya. Saya buat dua file dulu agar Anda dapat lebih mudah mempelajarinya. Pada file diatas terdapat tiga fungsi yaitu index, kirim_chat, dan ambil_pesan. Fungsi index adalah fungsi yang pertama kali di eksekusi ketika program di jalankan. Di mana fungsi ini akan memuat file V_chat.php yang akan kita bahas nanti. Fungsi kirim_chat bertugas untuk mengirim pesan ke database, terlihat disitu ada beberapa perintah sql insert. Jadi ketika tombol kirim nanti di klik. Fungsi inilah yang akan menerima respon dari inputan user. Lalu ketika proses pemasukan data selesai akan dialihkan ke fungsi ambil_pesan Fungsi ambil_pesan bertugas untuk mengambil seluruh data dari tabel chat. Inilah fungsi yang membuat kita bisa melihat pesan yang sudah kita inputkan maupun pesan orang lain di kotak pernyataan. Lanjut kita buat file view baru bernama V_chat.php tempatkan pada folder aplication/views/, berikut adalah source kodenya <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>aplikasi Chatting Sederhana</title> <link rel="stylesheet" href="<?=base_url('asset/bootstrap/css/bootstrap.min.css');?>"> <script src="<?=base_url('asset/bootstrap/js/bootstrap.min.js');?>"></script> <script src="<?=base_url('asset/jquery.js');?>"></script> <script> $(document).ready(function(){ function tampildata(){ $.ajax({ type:"post", url:"<?=site_url('c_chat/ambil_pesan');?>", success: function(data){ $('#isi_chat').html(data); ); $('#kirim').click(function(){ var pesan = $('#pesan').val();
7 var user = $('#user').val(); $.ajax({ type:"post", url:"<?=site_url('c_chat/kirim_chat');?>", data: 'pesan=' + pesan + '&user=' + user, success: function(data){ $('#isi_chat').html(data); ); ); </head> setinterval(function(){ tampildata();,1000); ); </script> <style> #isi_chat{height:400px; </style> <body> <div id="container"> <h1>aplikasi Chating Codeigniter, Bootstrap & Jquery</h1> <div class="col-md-12"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">kotak Percakapan</h3> <div class="panel-body" > <ul id="isi_chat"> <ul> <div class="col-md-2"> <input placeholder="nama" type="text" id="user" class="form-control"> <div class="col-md-8"> <input placeholder="pesan" type="text" id="pesan" class="form-control"> <div class="col-md-2"> <input type="button" value="kirim" id="kirim" class="btn btn-md btn-warning">
8 </body> </html> Nah, pada file diataslah framework bootstrap dan jquery telah unjuk gigi. Pertama kita load dulu file jquery dan bootsrap, pemuatan dilakukan dari baris 6-8 dimana kita memuat file css dan javascript dari bootsrap serta file utama jquery. Lalu pada baris ke-9-40 adalah kode inti dari jquery. Kita menggunakan fitur jquery ajax untuk proses pengiriman datanya. Inilah yang menyebabkan ketika kita klik tombol kirim tidak akan terjadi loading pada aplikasi berkat fitur ajax ini. Selain itu pada baris ke 37 kita menggunakan perintah set-interval. Fungsi sama dengan tombol refresh browser untuk memperbarui tampilan data, cuma tidak menyebabkan loading. Lalu pada bagian inti terdapat penerapan fitur grid layouting kepunyaan twitter bootstrap. Bagi Anda yang sudah familiar tentang bootsrap tentu sudah tak asing lagi kenapa saya memasukan class col-md-mdean pada masing-masing div elemen, hehe. Terdapat 2 field inputan, yaitu nama user dan pesan. Ketika kita mengklik tombol kirim data inputan akan masuk ke kotak percakapan. Tampilan dari file V_chat.php akan terlihat seperti ini Demikianlah tutorial kali ini. Saya harap Anda sekarang mengerti alur kerja dari aplikasi chating dengan tiga framework diatas. Tentang Penulis
9 Dadan Saya adalah pria biasa saja yang tumbuh semakin besar di lingkungan yang serba biasa, Semoga kehadiran saya disini bisa membantu Anda.
10 ^_^
Sering kita mendengar tentang MVC Framework PHP tetapi kurang mengerti belum arti dari
Pengertian MVC Framework PHP Sering kita mendengar tentang MVC Framework PHP tetapi kurang mengerti belum arti dari MVC itu sendiri. Salah satu mvc framework yang populer digunakan saat ini adalah Code
Lebih terperinciTUTORIAL CODEIGNITER Langkah Tepat menjadi Web Developer Handal, menguasai CodeIgniter, jalan membuat aplikasi berbasis website lebih mudah
TUTORIAL CODEIGNITER Langkah Tepat menjadi Web Developer Handal, menguasai CodeIgniter, jalan membuat aplikasi berbasis website lebih mudah www.ilmuwebsite.com Bagian 4. CRUD (Create, Read, Update, Delete)
Lebih terperinciTUTORIAL CODEIGNITER Langkah Tepat menjadi Web Developer Handal, menguasai CodeIgniter, jalan membuat aplikasi berbasis website lebih mudah
TUTORIAL CODEIGNITER Langkah Tepat menjadi Web Developer Handal, menguasai CodeIgniter, jalan membuat aplikasi berbasis website lebih mudah www.ilmuwebsite.com Bagian 7. Membuat Data Pagination Menggunakan
Lebih terperinciE-Book PEMROGRAMAN CLIENT SERVER BERBASIS PHP DENGAN FRAMEWORK CODEIGNITER. Disusun Oleh: Arfian Hidayat, S.Kom
E-Book PEMROGRAMAN CLIENT SERVER BERBASIS PHP DENGAN FRAMEWORK CODEIGNITER Disusun Oleh: Arfian Hidayat, S.Kom http://arfianhidayat.com FAKULTAS ILMU KOMPUTER UNIVERSITAS DIAN NUSWANTORO SEMARANG 2013
Lebih terperinciPemrograman Web Berbasis Framework. Pertemuan 4 : Konsep MVC : Controller. Hasanuddin, S.T., M.Cs. Prodi Teknik Informatika UAD
Pemrograman Web Berbasis Framework Pertemuan 4 : Konsep MVC : Controller Hasanuddin, S.T., M.Cs. Prodi Teknik Informatika UAD hasan@uad.ac.id Pokok Bahasan Pendahuluan Struktur direktori dari web framework
Lebih terperinciPemrograman Web PRAKTIKUM 6. Query Data 2. TUJUAN BELAJAR Mahasiswa dapat menggunakan PHP dan MySQL untuk mengupdate data
PRAKTIKUM 6 Query Data 2 TUJUAN BELAJAR Mahasiswa dapat menggunakan PHP dan MySQL untuk mengupdate data MATERI Program edit dan hapus TUGAS Menambahkan fitur edit dan hapus untuk semua form input data
Lebih terperinciE-Book PEMROGRAMAN CLIENT SERVER BERBASIS PHP DENGAN FRAMEWORK CODEIGNITER. Disusun Oleh: Arfian Hidayat, S.Kom
E-Book PEMROGRAMAN CLIENT SERVER BERBASIS PHP DENGAN FRAMEWORK CODEIGNITER Disusun Oleh: Arfian Hidayat, S.Kom http://arfianhidayat.com FAKULTAS ILMU KOMPUTER UNIVERSITAS DIAN NUSWANTORO SEMARANG 2013
Lebih terperinciPertemuan 1. Pengenalan Code Igniter dan Pengaksesan Controller
Pertemuan 1 Pengenalan Code Igniter dan Pengaksesan Controller Code Igniter adalah sebuah framework PHP. Framework itu sendiri adalah suatu kerangka kerja yang berupa sekumpulan folder yang memuat file-file
Lebih terperinciMuhammad Khoirul Hasin https://ordinaryhumansays.wordpress.com/
Infinite Scroll di Codeigniter: Seperti Paging Twitter dan Facebook Muhammad Khoirul Hasin irulsits@gmail.com https://ordinaryhumansays.wordpress.com/ Lisensi Dokumen: Copyright 2003-2007 IlmuKomputer.Com
Lebih terperinciPemrograman Web Berbasis Framework. Pertemuan 6 : Konsep MVC : Model. Hasanuddin, S.T., M.Cs. Prodi Teknik Informatika UAD
Pemrograman Web Berbasis Framework Pertemuan 6 : Konsep MVC : Model Hasanuddin, S.T., M.Cs. Prodi Teknik Informatika UAD hasan@uad.ac.id Pokok Bahasan Pendahuluan Pengiriman Query Melakukan Escaping Menampilkan
Lebih terperinciFramework untuk web yang dibuat dalam bentuk Web Berbasis Model-View-Controller (MVC)
AndiWahjuR E awreman@gmail.com Introduction CodeIgniter Framework untuk web yang dibuat dalam bentuk Web Berbasis Model-View-Controller (MVC) Model strukturdata View informasi yang disampaikan pe pengguna
Lebih terperinciMembuat Template dengan Bootstrap pada Codeigniter
Membuat Template dengan Bootstrap pada Codeigniter Pepen Aandrian Syah pepenaan@gmail.com Abstrak Bootstrap adalah suatu Framework yang digunakan untuk membuat tampilan / desain suatu halaman website.
Lebih terperinciMembuat Chatbox Sederhana dengan Ajax jquery dan PHP PDO
Membuat Chatbox Sederhana dengan Ajax jquery dan PHP PDO Oleh: Ananda Mukhammad Ikhsan Chatbox adalah fitur yang cukup penting di website berbasis sosial media. Nah, kali ini saya akan memberikan tutorial
Lebih terperinciMembuat Web Chatting dengan Ajax Jquery, PHP, dan Bootstrap [Part 2]
Membuat Web Chatting dengan Ajax Jquery, PHP, dan Bootstrap 2.3.2 [Part 2] Oleh: d-newbie pada tutorial sebelumnya kita sudah membuat 2 modal, yaitu modal "Masuk" dan modal "Daftar" dan pada tahap ini
Lebih terperinciMembuat Sistem Pertemanan Sederhana
Membuat Sistem Pertemanan Sederhana Oleh: Dadan Pada artikel kali ini saya akan menunkukan kepada Anda cara membuat sistem pertemanan seperti pada website jejaring sosial. Contohnya yah seperti pada website
Lebih terperinciPemrograman Web Berbasis Framework. Pertemuan 5 : Konsep MVC : View. Hasanuddin, S.T., M.Cs. Prodi Teknik Informatika UAD
Pemrograman Web Berbasis Framework Pertemuan 5 : Konsep MVC : View Hasanuddin, S.T., M.Cs. Prodi Teknik Informatika UAD hasan@uad.ac.id Pokok Bahasan Pendahuluan Penanganan HTML Penanganan Form Penanganan
Lebih terperinciFungsi Insert Data dalam CRUD (CREATE READ UPDATE DELETE) di Codeigniter
Fungsi Insert Data dalam CRUD (CREATE READ UPDATE DELETE) di Codeigniter Oleh: Bung-Ko CRUD adalah singkatan dari Create Read Update Delete, yang sering digunakan pada aplikasi-aplikasi pengolahan data
Lebih terperinci2014 TUTORIAL PANADA FRAMEWORK BY DIMAS EDU
Tutorial Panada Framework Chapter 3 : Bekerja dengan Form SamidCorner(Tegal) Pembaca yang budiman. Masih dirangkain tutorial berseri Panada Framework, dan pada kesempatan kali ini saya akan membahas mengenai
Lebih terperinciMEMBUAT LAYOUT DENGAN CONTAINER BOOTSTRAP
MEMBUAT LAYOUT DENGAN CONTAINER BOOTSTRAP NURLITA nurlita.icha@gmail.com Abstrak Kali ini kita akan membahas cara membuat layout dengan container bootstrap. Bootstrap adalah suatu framework front-end yang
Lebih terperinciBudi Permana, S.Kom Pendahuluan
Aplikasi CRUD Menggunakan Framework Codeigniter Dengan Teknik Scaffolding Budi Permana, S.Kom nobiasta@gmail.com Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Org dapat digunakan, dimodifikasi dan disebarkan
Lebih terperinciTekhnik Paging Dengan Jquery Ajax
Tekhnik Paging Dengan Jquery Ajax Oleh: Dadan Bagi Anda programer web atau yang sudah lama berkecimpung di dunia pemograman, paging adalah suatu tekhnik menampilkan data perhalaman. Dengan paging informasi
Lebih terperinciTekhnik Paging Dengan Jquery Ajax
Tekhnik Paging Dengan Jquery Ajax Oleh: Dadan Bagi Anda programer web atau yang sudah lama berkecimpung di dunia pemograman, paging adalah suatu tekhnik menampilkan data perhalaman. Dengan paging informasi
Lebih terperinciBAB II TINJAUAN PUSTAKA DAN DASAR TEORI
BAB II TINJAUAN PUSTAKA DAN DASAR TEORI 2.1. Tinjauan Pustaka Dari penelitian dalam ini menggunakan referensi yang sudah dibuat oleh penelitian sebelumnya, perbandingannya dapat dilihat pada tabel 2.1
Lebih terperinciCHAPTER 6. Sebelum membuat starter data, kita perlu meng-create collections terlebih dahulu. Buat folder lib pada folder aplikasi.
CHAPTER 6 Untuk membuat collections, hal pertama yang dilakukan adalah menambahkan baris baru ke dalam file Javascript yang memungkinkan user untuk membuat collections. Sebelumnya, image tersimpan dalam
Lebih terperinciMateri 2 E-Commerce Lanjut (CodeIgniter) 3 SKS Semester 7 S1 Sistem Informasi UNIKOM 2015 Nizar Rabbi Radliya
Materi 2 E-Commerce Lanjut (CodeIgniter) 3 SKS Semester 7 S1 Sistem Informasi UNIKOM 2015 Nizar Rabbi Radliya nizar.radliya@yahoo.com Nama Mahasiswa NIM Kelas Kompetensi Dasar Memahami konsep dasar MVC
Lebih terperinciPELATIHAN 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:
Lebih terperinciTUTORIAL FRAMEWORK. 1. Pengertian Framework.
TUTORIAL FRAMEWORK 1. Pengertian Framework. Framework adalah kerangka kerja. Framework juga dapat diartikan sebagai kumpulanscript (terutama class dan function) yang dapat membantu developer/programmer
Lebih terperinciMembuat Fasilitas Readmore dengan TInyMCE
Membuat Fasilitas Readmore dengan TInyMCE Oleh: Dadan Warga jago koding sekalian, pasti kalau Anda pernah menggunakan Wordpress ataupun blogger pasti di editor artikel terdapat fasilitas read more atau
Lebih terperinciMembuat Login Pop Up Dengan JqueryUI
Membuat Login Pop Up Dengan JqueryUI Oleh: Dadan Berawal dari maraknya tayangan goyang di telivisi. Terinspirasi juga untuk membuat efek goyang pada website saya. Hehe kagak nyambung nih ilustrasi ceritanya
Lebih terperinciMembuat Toko Online dengan Teknik OOP, MVC, dan AJAX
Membuat Toko Online dengan Teknik OOP, MVC, dan AJAX Sanksi Pelanggaran Pasal 113 Undang-Undang Nomor 28 Tahun 2014 tentang Hak Cipta 1. Setiap Orang yang dengan tanpa hak melakukan pelanggaran hak ekonomi
Lebih terperinciFRAMEWORK CODEIGNITER
FRAMEWORK CODEIGNITER COURSE TEKNIK INFORMATIKA SEMESTER GENAP 2014 DISUSUN OLEH: MOH. ALI FIKRI POLITEKNIK INDRAMAYU (POLINDRA) 2014 A. Pendahuluan CodeIgniter CodeIgniter adalah aplikasi open source
Lebih terperinciNama: ahmad edi purwanto. Nim: Tugas uts web statis. Tutorial cara penggunaan suatu framework CSS
Nama: ahmad edi purwanto Nim:12111027 Tugas uts web statis. Tutorial cara penggunaan suatu framework CSS Pengertian dasar dari Framework itu sendiri adalah; sebuah konsep yang memiliki struktur serta terorganisir
Lebih terperinciMODUL 13 INTERKONEKSI CLIENT-SERVER JQUERY
MODUL 13 INTERKONEKSI CLIENT-SERVER JQUERY A. Tujuan : 1. Memahami pembuatan user interface 2. Memahami transmisi data pada user interface 3. Memahami passing parameter dalam koneksi client-server B. Dasar
Lebih terperinciBAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI
BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI 2.1. Tinjauan Pustaka Penelitian yang dilakukan oleh Irma Eka Ayu Novita dan Hernawan Sulistyanto (2015) dengan judul Pengembangan Aplikasi Untuk Mengetahui Kebutuhan
Lebih terperinciGambar 1. Tampilan form karyawan
Tutorial Panada Framework Chapter 4 : Validasi Form SamidCorner(Tegal Pembaca yang budiman. Masih bersama tutorial berseri dari Panada Framework, setelah pada chapter yang ketiga mengenai penggunaan form
Lebih terperinciPengembangan Aplikasi Menggunakan Framework Code Igniter 3 Level Basic. Helmy Faisal Muttaqin, S.Kom, M.T
Pengembangan Aplikasi Menggunakan Framework Code Igniter 3 Level Basic Helmy Faisal Muttaqin, S.Kom, M.T Apa itu Framework? Framework merupakan kumpulan library siap pakai yang dapat dimanfaatkan dalam
Lebih terperinciPengenalan Script. Definisi HTML
1 Pengenalan Script Pada bab ini akan dibahas bahasa script yang dapat digunakan untuk membuat halaman web. Untuk dapat membuat halaman web bahasa script pertama yang harus anda kenal adalah HTML. HTML
Lebih terperinciMembuat Online Messanger atau Chat dengan PHP, MySQL, JQuery, Bootsrtrap 3 dan Font Awesome 4 [Part 3]
Membuat Online Messanger atau Chat dengan PHP, MySQL, JQuery, Bootsrtrap 3 dan Font Awesome 4 [Part 3] Oleh: Arinadi Nur Rohmad Asalamualaikum, Setelah di part sebelumnya kita sudah membuat design dan
Lebih terperinciWEB STATIS MEMBUAT TUTORIAL PENGGUNAAN FRAMEWORK CSS
WEB STATIS MEMBUAT TUTORIAL PENGGUNAAN FRAMEWORK CSS Oleh : EMA SETYA KARISNA TI. 12141391 A. PENGERTIAN FRAMEWORK CSS Bootswatch.com Bootswatch merupakan penyedia tema berbagai macam bootstrap dengan
Lebih terperinciMODUL 5 GET & POST Pemograman Web Teknik Informatika Universitas Pasundan Bandung 2016/2017
MODUL 5 GET & POST Pemograman Web Teknik Informatika Universitas Pasundan Bandung 2016/2017 Konten Post dan Get Request... 2 Isset dan Empty... 5 Sanitasi input... 6 Latihan... 7 Teknik Informatika Universitas
Lebih terperinciE-trik Ajax. Database MySQL. Dedi Alnas
E-trik Ajax Database MySQL Dedi Alnas Pengenalan MySQL Tutorial kali ini akan membahas cara pembuatan aplikasi web yang dapat dihubungkan dengan MySQL. Pada paket instalasi Xampp terdapat MySQL dan phpmyadmin.
Lebih terperinciIntro To JQuery Training Online Ilmuwebsite
MODUL I JQUERY KELAS ZEROZERO Intro To JQuery Training Online Ilmuwebsite http://www.ilmuwebsite.com Lisensi Dokumen: Copyright 2014-2015 Ilmuwebsite.Com Untuk semua kalangan, silahkan menyebarluaskan
Lebih terperinciPersiapan. Jalankan server apache dari XAMPP control panel Ekstrak file yang telah dibagikan, Salin folder week_8 ke htdocs
Ajax Persiapan Download: https://drive.google.com/file/d/0bxksp6axeejqa3loddvnd2fcx3c/vi ew?usp=sharing Latihan-latihan ini memerlukan koneksi aktif internet Cek kembali koneksi internet anda Jalankan
Lebih terperinciMembuat Display Produk dalam Layout Box 4 Kolom
Membuat Display Produk dalam Layout Box 4 Kolom Oleh: Debrian Ruhut Saragih Selamat pagi Sobat sekalian, saat ini kita banyak menemukan toko online bertebaran di Internet. Saya sering memperhatikan bagaimana
Lebih terperinciMembuat Responsive dan Fleksibel Image Gallery dengan JQuery Fleximage
Membuat Responsive dan Fleksibel Image Gallery dengan JQuery Fleximage Oleh: Christian Rosandhy Siapa bilang bikin galeri gambar yang responsive itu susah? Di tutorial kali ini kita akan belajar membuat
Lebih terperinciMembuat CRUD Sederhana pada Framework Laravel
Membuat CRUD Sederhana pada Framework Laravel Abdul Rohman admin@abdulrohman.web.id :: http://www.abdulrohman.web.id Abstrak CRUD (Create, Read, Update dan Delete) merupakan program dasar yang harus dikuasai
Lebih terperinciDropdown Berhubungan (Sync Dropdown) Dengan CI & MySQL
Dropdown Berhubungan (Sync Dropdown) Dengan CI & MySQL Oleh: Gilang Sonar Amanu Saya mau coba share lagi, tutorial sederhana namun sering bgt digunakan untuk berbagai kasus. Mungkin bisa berguna khususnya
Lebih terperinciTutorial CakePHP Dasar Part III - Sorting, Pagination
Tutorial CakePHP Dasar Part III - Sorting, Pagination Oleh: Cecep Yusuf Tutorial CakePHP ini akan belajar bagaimana membuat pagination dan sorter/pengurut untuk daftar data yang akan ditampilkan. Updated:
Lebih terperinciAJAX dengan jquery Part 1
AJAX dengan jquery Part 1 Oleh: Cecep Yusuf Kali ini saya akan share tutorial AJAX dengan jquery. Dengan menggunakan jquery, penggunaan AJAX akan jauh menjadi lebih mudah. Penjelasan Kali ini saya akan
Lebih terperinciCodeigniter : Membuat kalkulator sederhana
Codeigniter : Membuat kalkulator sederhana Oleh: Meyta Posting yang keduaa :D, belum dapet sambutan nih :(. tapi gapapa deh usaha itu perlu! :D Sekarang kita mau buat aplikasi kalkulator sederhana berbasis
Lebih terperinciMahasiswa memahami Pengertian, fungsi, aplikasi untuk menjalankan JavaScript, cara menjalankan kode, cara memasukkan kode JavaScript ke dalam HTML
Pengenalan JavaScript Standar Kompetensi Mahasiswa memahami Pengertian, fungsi, aplikasi untuk menjalankan JavaScript, cara menjalankan kode, cara memasukkan kode JavaScript ke dalam HTML Indikator Hasil
Lebih terperinciDAFTAR PUSTAKA. Anhar Panduan Menguasai PHP & MySQL Secara Otodidak. Mediakita : Jakarta
DAFTAR PUSTAKA Anhar.2010. Panduan Menguasai PHP & MySQL Secara Otodidak. Mediakita : Jakarta Basuki Awan Pribadi.2010. Membangun Web Berbasis PHP dengan Framework Codeigniter.Penerbit Lokomedia Yogyakarta
Lebih terperinciMembuat Online Messanger atau Chat dengan PHP, MySQL, JQuery, Bootsrtrap 3 dan Font Awesome 4 [Part 2]
Membuat Online Messanger atau Chat dengan PHP, MySQL, JQuery, Bootsrtrap 3 dan Font Awesome 4 [Part 2] Oleh: Arinadi Nur Rohmad Episode System Sign-Up/Registerasi/Daftar User Asalamualaikum, Setelah di
Lebih terperinciJamal Apriadi
Aplikasi CRUD ( Create Read Update Delete ) dengan Codeigniter Jamal Apriadi Ghantexs16@gmail.com http://commit-tegal.org/ Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi
Lebih terperinciMembuat Carousel Dengan Bootstrap CDN
Membuat Carousel Dengan Bootstrap CDN Fitria Arnita 23@gmail.com Abstrak Bootstrap adalah framework CSS yang dibuat khusus para designer web. Bootstrap digunakan untuk membuat sebuah templates web atau
Lebih terperinciWELCOME MESSAGE WE STARTED AT. 10 March 2016 dimana komunitas ini didirikan
WELCOME MESSAGE 10 March 2016 dimana komunitas ini didirikan dari ide mahasiswa STMIK Indonesia Jakarta dan mulai mengadakan Workshop dan bimbingan pembelajaran dari tempat ke tempat dengan tujuan memajukan,
Lebih terperinciTrik Mudah Membuat CMS Website dari Nol
Trik Mudah Membuat CMS Website dari Nol Trik Mudah Membuat CMS Website dari Nol Rohi Abdulloh PENERBIT PT ELEX MEDIA KOMPUTINDO Trik Mudah Membuat CMS Website dari Nol Rohi Abdulloh 2016, PT Elex Media
Lebih terperinciCODEIGNITER 3. Belajar Mandiri. Zamah Sari
CODEIGNITER 3 Belajar Mandiri Zamah Sari i DAFTAR ISI PENDAHULUAN CODEIGNITER... 1 Fitur Codeigniter... 1 INSTALASI CODEIGNITER... 3 ARSITEKTUR CODEIGNITER... 5 Struktur Direktori... 6 Folder Application...
Lebih terperinciPEMBUATAN MASTER PENGGUNA PADA APLIKASI BPN-PPAT (CRUD)CREATE, READ, UPDATE,DELETE With PHP & Mysql
2017 PEMBUATAN MASTER PENGGUNA PADA APLIKASI BPN-PPAT (CRUD)CREATE, READ, UPDATE,DELETE With PHP & Mysql Materi Lanjutan Dari Matei Pembuatan Halaman Login, Halaman Dashboard Admin & Menu Keluar Bas-Dev
Lebih terperinciMENAMPILKAN GOOGLE MAPS DI WEB BROWSER DENGAN HTML5
MENAMPILKAN GOOGLE MAPS DI WEB BROWSER DENGAN HTML5 Agung Nugroho Agung.nugroho@raharja.info :: http://ngapainbingung.com Abstrak Google Maps merupakan maps yang paling popular karena keakuratannya dan
Lebih terperinciAJAX Tutorial. Contoh AJAX Dasar 1
Contoh AJAX Dasar 1 Setelah Anda mengenal dasar-dasar tentang konsep AJAX, XML dan Javascript, berikut ini akan kita bahas mengenai contoh aplikasi AJAX dasar. Pada contoh ini kita akan membuat aplikasi
Lebih terperinciUpload File dengan Metode AJAX
Upload File dengan Metode AJAX Oleh: Cecep Yusuf Saya akan membahas bagaimana membuat form upload file beserta prosesnya dengan menggunakan teknik AJAX memakai library Ajax File Upload, salah satu library
Lebih terperinciPengenalan JavaScript
Pengenalan JavaScript Tujuan - Mahasiswa memahami konsep dasar Javascript - Mahasiswa mampu memahami cara menggunakan Javascript - Mahasiswa mampu memahami dasar variabel di Javascript - Mahasiswa mampu
Lebih terperinciPHP dan Framework CodeIgniter
Universitas Negeri Padang PHP dan Framework CodeIgniter Yeni Septiana Pendidikan Teknik Informatika 1102640 2015 Hai All.. Kali ini kita akan membahas tentang membuat Website dengan menggunakan bahasa
Lebih terperinciBAB IV IMPLEMENTASI KARYA. Pada bab ini dijelaskan tentang proses produksi tentang pembuatan website
BAB IV IMPLEMENTASI KARYA Pada bab ini dijelaskan tentang proses produksi tentang pembuatan website tanggap darurat dengan menggunakan teknik framework Codeigniter. Framework Codeigniter ini menggunakan
Lebih terperinciBagian II Dasar-Dasar CodeIgniter
Bagian II Dasar-Dasar CodeIgniter 2.1 URI Dalam CodeIgniter CodeIgniter menyediakan dua alternatif pendekatan penggunaan URI (Uniform Resource Identifier) dalam aplikasi web yang dibangun dengan CodeIgniter.
Lebih terperinciKolaborasi Codeigniter & Bootstrap Membangun Aplikasi PSB Sekolah. Awan Pribadi Basuki CV. LOKOMEDIA
Kolaborasi Codeigniter & Bootstrap Membangun Aplikasi PSB Sekolah Awan Pribadi Basuki CV. LOKOMEDIA Kolaborasi Codeigniter dan Bootstrap: Membangun Aplikasi PSB Sekolah Perpustakaan Nasional : Katalog
Lebih terperinciBAB IV IMPLEMENTASI DAN PEMBAHASAN SISTEM. Implementasi berisi rangkuman dan cuplikan program
BAB IV IMPLEMENTASI DAN PEMBAHASAN SISTEM 4.1 IMPLEMENTASI SISTEM Implementasi berisi rangkuman dan cuplikan program (prosedur) inti dari aplikasi yang dikembangkan berdasarkan hasil perancangan sistem.
Lebih terperinciCara Membuat Halaman Form Dengan Bootstrap CDN
Cara Membuat Halaman Form Dengan Bootstrap CDN Fitria Arnita 23@gmail.com Abstrak Bootstrap adalah front-end framework yang solek, bagus dan luar biasa yang mengedapankan tampilan untuk mobile device (Handphone,
Lebih terperinciPersiapan. File latihan.rar diekstrak. Contoh apabila Bahan diekstrak di d:\
CSS & CSS Framework CSS Cascading Style Sheets (CSS) adalah sebuah bahasa yang digunakan untuk menampilkan style dari sebuah dokumen HTML. CSS menjelaskan bagaimana elemen HTML harus ditampilkan. Persiapan
Lebih terperinciBAB 2 LANDASAN TEORI
BAB 2 LANDASAN TEORI 2.1 Pengertian Sistem Informasi Secara teori, penerapan sebuah Sistem Informasi memang tidak harus menggunakan komputer dalam kegiatannya. Tetapi pada prakteknya tidak mungkin sistem
Lebih terperinciTutorial jquery Ajax Bagian 2 (Input, Update, Delete, Animasi Loading)
Tutorial jquery Ajax Bagian 2 (Input, Update, Delete, Animasi Loading) 17:08 20 Oct 2010 @Ajax Pada artikel sebelumnya kita telah belajar dan mengenal jquery dan penggunaan fungsi load() di Tutorial jquery
Lebih terperinciAJAX dengan jquery Part 2
AJAX dengan jquery Part 2 Oleh: Cecep Yusuf Kita akan belajar bagaimana cara membuat AJAX dengan response data HTML memakai metode GET dan dimasukkan ke dalam elemen yang ditentukan pada halaman utama.
Lebih terperincibuat Lightbox mu sendiri dengan jquery
buat Lightbox mu sendiri dengan jquery Oleh: putra surya herlambang assalamualikum wr wb. apakah kamu pernah melihat gambar pada website yang ketika kamu klik lalu akan muncul suatu kotak besar yang juga
Lebih terperinciPRAKTIKUM PEMROGRAMAN WEB MODUL 7 TWITTER BOOTSTRAP
PRAKTIKUM PEMROGRAMAN WEB MODUL 7 TWITTER BOOTSTRAP Disusun oleh: (Nama) (NIM) PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS MUHAMMADIYAH JEMBER 2015 Modul 7 Twitter Bootstrap I. Tujuan:
Lebih terperinciMembuat Database mysql dengan PhpMyAdmin
Materi artikel : Membuat database mysql dengan PhpMyadmin View Insert Edit Delete Searching Membuat Hitcounter dengan file teks Syarat : Mengerti penggunaan tag HTML Browser dapat mengenali sintak Php
Lebih terperinciMembuat Top Fixed Responsive Navbar Twitter Bootstrap
Membuat Top Fixed Responsive Navbar Twitter Bootstrap Oleh: ricky orlando napitupulu Salam bro and sis :), selamat datang di tulisan tutorial pertama ane ni, makasi da mau singga disini ye walopun kesasar
Lebih terperinciModul-5 GET & POST. Pemograman Web TEKNIK INFORMATIKA UNIVERSITAS PASUNDAN BANDUNG
Modul-5 GET & POST Pemograman Web TEKNIK INFORMATIKA UNIVERSITAS PASUNDAN BANDUNG Pendahuluan Pada modul sebelumnya, kita telah mengenal proses assignment. Kita dapat mengassign suatu nilai kepada suatu
Lebih terperinciBelajar dasar codeigniter framework
Belajar dasar codeigniter framework Ramdhan Indra B Dadhan.rpl@gmail.com Abstrak Untuk dapat menggunakan CodeIgniter, tentu kita harus mempelajari dahulu bagaimana membuat sebuah aplikasi berbasis website
Lebih terperinciPRAKTIKUM SISTEM INFORMASI MANAJEMEN
MODUL V DREAMWEAVER 5.1 Tujuan Praktikum Setelah menyelesaikan modul ini, mahasiswa diharapkan mampu : 1. Mengenal komponen aplikasi Macromedia Dreamweaver 2. Membuat template website offline sederhana
Lebih terperinciE-trik Ajax. Ajax dan MySQL. Dedi Alnas
E-trik Ajax Ajax dan MySQL Dedi Alnas Ajax dan MySQL Tutorial kali ini akan membahas cara pembuatan aplikasi Ajax yang dapat dihubungkan dengan MySQL. Pada paket instalasi Xampp terdapat MySQL dan phpmyadmin.
Lebih terperinciBERKENALAN DENGAN MODEL CODEIGNITER
BERKENALAN DENGAN MODEL CODEIGNITER Muhamad Yusuf muhamadyusuf0012@gmail.com :: https://muhamadyusufppn.blogspot.co.id Abstrak Framework CodeIgniter memiliki konsep MVC(Model, View, Controller) yang merupakan
Lebih terperinciAJAX dengan jquery Part 3
AJAX dengan jquery Part 3 Oleh: Cecep Yusuf Pada tutorial ini, kita akan belajar bagaimana mengirim data POST dari sebuah form dan dikirim dengan metode AJAX post dengan menggunakan jquery. Selamat pagi
Lebih terperinciMembuat Toko Buku dengan PHP - MySQL
Membuat Toko Buku dengan PHP - MySQL Iman Amalludin iman.llusion@gmail.com :: http://blog.imanllusion.hostzi.com Abstrak PHP. Apa itu? PHP (Hypertext Preprocessor) adalah bahasa skrip yang dapat ditanamkan
Lebih terperinciPRAKTIKUM. Rekayasa Web. Modul 2: CRUD CodeIgniter Part I. Laboratorium Teknik Informatika Universitas Pasundan
PRAKTIKUM Rekayasa Web Modul 2: CRUD CodeIgniter Part I Laboratorium Teknik Informatika Universitas Pasundan Konten modul: 1. Read Data 2. Create Data 3. Delete Data Tujuan praktikum: 1. Praktikan diharapkan
Lebih terperinciBAB I PENDAHULUAN. media pembelajaran itu adalah e-learning. E-learning merupakan suatu teknologi informasi
BAB I PENDAHULUAN 1.1. Latar Belakang Masalah Pesatnya perkembangan teknologi informasi di bidang pendidikan, dapat dilihat dari banyaknya media-media pembelajaran yang digunakan di masyarakat. Salah satu
Lebih terperinciFramework CodeIgniter Part 1
1 Framework CodeIgniter Part 1 Fajar Y. Zebua fajarzebua@gmail.com http://www.bangjar.blogspot.com Lisensi Dokumen : Copyright 2012 Fajar Y. Zebua Seluruh tulisan yang dibuat oleh Fajar Y. Zebua dapat
Lebih terperinci1. Install software PHPTriad yang ada pada folder software. 2. Copy file yang ada pada folder SOURCODE ke dalam folder
PENERAPAN SISTEM PAKAR UNTUK MENGIDENTIFIKASI PENYAKIT PADA HEWAN SAPI MENGGUNAKAN METODE CERTAINTY FACTOR A. Dijalankan di localhost 1. Install software PHPTriad yang ada pada folder software pendukung
Lebih terperinciBAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI
BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI 2.1 Tinjauan Pustaka Penelitian sejenis pernah dilakukan oleh Kresno Fransiscus Xaverius Dwi (2017), dengan judul Sistem Informasi Penggajian Dosen di STMIK AKAKOM
Lebih terperinciSImple Pop-Up Modal dengan CSS3 dan Jquery
SImple Pop-Up Modal dengan CSS3 dan Jquery Oleh: d-newbie Assalamualaikum wr.wb. bertemu lagi dengan saya, kali ini saya akan menulis tutorial tentang pop-up, apa itu pop-up? Kalo menurut wikipedia pop-up
Lebih terperinciRWD (Responsive Web Design) dengan Grid System Bootsrtap
RWD (Responsive Web Design) dengan Grid System Bootsrtap Oleh: Jaf Al Azam RWD (Responsive Web Design) dengan Grid System Bootsrtap Bootstrap merupkakan Framework CSS yang sedang Booming tahun 2015 ini,
Lebih terperinciMEMBUAT CRUD DENGAN CODEIGNITER : INPUT DATA KE DATABASE
MEMBUAT CRUD DENGAN CODEIGNITER : INPUT DATA KE DATABASE Muhamad Yusuf muhamadyusuf0012@gmail.com :: https://muhamadyusufppn.blogspot.co.id Abstrak Fungsi dasar dalam pembuatan suatu proyek web adalah
Lebih terperinciPendahuluan. Hal itu dimungkinkan dengan adanya framework bernama PhoneGap. PhoneGap
Pendahuluan Dahulu, membuat aplikasi mobile semacam android packege (apk) boleh dibilang sulit dan tidak praktis. Seseorang butuh kemampuan bahasa pemrograman java yang boleh jadi bukanlah bahasa yang
Lebih terperinciLAPORAN RESMI. PRAKTIKUM TEKNOLOGI WEB Pengenalan JavaScript
LAPORAN RESMI PRAKTIKUM TEKNOLOGI WEB Pengenalan JavaScript Dosen Pembimbing : Dwi Susanto Oleh : Noer Rhiannah A (4103131052) 3 D3 MMB B PROGRAM STUDI TEKNOLOGI MULTIMEDIA BROADCASTING DEPARTEMEN MULTIMEDIA
Lebih terperinciBAB II TINJAUAN PUSTAKA DAN DASAR TEORI. autentikasi dan otorisasi user. Aplikasi belum menggunakan teknologi responsive
BAB II TINJAUAN PUSTAKA DAN DASAR TEORI 2.1 Tinjauan Pustaka Nova P (2015) Aplikasi yang dibangun berbasis web yang memiliki fasilitas transkasi pengiriman antara pengirim dan penerima melalui sistem login
Lebih terperinciBAB III LANDASAN TEORI. pengembang untuk membuat sebuah aplikasi web. Dilengkapibanyak library dan
BAB III LANDASAN TEORI 3.1 CodeIgniter CodeIgniter adalah sebuah framework PHP yang dapat mempercepat pengembang untuk membuat sebuah aplikasi web. Dilengkapibanyak library dan helperyang berguna di dalamnya
Lebih terperinci[SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap
[SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap Oleh: Arinadi Nur Rohmad Asalamualaikum.. Bagi yang seorang yang belum paham betul JQuery seperti saya, membuat Tab adalah pekerjaan yang cukup sulit..
Lebih terperinciSTMIK DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA.
STMIK SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 PENDAHULUAN Dreamweaver adalah sebuah program website editor yang berfungsi untuk membuat dan
Lebih terperinciPHP & MYSQL. Ingat, PC anda tidak memerlukan tambahan khusus atau apapun untuk melihat hasil eksekusi kode PHP anda. Mengapa?
Universitas Muhammadiyah Sukabumi Artikel PHP dan Mysql Oleh : dede sulaeman PHP & MYSQL PHP & MYSQL PHP itu apa sih? Penjelasan sederhananya adalah bahwa PHP merupakan sebuah program tambahan yang ada
Lebih terperinciMODUL GET DAN POST
MODUL 5-2015 GET DAN POST Daftar Isi Post dan Get Request 1 Isset dan Empty 5 Latihan 7 Post dan Get Request PEMBUKAAN Pada modul sebelumnya, kita telah mengenal proses assignment. Kita dapat mengassign
Lebih terperinci