Tutorial Ajax : Dasar atau Pengenalan Ajax

Sahabat Blog Kumpulan Tutorial Website yang budiman, Pernahkah anda mendengar kata ajaxdalam dunia pemrograman website ? saya harap anda semua sudah mengetahuinya, tapi buat yang belum tahu , jangan berkecil hati , karena disini saya akan mengulas mengenai apa sebenarnya ajax itu. Oke sudah siap ??? Let's Go to the TKP ...!!!

AJAX adalah singkatan dari Asynchronous JavaScript and XML. AJAX, terdiri dari HTML,Javascript, DHTML dan DOM yang kemudian digabungkan dengan bahasa pemograman web di sisi server seperti PHP dan ASP, sehingga membentuk suatu aplikasi berbasis web yang interaktif.

AJAX bukanlah bahasa pemograman baru, tetapi adalah teknik baru untuk membuat aplikasi web lebih baik, lebih cepat dan lebih interaktif.

Dengan AJAX, Javascript dapat langsung berkomunikasi dengan server dengan menggunakan objekXMLHttpRequest. Dengan objek ini, javascript dapat melakukan transaksi data denga server web, tanpa harus me-reloading halaman web tersebut secara keseluruhan.

Contoh nyata Penggunaan ajax dapat kita lihat pada salah-satu situs jejariangan sosial yang cukup terkenal yaitu Twitter. Tentu anda semua tahu atau pernah menggunakannya kan ? , jika belum ,, segera bertobat ,, hehehe,. Pernahkah anda perhatikan twitt dari semua orang atau perusahaan yang kita follow otomatis tampil bertambah dan bergantian pada walk twitter kita ? sementara kita belum ada me-reload halaman browser kita, itu semua adalah kerjaan ajax ini. Dengan ajax , kita tidak perlu lagi mereload halaman browser kita jika dalam website kita ada data yang bertambah atau berubah.

Untuk lebih jelasnya, anda dapat mengunduh tutorialnya pada link download dibawah ini. Tutorial ini dirangkum dalam sebuah file halaman PDF. Terimkasih

Download Tutorial 

sumber : http://kumpulantutorialwebsite.blogspot.com/2012/12/tutorial-ajax-dasar-atau-pengenalan-ajax.html
link download : http://uploaded.net/file/rkfxq3ai

Mudahnya Membuat Desain Web Dengan Twitter Bootstrap

Membuat desain website dengan Twitter Bootstrap memang cukup menarik, framework html & css ini semakin populer dan digemari karena memudahkan web designer dalam membuat layout, twitter bootstrap menggunakan sistem grid untuk pengaturan layout, tersedia juga fitur untuk membuat responsive website agar tampilan website bisa dibuka di mobile (Tablet PC/Handphone), selain itu Twitter bootstrap juga menyediakan kode-kode siap pakai yang bisa dengan mudah digunakan seperti tabel, tombol, form, dll.

Twitter Bootstrap  tercatat sebagai kode yang paling banyak di download diGithub  sekarang ini, komunitasnya pun semakin banyak dan terus berkembang. Tools yang berkaitan dengan kostumasi twitter bootstrap pun sangat banyak.

FYI: Website http://www.tutorial-webdesign.com ini juga dibuat dengan menggunakan Twitter Bootsrap

Namun dengan begitu banyaknya fitur yang dimiliki Twitter Bootstrap ternyata masih ada saja yang kurang puas, manusia memang selalu mencari cara agar semua bisa lebih praktis, walaupun sebenarnya twitter bootstrap sudah lumayan mempersingkat waktu.

Layoutit (http://www.layoutit.com )

Disini Tutorial Web Design akan memperkenalkan sebuah website yang akan semakin mempermudah anda untuk bekerja dengan twitter bootstrap.

Bisa di coba seperti dibawah ini :

Tutorial Berseri Part 2 "Membuat Aplikasi Web Mobile Denga Jquery Mobile

Melanjutkan tutorial yang sebelumnya kita akan mecoba membuat Sebuah header  dan footer. Gaya desain pada aplikasi ini seperti  aplikasi IOS yang   populer  pada pengguna  App Store ponsel Apple. JQ Mobile dapat menggunakan atribut-atrbut yang digunakan untuk mendefinisikan header, footer, dan konten halaman. Mari kita lihat sekilas lokasi lokasi kontentnya . Ohh yah sebelumnya saya sudah membuat tutorial part 1 nya untuk belajar dasarnya bisa dilihat pada materi sebelumnya.

Langkah 1 Membuat Tombol Top Bar 

Secara default bar bagian atas mendukung satu set dari dua (2) link dengan cara yang sama untuk aplikasi mobile lainnya. Pada  IOS default  menggunakan tombol "back"  ada disebelah kiri dan seringkali  "Option" atau "config"  ada di sebelah kanan. untuk membuat tombol ini kita tinggal menambah sedikit skrip saja. 

<div data-role="page" id="setting" data-add-back-btn="true">  

<header data-role="header">  

        <a href="index.html" data-icon="gear" data-theme="b" class="ui-btn-right">Settings</a>  

        <h1>Halaman Pengaturan</h1>  

 </header>

</div>

Berikut hasilnya : 

Tutorial Berseri Part 1 'Membuat Aplikasi Web Mobile Dengan Jquery Mobile'

Pernah melihat tampilan-tampilan cantik twitter atau facebook versi mobile di smart handphone anda. Ketika dulu saya  melihatnya saya pikir itu adalah fitur yang dihasilkan oleh smarthandphone saya... tapi setelah saya coba pelajari ternyata tidak ada yang sepesial dengan apa yang ada di smartphone saya. yang spesial dan menurut saya baru adalah penggunaan teknologi JQuery unntuk Web mobile.  fitur ini menyediakan kerangaka kerja yang sangat mudah digunakan yang meliputi animasi, efek transisi, dan otomatis CSS gaya untuk elemen HTML dasar. Dalam panduan ini saya berharap untuk memperkenalkan platform yang nyaman dalam  merancang aplikasi web mobile anda dengan  jQuery. 

Fitur -Fitur :
Kenapa saya sarankan belajar  jQuery Mobile dari pada  framework lainnya karena kesederhanaan dari framework ini. Kode ini dibangun oleh jQuery dan terus dikembangkan oleg pengembangnya secara aktif untuk memperbaiki bug-bug yang ada di aplikasi ini. Banyak fitur yang ditawarkan dalam framework ini termasuk dukungan HTML5, Ajax-powered navigasi link, dan sentuhan/atau navigasi gesekan.
Berikut adalah Daftar OS yang mendukung untuk jquery mobile.

Dukungan untuk framework ini  bervariasi antara ponsel dan yang laianya secara umum  dibagi menjadi grafik dari 3 kategori dari A sampai C : 

A adalah tingkat atas yang menawarkan dukungan penuh dari jQuery Mobile, 
B memiliki semuanya kecuali Ajax sedangkan 
C adalah HTML dasar dengan sedikit-untuk-tidak JavaScript.  dan beberapa merk smarthanphone sudah menggunakan tingkatan 3.

Perlengkapan perang :
1. Silahkan download Jquery mobilenya disini http://jquerymobile.com/
2. Pastikan sebelum anda belajar sudah mengerit tentang html dan css.. ga perlu advance.

Aplikasi Pertama Kita ..?

Aplikasi pertama yang akan kita buat adalah aplikasi dasar uttuk perancagan halaman HTML dengan memanfaatkan Jquery Mobile.  Untuk tutorial ini akan saya bikin step by step jadi tetap sering lihat lihat blog saya.. untuk tutorial ini akan terus kita sambung.

Langkah 1
Silahkan buat file html anda.. oh yah untuk anda yang belajar tutorial ini sayang  anggap sudah mengenal konsep pemograman web.

Langkah 2 
silahkan buat skrip seperti dibawah ini

Tutorial Membuat Web dengan Codeigniter

Codeigniter – Membangun sebuah website akan lebih mudah jika menggunakan framework, karena di dalamnya tersedia standard dalam melakukan koding dan menggunakan fungsi-fungsi tertentu.

Codeigniter adalah salah satu framework yang paling banyak digunakan untuk mengembangkan sebuah website. Menurut pengalaman saya, mengembangkan website dengan Codeigniter memang jauh lebih mudah ketimbang harus melakukan koding dari awal. Ditambah lagi, Codeigniter termasuk salah satu framework yang mudah dipelajari.

Tutorial Membuat Web dengan Codeigniter

Berikut ini adalah kumpulan tutorial untuk membuat web dengan codeigniter. Tutorial ini ditulis per bagian sesuai fokus dari fungsi yang akan dibuat.

1. Pengertian MVC di Codeigniter
2. Konfigurasi Awal CodeIgniter
3. Desain Database CodeIgniter
4. Insert Data User ke Database
5. Menampilkan Data dari Database
6. Delete Record Codeigniter
7. Update Database di Codeigniter
8. Validasi Form Codeigniter
9. Membuat Halaman Login Form Menggunakan Codeigniter
10. Membuat Kategori Menggunakan CodeIgniter
11. Membuat Insert Post Web Menggunakan CodeIgniter
12. Upload File Menggunakan CodeIgniter
13. on going…

Semoga bermanfaat.

Membuat AplikasiWeb dengan CodeIgniter

Simatik adalah aplikasi web yang saya buat dengan menggunakan Codeigniter. Aplikasi tersebut sebenarnya adalah tugas kuliah yang saya buat berupa sistem informasi sekolah. Di dalam nya terdapat beberapa fungsi standar dari sebuah website sekolah seperti:

Cara Membuat Website Dengan Jquery Mobile

Pada tutorial sebelumnya saya sudah jelaskan tentang Cara membuat website versi mobile dengan menggunakan html standar. Sekarang saya akan coba jelaskan cara membuat website mobile mengguanakan jquery mobile. Mengapa pembahasan ini penting? karena jquery mobile sangat bagus tampilannya. Sudah disesuaikan dengan perangkat mobile terbaru seperti iphone dan android. Jadi jika pengunjung situs kita akan merasa nyaman.

Baiklah begini caranya: