Sebelum masuk pada pembahasan mengenal perbedaan jquery dan jquery UI saya akan memberikan penjelasan tentang apa itu jquery, jquery merupakan framework dari javascript, bisa dibilang jquery merupakan libary javascript. Dan apa yang dimaksud dengan framework dan libary , oke untuk framework sendiri merupakan sebuah kerangka kerja yang sudah siap pakai tanpa kita membikinnya dari nol, untuk libary disini hampir sama dengan framework libary adalah kode siap pakai yang langsung bisa kita terapkan. Sedangkan Jquery UI sendiri adalah plugin dari sebuah jquery itu sendiri yang sudah disiapkan untuk membuat efek-efek tertentu dalam sebuah website. Karena Jquery UI adalah bagian tambahan dari Jquery, maka kita tidak bisa menggunakan Jquery UI sendiri tanpa jquery.
Oke , langsung saja kita praktik untuk lebih jelasnya tentang mengenal perbedaan jquery dan jquery UI di sini saya akan mengasih contoh membuat datepicker. Pertama-tama buat folder latihan dengan nama bebas pada folder htdocs. Lalu teman – teman masuk ke dalam  https://jqueryui.com/datepicker/  lalu copy jquery.js, jquery-ui.min.js dan jquery-ui.min.css kedalam folder teman – teman . Selanjutnya didalam folder teman – teman silahkan buat file baru dengan nama index.html. Buat kode seperti berikut dalam text – editornya ;
<html>
<head>
</head
<body>
</body>
</html>
Selanjutnya kita akan memasang komponen jquery di file kita tadi dengan menambahkan script di bawah ini tepat di antara tag <head> dan </head>
<link rel="stylesheet" href="jquery-ui.min.css"> <script src="jquery.js"></script> <script src="jquery-ui.min.js"></script>
Oke kalau sudah memasukan file ketiga di atas, teman – teman dapat menambahkan widget Jquery datepicker . Karena kita akan membuat widget datepicker. selanjutnya teman – teman silahkan copy paste di bawah ini:
<input type="text" name="date" id="date">
script di atas kita tempatkan pada diantara tag <body> dan tag </body> . Lalu masukan script di bawah ini pada bagian tag <head> dan </head> ;
<script>
$(function() {
$( "#date" ).datepicker();
});
</script>
Oke untuk lebih jelasnya saya akan memberikan script seluruhnya;
<!DOCTYPE html>
<html>
<head>
<title> Mengenal Perbedaan Jquery Dan Jquery UI</title>
<link rel="stylesheet" href="jquery-ui.min.css">
<script src="jquery.js"></script>
<script src="jquery-ui.min.js"></script>
<script>
$(function() {
$( "#date" ).datepicker();
});
</script>
</head>
<body>
<input type="text" name="date" id="date">
</body>
</html>
Oke kalau sudah silahkan save dan jalankan pada browsernya maka hasilnya akan seperti di bawah ini
Oke pada dasarnya inti dari Jquery UI adalah plugin dari sebuah jquery itu sendiri. Jquery UI tidak bisa digunakan tanpa bantuan Jquery. Oke itulah dasar penerapan Jquery UI dengan widget Datepicker. Selain Date picker masih banyak lagi silahkan teman – teman kunjungi di https://jqueryui.com/datepicker/   semoga bermanfaat.