Monday, January 23, 2017

JQuery Part 1 : Pengertian Dan Cara Menggunakan JQuery


Setelah mempelajari sebelumnya kita telah mempelajari javascript sekarang kita akan bahas kelanjutan dari javascript. Sobat pasti sering mendengar JQuery dan tidak tau apa itu JQuery ? Pada tutorial Belajar JQuery Part 1 ini akan dijelaskan apa itu JQuery dan bagaimana cara menggunakanya.

PENGERTIAN
JQuery adalah library framework Javascript. Jadi singkat cerita JQuery merupakan pengembangan dari javascript yang sengaja dibuat untuk memudahkan kita ketika mendevelop sebuah website dan ingin membuat efek-efek dan keperluan penggunaan javascript lainya didalam pengembangan sebuah website. Sampai saat ini JQuery sudah dikenal di dunia web programing. Sehingga banyak sekali plugin-plugin web lainya yang dibangun menggunakan JQuery. Contohnya seperti plugin Kalender, Grafik, Export HTML to Image, Design komponen web dan sebagainya

jQuery dikembangkan pertama kali oleh John Resig di tahun 2006. Sejak saat itu, jQuery berkembang menjadi proyek opensource dan menjadi libary JavaScript paling populer di dunia. Situs resmi jQuery beralamat di jquery.com

LATAR BELAKANG
Hampir semua developer dunia sekarang sudah aktif menggunakan JQuery sebagai pengganti javascript. Artinya developer tidak perlu khawatir mengetikkan syntax javascript yang terbilang cukup panjang dan agak rumit untuk membuat sebuah event. Oleh karna itu banyak yang aktif menggunakan JQuery karena JQuery adalah kembangan dari javascript.

MAKSUD DAN TUJUAN
Seiring berkembangnya web programming kita akan semakin dimudahkan dalam pembuatan sebuah syntax javascript salah satunya JQuery. JQuery memiliki semboyan " Write Less , Do More " yang berarti kesederhanaan dalam penulisan kode, tapi dengan hasil yang banyak. Jadi tujuan dari JQuery ini memudahkan kita dalam penulisan javascript dengan hasil yang memuaskan

Sebagai contoh, untuk mencari sebuah element HTML, dengan JavaScript kita menggunakan fungsi getElementById():

var x = document.getElementById("tombol");

Dengan jQuery, penulisannya jauh lebih singkat:
var x = $("#tombol");

KELEBIHAN JQUERY
Berikut ini adalah kelebihan dari JQuery yang saya rasakan sendiri ketika menggunakan framwork ini. Dan kelebihan-kelebihan ini akan sobat rasakan ketika menggunakan framework JQuery . Berikut adalah kelebihan dari JQuery
  • Lebih mudah dimengerti
  • Lebih mudah digunakan
  • Ringan
  • Free / Gratis
  • Memiliki penulisan yang simple tetapi memiliki kebergunaan yang besar
  • Bisa dikemabangkan untuk membuat plugin pada website
  • Memiliki hasil yang bagus

CARA MENGGUNAKAN JQUERY
Ada beberapa cara untuk menggunakan JQuery , berikut cara-caranya
  • Menggunakan JQuery secara offline
    Dengan cara ini kita mendownload file jQuery lalu menghubungkan file html atau php dengan JQuery
  • Menggunakan JQuery secara online
    Maksudnya adalah Menghubungkan file html atau php dengan link online jquery dari website resminya

MENGGUNAKAN JQUERY SECARA OFFLINE
Untuk sobat yang jarang tersambung dengan koneksi internet lebih efektik menggunakan cara ini karena sobat hanya perlu mendownload file JQuery nya lalu menaruhnya di dalam file project sobat dan menghubungkanya. Cara menghubungkan file JQuery sama dengan menghubungkan file Javascript lainya. Silahkan kunjungi website resminya jquery.com dan silahkan download atau alternatifnya Klik Disini .

Jika sudah didownload letakkan dalam satu file project sobat. Pada tutorial kali ini saya meletakkan filenya di /media/Local_Disk/Pembelajaran/Javascript/jQuery ( Linux ) . Karena pada tutorial kali ini saya menggunakan file berektensi html jadi saya bebas meletakkanya dimana saja, jika sobat menggunakan PHP letakkan saja di localhost sobat

Pada contoh kali ini saya menggunakan file index.html
index.html

<!DOCTYPE html>
<html>
<head>
    <title>Tutorial belajar JQuery Part 1 : Pengertian dan cara menggunakan jquery</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript" src="jquery.js"></script>
</head>
<body>

</body>
</html>

Bisa diperhatikan pada contoh diatas menghubungkan JQuery secara offline adalah dengan syntax berikut
<script type="text/javascript" src="lokas file jquery"></script

MENGGUNAKAN JQUERY SECARA ONLINE
Seperti pada situs resminya Untuk menghubungkan file html atau php dengan Jquery secara online menggunakan cara seperti berikut :
<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
Ketika menggunakan cara ini sobat harus terhubung dengan internet karena file terletak di server jquery

Atau juga bisa menghubungkan file jquery bukan lewat website resminya tetapi menghubungkanya dengan link yang disediakan google
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

Atau JQuery yang disediakan oleh microsoft
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.3.min.js"></script>

KESIMPULAN
Jadi JQuery adalah sebuah library framework javascript yang berfungsi untuk memudahkan kita dalam penulisan javascript tetapi memilki hasil yang menarik inilah JQuery . Special thanks untuk para pengembang JQuery karena sudah memberikan framework ini secara gratis. Sekian tutorial kali ini akan dilanjutkan pada tutorial berikutnya


EmoticonEmoticon