Membangun Web berbasis mobile dengan perangkat Mobile

Latar belakanag

Perkembangan dunia informasi dan teknologi sangat cepat. Website adalah satu wadah yang memudahkan untuk mengirim informasi dan mencari informasi. Website tidak asing lagi bagi individu dan kelompok. Ini juga di gunakan oleh perusahan.

Selain keuntungan tersebut, keistimewaan lain  website adalah kemudahan akses atau pengoperasiannya yang dapat dilakukan siapapun mulai dari anak-anak sampai orang dewasa. Maka tidak mengherankan jika aplikasi java telah menjadi konsumsi publik sebagaian besar masyarakat Indonesia.

 

Keberadaan aplikasi website  telah menghadirkan nuansa tersendiri di tengah
masyarakat karena selalu mengikuti kemajuan teknologi. Peningkatan fasilitas
demi menambah kepuasan pelanggan menjadi sisi yang paling ditonjolkan. Hal ini
tentu saja semakin memantapkan posisinya sebagai bagian kebutuhan masyarakat. Ia telah menjadi bagian hidup masyarakat masa kini.

 

Salah satunya website yang berbasis mobile atau mobile web. Membangun sebuah website perlu adanya aplikasi dukungan seperti jquery, html5, java script dan yang sekarang merupakan kebutuhan bagi seluruh penguna website terutama yang mudah di akses diaman saja, kapan saja. Kali saya akan sedikit menjelaskan tentang apa itu jquery dan cara singkat membuat website dengan perangkat  mobile.

 

Rumusan masalah

Membahasa Mengenai Pengertian Jquery?

History jquery.?

Development website mobile.?

 

 

 

 

 

Pengertian Jquery

JQuery merupakan suatu framework (library) Javascript yang menekankan bagaimana interaksi antara Javascript dan HTML. JQuery pertama kali dirilis pada tahun 2006 oleh John Resig. Pada perkembangannya JQuery tidak sekedar sebagai framework Javascript, namun memiliki kehandalan dan kelebihan yang cukup banyak. Hal tersebut menyebabkan banyak developer web menggunakannya. JQuery memiliki slogan “Write less, do more” yang kurang lebih maksudnya adalah kesederhanaan dalam penulisan code, tapi dengan hasil yang lebih banyak.

JQuery merupakan library open source dengan lisensi GNU General Public License dan MIT License. Dari sisi ukurannya, framework JQuery sungguh ramping, hanya sekitar 20 KB dan hanya terdiri dari satu file. Namun demikian, bagi yang menginginkan fungsi lebih, JQuery memungkinkan penambahan fungsionalitas dalam bentuk plugin. Saat ini tersedia ribuan plugin yang dapat diperoleh secara gratis di internet.

Apa yang bisa dilakukan dengan JQuery?

1. Mengakses bagian halaman tertentu dengan mudah.

Tanpa adanya library Javascript khusus, untuk mengakses suatu bagian tertentu dari halaman, harus mengikuti aturan Document Object Model (DOM) dan pengaksesan harus secara spesifik menyesuaikan dengan struktur HTML. Dengan kata lain, pengaksesan bagian tertentu dari halaman sangat tergantung pada struktur dari HTML. JQuery menawarkan cara yang mudah (bahkan sangat mudah) dalam mengakses bagian tertentu dari halaman. Pengaksesan juga tidak terlalu bergantung pada struktur HTML.

2. Mengubah tampilan bagian halaman tertentu.

CSS (Cascading Style Sheet) menawarkan metode yang cukup handal dalam mengatur dan mempercantik halaman web. Namun terkadang CSS punya kelemahan yang cukup mengganggu, yaitu beberapa perintah CSS tidak didukung oleh semua browser. Cukup merepotkan jika kita harus mendesign halaman web dengan beberapa CSS sekaligus. Sekali lagi JQuery menawarkan solusi untuk mengatasi hal tersebut. Dengan JQuery, “kesenjangan” yang terjadi antara browser dalam urusan CSS akan tertutup dengan baik.

3. Mengubah isi dari halaman.

Jaman dulu (baca:sebelum JQuery lahir) cukup sulit jika kita akan mengubah sebagian isi dari halaman. Mengubah disini dapat berarti mengganti teks, menambahkan teks atau gambar, mengurutkan suatu daftar (list), menghapus baris tabel dan sebagainya. Dengan JQuery, hal tersebut dapat dilakukan dengan hanya beberapa baris perintah.

4. Merespond interaksi user dalam halaman.

Website yang baik tidak cukup digambarkan dengan user-interface dan tampilan yang memukau. Namun lebih dari itu, bagaimana pengunjung dapat berinteraksi dengan website dan dapat mengatur tampilannya sendiri. Interaktivitas sangat bergantung bagaimana pemrograman yang dipakai dalam menangani event-handling. Javascript sendiri memiliki beberapa event-handling seperti onclick untuk menangani event saat terjadi click. Namun demikian, event handling pada Javascript terbatas pada object-object tertentu, dan jenisnya pun terbatas. JQuery melengkapi semuanya dengan tambahan penanganan event-handling yang semakin mudah.

5. Menambahkan animasi ke halaman.

Animasi seringkali disertakan dalam suatu halaman web untuk menambah kecantikannya. Saat ini animasi masih cukup digemari oleh para peselancar situs. Animasi dapat dibuat dalam berbagai gaya, ada yang menggunakan Flash, gambar bergerak (GIF), video, dan sebagainya. Masing-masing tentu memiliki kelebihan dan kekurangan masing-masing. JQuery sendiri menawarkan konsep animasi (walaupun masih sederhana) yang cukup apik namun ramah bandwidth alias ringan. Salah satu animasi yang bisa dibuat dengan JQuery adalah fading jika terdapat suatu bagian dari halaman ditambahkan atau dihilangkan.

6. Mengambil informasi dari server tanpa me-refresh seluruh halaman.

Mengambil informasi dari server tanpa refresh halaman merupakan salah satu konsep dasar dari yang namanya AJAX (Asynchronous Javascript and XML). Pada penerapannya, cukup ribet jika harus membangun website dengan konsep AJAX, saat ini banyak library khusus yang berusaha mempermudahnya. JQuery merupakan salah satunya.

7. Menyederhanakan penulisan Javascript biasa.

Semboyan JQuery adalah “Write less, do more” atau dengan kata lain kesederhanaan dalam penulisan code, tetapi menghasilnya tampilan yang lebih. Sebenarnya inilah yang menjadi daya tarik tersendiri buat para pengembang web untuk menggunakan JQuery.

Download JQuery

Situs resmi JQuery dapat diakses di http://jquery.com/. Dan library JQuery dapat didownload di alamat http://docs.jquery.com/Downloading_jQuery. Tersedia library jQuery dalam 2 (dua) jenis yaitu minified dan uncompressed. Minified jika kita ingin menggunakannya saja dalam website kita (ukuran 18 KB), sedangkan uncompressed jika kita berkeinginan turut serta mengembangkan code jQuery.

Contoh Sederhana JQuery

 contoh jquery

Penjelasan Program

Pertama, kita harus menyertakan (include) file library JQuery. Pastikan letak dari file library sudah benar.

Perintah-perintah JQuery.

Baris 8 merupakan perintah inisialisasi dimana saat halaman (dokumen) siap ditampilkan maka jalankan juga perintah yang ada di dalamnya. Hal ini mirip dengan event onLoad yang biasanya diletakkan di tag .

Baris 9-11 maksudnya adalah mendefinisikan action yang terjadi saat link dengan class=show ( $(‘a.show’) ) diklik (lihat link baris ke-22). Jadi jika link di-klik maka paragraf dengan nama class=jquery ( $(‘p.jquery’) ) akan tampil dengan durasi tampil “slow”. Paragraf yang akan ditampilkan adalah paragraf baris ke-24 sampai 27.

Baris 13-15 sebaliknya, akan menyembunyikan isi dari paragraf yang mengandung nama class=jquery.

Isi dari halaman. Perhatikan nama class dari masing-masing object.

 

Referensi :

Jonathan Chaffer, Karl Swedberg, Learning JQuery, Packt Publishing, 2007

http://jquery.com/

http://en.wikipedia.org/wiki/Jquery

http://didats.net/page/belajar-javascript-lebih-lanjut-dengan-jquery-1/

http://bagindokemas.com/2008/12/21/berkenalan-dengan-jquery/

 

 

Sejarah

2013

Maret

·         1 Maret 2013 - jQuery 2.0 Beta 2 Dirilis

Februari

·         20 Februari 2013 - jQuery Mobile 1.3.0 Dirilis

·         15 Februari 2013 - jQuery Learning Center

Januari

•        24 Januari 2013 - QUnit 1.11 Rilis: A Look Kembali (dan Forth)

•        23 Januari 2013 - Open Content & Desain Datang ke jQuery

•         17 Januari 2013 - jQuery 1.10.0 Dirilis

•        16 Januari 2013 - jQuery Plugin Registry

•        15 Januari 2013 - jQuery 1.9 Akhir, jQuery 2.0 Beta, jQuery Migrasi Akhir Dirilis

•        14 Januari 2013 - The State of jQuery 2013

2012

November

•        23 November 2012 - jQuery Color 2.1.1 Dirilis

•        13 November 2012 - jQuery 1.8.3 Dirilis

Oktober

•        29 Oktober 2012 - jQuery Developer Summit Rekap

•        8 Oktober 2012 - jQuery UI 1.9.0 Dirilis

•        2 Oktober 2012 - jQuery Mobile 1.2.0 Dirilis

September

•        28 September 2012 - jQuery UI 1.8.24 Dirilis

•        20 September 2012 - jQuery 1.8.2 Dirilis

Agustus

•        30 Agustus 2012 - jQuery 1.8.1 Dirilis

Juli

•        4 Juli 2012 - Sizzle pemilih menulis ulang mesin

Juni

•        28-29 Juni, 2012 - jQuery Conference 2012 San Francisco

•        28 Juni 2012 - jQuery UI 1.9 beta dirilis

April

•        30 April 2012 - Twentieth Maintenance Release untuk jQuery UI 1.8

•        13 April 2012 - jQuery Mobile 1.1 dirilis

Maret

•        21 Maret 2012 - jQuery 1.7.2 dirilis

•        6 Maret 2012 - jQuery Yayasan Diumumkan

Februari

•        12 Februari 2012 - jQuery Inggris Konferensi

2011

Desember

•        13 Desember 2011 - jQuery Plugin situs redesign mulai

November

•        28 November 2011 - jQuery Mobile Memenangkan Penghargaan bersih.

•        18 November 2011 - jQuery Dewan Diumumkan

•        16 November 2011 - jQuery Mobile 1.0 dirilis

•        15-16 November 2011 - jQuery Summit 2011

•        15 November 2011 - jQuery Mobile menang 2011 Packt Publishing Open Source Penghargaan

•        3 November 2011 - jQuery 1.7 dirilis

Oktober

•        24 Oktober 2011 - jQuery Standards Tim Diumumkan

•        01-02 Oktober 2011 - jQuery Konferensi Boston 2011

September

•        29 September 2011 - jQuery Mobile 1.0 RC1 dirilis

•        12 September 2011 - jQuery 1.6.4 dirilis

•        1 September 2011 - jQuery 1.6.3 dirilis

Juni

•        30 Juni 2011 - jQuery 1.6.2 dirilis

•        20 Juni 2011 - jQuery Mobile Beta dirilis

Mei

•        31 Mei 2011 - jQuery Plugin warna v2 Beta dirilis

•        12 Mei 2011 - jQuery 1.6.1 dirilis

•        3 Mei 2011 - jQuery 1.6 dirilis

April

•        26-27 April 2011 - jQuery Conference 2011 - SF Bay Area

Februari

•        24 Februari 2011 - Kesepuluh Pemeliharaan Rilis untuk jQuery UI 1.8

Januari

•        31 Januari 2011 - jQuery 1.5 dirilis,. $ Rewrite ajax, objek tangguhan diperkenalkan

2010

November

•        23 November 2010 - jQuery UI API redesign mengumumkan

•        23 November 2010 - jQuery menang 2010 Packt Publishing Open Source Penghargaan

•        16-17 November 2010 - jQuery Summit 2010

•        11 November 2010 - jQuery 1.4.4 dirilis

Oktober

•        16-17 Oktober 2010 - jQuery Konferensi Boston

•        16 Oktober 2010 - jQuery 1.4.3 dirilis

•        16 Oktober 2010 - jQuery Mobile Alpha dirilis

•        15 Oktober 2010 - Julian Aubourg dimulai $ ajax menulis ulang untuk jQuery 1.5.

September

•        4 September 2010 - jQuery podcast memiliki rumah baru

Agustus

•        14 Agustus 2010 - jQuery UI 1.8.4 dirilis

•        13 Agustus 2010 - The jQuery Proyek Bangga Umumkan Proyek Ponsel jQuery

Juli

•        21 Juli 2010 - jQuery Proyek mensponsori Scott González untuk bekerja pada jQuery UI

April

•        24-25 April 2010 - Konferensi jQuery Bay Area di Mountain View, CA

Maret

•        23 Maret 2010 - jQuery UI 1.8 menambahkan posisi, tombol, autocomplete, baru widget pabrik, inti ringan

•        16 Maret 2010 - Microsoft untuk Perluas Kerjasama dengan Komunitas jQuery

Februari

•        19 Februari 2010 - release Pemeliharaan: jQuery 1.4.2 Dirilis

Januari

•        25 Januari 2010 - release Pemeliharaan: jQuery 1.4.1 Dirilis

•        21 Januari 2010 - jQuery.org dirilis

•        20 Januari 2010 - New jQuery Forum dirilis

•        14 Januari 2010 - jQuery 1.4 dirilis

•        14 Januari 2010 - 14 Days of jQuery mulai

•        8 Januari 2010 - Browser API baru dirilis

2009

Desember

•        3 Desember 2009 - jQuery memenangkan Penghargaan Majalah Net untuk Best Open Source Application.

•        November

•        19 November 2009 - The jQuery Summit secara online berlangsung

•        13 November 2009 - Episode pertama dari jQuery Podcast diterbitkan

September

•        12-13 September 2009 - Konferensi jQuery di Boston, MA

•        11 September 2009 - jQuery bergabung dengan Software Freedom Conservancy

Maret

•        6 Maret 2009 - jQuery UI 1.7 rilis: domain baru, New CSS Kerangka & Drama Update

•        Februari

•        20 Februari 2009 - release Pemeliharaan: jQuery 1.3.2 Dirilis

•        Januari

•        21 Januari 2009 - Perbaikan Bug rilis: jQuery 1.3.1 Dirilis

•        14 Januari 2009 - ulang tahun ke-3 dari jQuery, jQuery 1.3 dirilis, Sizzle.js dirilis 2008

2008

September

•        28 September 2008 - Microsoft dan Nokia mengumumkan dukungan mereka untuk jQuery

•        28 September, 2008-2008 jQuery Konferensi di Boston, MA

•        Agustus

•        28 Agustus 2008 - situs jQuery redesign

Juli

•        14 Juli 2008 - jQuery UI 1.5.2

Juni

•        2 Juni 2008 - jQuery UI 1,5 rilis kandidat, kita semakin bersemangat

•        Mei

•        24 Mei 2008 - 1.2.6 jQuery

•        21 Mei 2008 - jQuery 1.2.5: Perbaikan untuk membangun buruk 1.2.4

•        19 Mei 2008 - jQuery 1.2.4: bug memperbaiki rilis

•        9 Mei 2008 - kerangka pengujian QUnit mendapat rilis awal

•        5 Mei 2008 - situs baru jQuery UI: UI 1.5b4 dan efek baru

Februari

•        8 Februari 2008 - jQuery 1.2.3: AIR, Namespacing, dan UI Alpha

Januari

•        15 Januari 2008 - jQuery 1.2.2: 2nd Birthday Present

2007

September

•        17 September 2007 - New pengguna perpustakaan antarmuka untuk jQuery: jQuery UI: Interaksi dan Widget

•        16 September 2007 - Perbaikan Bug untuk jQuery 1.2: jQuery 1.2.1: Perbaikan Cepat untuk 1,2

•        10 September 2007 - jQuery 1.2 dirilis: jQuery 1.2: jQuery.extend ("Awesome")

Agustus

•        24 Agustus 2007 - jQuery 1.1.4: Lebih Cepat, Lebih Tes, Siap untuk 1,2

Juli

•        5 Juli 2007 - Perbaikan Bug untuk jQuery 1.1.3: jQuery 1.1.3.1

•        1 Juli 2007 - Versi baru dari jQuery dirilis: jQuery 1.1.3: 800% + Cepat, masih 20KB

•        1 Juli 2007 - Pengumuman UI modul baru yang sedang dikembangkan: jQuery UI

Juni

•        18 Juni 2007 - Plugin Baru Repository

Mei

•        20 Mei 2007 - bug fix uji rilis ketiga untuk 1.1: jQuery 1.1.3a

April

•        2 April 2007 - Mailing list pindah ke Google Groups, kode sekarang diselenggarakan oleh Amazon S3

Maret

•        11 March Juni 2007 - 11 orang menghadiri jQuery meetup pertama di SXSWi

Februari

•        27 Februari 2007 - Kedua bug fix rilis untuk 1.1: jQuery 1.1.2

Januari

•        22 Januari 2007 - Pertama rilis bug fix untuk versi baru: jQuery 1.1.1

•        14 Januari 2007 - jQuery Ulang Tahun: 1.1, New Site, New Docs

•        11 Januari 2007 - rilis Beta dari jQuery 1.1: 1.1b jQuery

•        8 Januari 2007 - Alpha rilis versi baru: 1.1a jQuery

2006

Desember

•        7 November 2006 - Pemenang kontes tombol jQuery mengumumkan: Button jQuery Pemenang Lomba

•        12 Desember 2006 - Terakhir bug fix rilis untuk 1.0: jQuery 1.0.4

November

•        27 Desember 2006 - Perencanaan jQuery 1.1: Jalan Menuju 1.1

Oktober

•        27 Oktober 2006 - Ketiga bug fix rilis untuk 1.0: jQuery 1.0.3

•        9 Oktober 2006 - Kedua bug fix rilis untuk 1.0: jQuery 1.0.2, dengan perubahan API minor

September

•        22 September 2006 - Visual jQuery Magazine rilis: Visual jQuery Magazine Dirilis

•        7 September 2006 - Pertama disponsori pengembang bergabung dalam proyek ini: Pengembangan jQuery Sponsor

•        2 September 2006 - versi XML API dirilis: Mengambil Dokumentasi jQuery ke tingkat berikutnya

Agustus

•        31 Agustus 2006 - Pertama rilis bug fix untuk 1.0: jQuery 1.0.1

•        26 Agustus 2006 - versi stabil pertama dari jQuery: jQuery 1.0

Juni

•        30 Juni 2006 - jQuery 1.0 - Alpha Rilis

•        23 Juni 2006 - Perencanaan untuk jQuery 1.0: The Road to 1.0

Mei

•        29 Mei 2006 - jQuery tersedia melalui SVN: SVN Akses ke jQuery

•        27 Mei 2006 - jQuery bergerak di bawah lisensi MIT: jQuery di bawah lisensi MIT

April

•        24 April 2006 - Thickbox dirilis: Thickbox

Maret

•        21 Maret 2006 - Perbaikan bug dan fitur baru: Accordion, nilai-nilai, oncomplete, dan perbaikan bug!

Februari

•        26 Februari 2006 - Ajax ditambahkan ke jQuery: Ajax, fx baru, dan banyak lagi!

•        23 Februari 2006 - fix release Bug: Bugs Squished, Ajax di jalan

Januari

•        27 Januari 2006 - jQuery Mailing List mengatur: jQuery Mailing List

•        25 Januari 2006 - jQuery Plugin Pertama Dibangun: jQuery Plugin Pertama

•        24 Januari 2006 - jQuery Blog mengatur: jQuery Blog

•        14 Januari 2006 - jQuery Diumumkan di BarCampNYC: BarCampNYC Wrap-up - Pengumuman membuat halaman depan del.icio.usand Digg

2005

Agustus

•        22 Agustus 2005 - John petunjuk pertama dari sebuah perpustakaan JavaScript untuk menggunakan penyeleksi CSS dengan sintaks lebih ringkas daripada perpustakaan yang ada: Selectors di JavaScript

 

 

Kelebihan dan Kekurangan Jquery

Pengertian Kelebihan Kelemahan Jquery

Pengertian, Kelebihan dan Kekurangan Jquery - Pengertian Jquery adalah sebuah framework yang berbasiskan Javascript. JQuery sama dengan Javascript Library yaitu kumpulan kode atau fungsi Javascript siap pakai, sehingga mempermudah dan mempercepat dalam pembuatan Javascript atau framework yang mampu menyederhanakan penulisan kode dengan hasil yang lebih baik "Write less, do more". Baca juga: Cara Menyimpan Javascript Di Google Code

JQuery pertama kali dirilis pada tahun 2006 oleh John Resig. Lantas Seperti apakah web berbasis jquery? untuk mengambil contoh web yang berbasi jquiery adalah Google, Facebook, Twitter, Youtube, Nokia, VivaNews, Studio 21, Kompas atau bisa cek di situs resminya http://docs.jquery.com/Sites_Using_jQuery. Nah sekarang pertanyaannya adalah: Apa saja kelebihan jquery?, Apa kelemahan jquery? dan Bagaimana cara kerja jquery?

 

Mengapa web besar memimilih menggunakan jquery?

Untuk menjawab perntanyaan seperti itu, ada beberapa kelebihan jquery di bawah ini untuk membantu menjawab kenapa memilih jquery tersebut.

Kelebihan JQuery

±  Kompatibel dengan hampir seluruh browser

±  jQuery telah digunakan oleh website-website raksasa

±  Kompatibel dengan seluruh versi CSS (dari CSS 1 sampai CSS 3)

±  Dokumentasi dan tutorialnya lengkap, bisa langsung dilihat di http://jquery.com

±  Didukung oleh banyak komunitas

±  Disupport oleh plugin yang lengkap

±  Filenya hanya satu dan ukurannya relatif kecil, sekitar 20kb

±  Open source atau Free

±  jQuery lebih diminati oleh para developer web saat ini

±  Mempermudah akses dan manipulasi elemen tertentu pada dokumen.

±  Mempermudah modifikasi/perubahan tampilan halaman web.

±  Mempersingkat Ajax (Asynchronous Javacsript and XML).

±  Memiliki API (Application Programming Interface).

±  Mampu merespon interaksi antara user dengan halaman web dengan lebih cepat.

±  Menyediakan fasilitas untuk membuat animasi sekelas Flash dengan mudah.

±  Kekurangan JQuery

 

Kalau dibagian atas berbicara tentang kelebihan yang dimiliki jquery, maka dibawah ini adalah kelemahan jquery.

Meskipun diklaim jquery memiliki beban kerja yang ringan (load CPU dan RAM) untuk browser, tetap saja lebih ringan (cepat di-load) website yang tidak menggunakan jquery, alias HTML murni.

Dari sisi server hosting pun, CPU dan RAM harus mengalokasikan resource yang mereka miliki untuk menangani request terhadap jquery. Pada level tertentu request yang sangat banyak (sangat-sangat banyak) akan membebani server. Solusi: host jquery pada situs lain, seperti Google yang menyediakan request jquery dari servernya.

 

makalah lebih lengkapnya download saja

disini