Her donation please

Followers

doni hardiawan. Powered by Blogger.

Archive

Tips Menghindari Jebakan Toko Saat Merakit PC

PC merupakan salah satu mesin yang paling seru untuk digunakan dalam bermain game . PC tidak hanya digunakan untuk bermain game, namun PC merupakan sebuah mesin yang multifungsi yang banyak digunakan untuk melakukan pekerjaan dan berbagai macam hiburan.
PC sendiri terdiri dari berbagai macam komponen sepertiMotherboardProcesorVGA, dan masih banyak lagi komponen di dalam sebuah PC. Sayangnya, memilih komponen di dalam PC tidaklah mudah karena diperlukan pengetahuan yang cukup luas tentang komponen PC itu sendiri. Dalam hal ini banyak orang yang tidak memperhatikan hal tersebut, dan juga ada beberapa orang yang melakukan rakitan PC langsung ke tokonya. Nah di sini saya akan kasih tips agar terhindar dari jebakan toko saat merakit PC.

Perhatikan Hal Ini Saat Merakit PC

Motherboard

mother board
Motherboard adalah induk dari semua PC, inilah komponen yang menghubungkan semua perangkat di dalam PC. Motherboard merupakan hal utama yang harus diperhatikan, jangan sampai para pedagang memberikan Motherboard yang abal-abal. Jika Motherboard yang diberikan kurang bagus, maka performa dari PC kamu tidak akan maksimal. Pilihlah Motherboard yang sudah memiliki fitur lengkap dan memilih Motherboard yang sudah terpercaya.

VGA (Graphic Card)

VGA
VGA merupakan komponen yang digunakan dalam hal visual atau grafis. Untuk VGA sendiri sesuaikan saja dengan kebutuhan kamu. Tapi jangan lupa, pilihlah VGA yang mempunyai nilai bit besar, dan juga kapasitas memori yang besar seperti 2GB GDDR3 atau 1 GB GDDR5.

Power Supply

Power Supply
Power Supply merupakan point terpenting saat merakit PC. Karena sebuah PC akan bekerja dengan maksimal apabila daya yang diberikan sesuai dengan apa yang ada dalam komponen. Dan juga untuk menghindari hal–hal yang tidak diinginkan seperti terjadinya korsleting pada listrik yang nantinya akan menyebabkan terbakarnya komponen yang ada dalam PC. Nah, biasanya para pedagang tidak terlalu memperhatikan soal Power Supply karena untuk mengambil keuntungan. Pilihlah Power Supply yang sudah tersertifikasi dan mampu memberikan 80% daya agar komponen PC tetap awet.

Prosesor

Prosesor
Prosesor adalah otak dari komputer. Untuk prosesor, pilihlah prosesor generasi terbaru dan juga memperhatikan kecepatan dari prosesornya karena banyak yang tidak memperhatikan kecepatan dari prosesor misalnya Intel i5 4460U dengan kecepatan 3,2GHz dengan i5 6300U dengan kecepatan 2,4GHZ.

RAM

RAM
Pilihlah RAM sesuai dengan kebutuhan kamu, tapi untuk jaman sekarang RAM 4GB kayaknya merupakan standar untuk Notebook ataupun PC jaman sekarang.

Harddisk

Hard Disk
Untuk harddisk mungkin tidak terlalu banyak perlu dijelaskan. Pilihlah Harddisk dengan kapasitas yang besar. Untuk jaman sekarang mungkin 1TB cukuplah untuk menampung data–data kamu dan menyimpan berbagai macam game berat.

Casing

Casing
Pilihlah casing PC yang memberikan siklus udara yang baik, karena untuk menjaga komponen PC kamu kamu agar lebih awet.
Nah, itu tadi hal-hal yang perlu diperhatikan oleh kamu saat sedang atau akan merakit PC. Sangat disayangkan bila kamu mendapatkan komponen PC yang jelek, karena pasti akan mempengaruhi performa PC yang telah kamu rakit nantinya.

Ini Laptop atau Predator? Spesifikasi Dewa dengan Harga Cuma 40 Juta

Kamu gamers sejati? Pasti kamu ingin sekali menggunakan VR untuk menambah pengalaman gaming kamu semakin mendalam lagi. Untuk mencoba kegilaan tersebut, tentu saja PC kamu harus dibenamkan prosesor grafis yang kuat, agar ketika mengoperasikannya tidak terjadi lag atau bahkan hal yang lebih gawat.
Coba saja kalau ada laptop gaming yang mampu melakukan pekerjaan berat seperti itu ya, pasti kita tidak perlu repot-repot merakit PC satu per satu untuk mewujudkannya. Apa? Serius? Sudah ada laptop gaming yang menyanggupi itu? YA! Saat ini, dengan laptop gaming sudah bisa membuat pengalaman itu loh, guys.

Laptop Gaming Acer Predator 17x

Mari berterima kasih untuk Acer, yang bisa memenuhi impian tersebut dalam sebuah produk laptop gaming yang dinamakan Acer Predator 17x. Dikutip dari Mashable, laptop ini merupakan perangkat ultraportable, yang berbentuk aneh dan unik, serta bisa menjadi pesaing tangguh untuk laptop lainnya, baik secara teknis maupun fisik.

Desain Sangar, Kekar, dan Galak!

Laptop Gaming Acer Predator 17x 11
Acer Predator 17x ini mengusung chassis berwarna hitam dan merah, serta memiliki ketebalan yang luar biasa, meski dapat dibilang buntet sih. Sesuai dengan nama, bentang layarnya berukuran 17.3 inci, dengan balutan tombol backlit, tersedianya tombol angka, dan optical drive. Bobot beratnya, 4.5 kilogram. GILA! Siap-siap berotot ya, guys.

Spesifikasi Tingkat Dewa

Laptop Gaming Acer Predator 17x 12
Tentu saja desain unik yang menampilkan kesangaran dan kekekaran ini juga di balut dalam spesifikasi tingkat dewa. Di sisi prosesor, sudah di tanamkan chip Intel Core i7 Skylake yang mampu di overclock hingga 4.0 GHz, RAM 64 GB DDR4, serta kartu grafis Nvidia GeForce GTX 980 yang sudah cukup baik untuk bersanding dengan headset Virtual Reality Oculus Rift dan HTC Vive. Laptop gaming ini juga bekerja dengan headset OSVR dan StarVR.

Sistem Pendingin yang Ampuh, Anti-Panas!

Laptop Gaming Acer Predator 17x 13
Membicarakan lebih dalam. Acer Predator 17x sudah menanamkan sistem pendingin yang tangguh. Acer membekali Predator 17x dengan triple-fan. Ventilasi di bagian depan laptop, akan menghisap udara lalu mendistribusikannya ke prosesor dan GPU untuk mendinginkan. Kemudian, udara akan kembali keluar melalui ventilasi belakang.

Harganya Bikin Mulut Nganga

Laptop Gaming Acer Predator 17x 9
Laptop gaming yang sudah siap mendukung VR ini sayangnya tidak datang dengan harga murah. Harganya berkisar sekitar Rp 36,8 jutaan. Harga yang bikin mulut kamu menganga-nganga, ya? Mungkin, kalau kamu merakit sebuah PC, uang yang habis hanya sebesar Rp 13 jutaan hingga Rp 19 jutaan. Tetapi, jika kamu senang bermain games dengan laptop, terlebih kamu mendambakan sebuah desain, Acer Predator 17x menjadi pilihan terbaik saat ini.
Yup, jika kamu memang penggila games, tentu saja penyajian desain dan spesifikasi yang seperti itu, akan menjadi satu ambisi buat kamu untuk mendapatkannya. Jadi, mulai dari sekarang, tabunglah uangmu agar kamu bisa memilikinya. Apa ada yang punya komentar tentang laptop gaming ini? Tuliskan di bawah ya.

Tutorial Cara Menggunakan Dreamweaver (dalam Membuat dan Mendisain Website / Web Programing)

Sebetulnya membuat website menggunakan program notepad pun bisa karena jika kita melakukan coding d notepad baik itu menggunakan bahasa php,css atau html bahkan javascript pun tetap akan berjalan hanya saja beberapa file yang kita buat akan kita modifikasi ekstension filenya saat kita menyimpan sesuai kebutuhan (.php/.html/.js/.css) dan akan berjalan dengan baik. Lalu muncul pertanyaan Lalu kenapa harus menggunakan program Dreamweaver?.
Dalam hal pembuatan website/web programing tidak harus melulu menggunakan program Dereamweaver. Lalu apa ada program lain selain Dreamweaver dan Notepad? Jelas ada seperti halnya notepad plus-plus dan mungkin banyak lagi yang belum saya ketahui.
Perlu anda ketahui bahwa program Dreamweaver yang saat ini dimiliki Adobe bukanlah satu satunya Program untuk membuat website akan tetapi hanya sekedar alat bantu untuk menyelesaikan kasus-kasus coding yang di anggap bisa diselesaikan dengan waktu cepat sehingga efektif dan efisien. Banyak sekali perintah-perintah kode yang secara otomatis terbaca. Menyenangkan bukan?.
Selain itu, kita juga bisa melihat langsung hasil coding atau kegiatan pengkodean dengan men-displaynya d dalam Dreamweaver itu sendiri tanpa harus menggunakan browser.
Untuk mahir menggunakan Dreamweaver maka kita tidak usah membaca tutorial yang panjang tanpa adanya praktek karna kuncinya hanya satu yaitu Latihan (langsung praktek). Dalam hal ini tanpa kita mempedulikan untuk apa menu dan sub menu yang ada karena dalam beberapa proses latihan anda akan menemukannya sendiri.
Untuk itu saya akan berikan anda Video Gratis hasil dari "pengajian" Web Programing dari TheJagat IT Indonesia yang mana didalamnya tidak tersurat secara mendetail tentang penggunaan Dreamweaver akan tetapi sangat membantu anda bahwa betapa mudahnya jika kita coding menggunakan Dreamweaver.
Berikut Link Download cara penggunaan Dreamweaver
Klik Disini

CARA MENGGUNAKAN ADOBE DREAMWEAVER CS3

CARA MENGGUNAKAN ADOBE DREAMWEAVER CS3

STEP 1 
- Buka program adobe dreamweavernya kemudian pilih HTML.



Screen shot 2013-01-18 at 10.41.23 AM
STEP 2 - Setelah terbuka pilih tab design
Screen shot 2013-01-18 at 10.41.29 AM
Screen shot 2013-01-18 at 10.41.36 AM
STEP 3 - Pilih menu Insert > Common > Media > Flash Button

Screen shot 2013-01-18 at 10.41.44 AM
STEP 4 - Pada saat kita memilih flash button maka akan muncul paparan seperti dibawah ini. Maka kita harus menyimpan filenya terlebih dahulu. Klik ok sahaja.

Screen shot 2013-01-18 at 10.41.50 AM
STEP 5 - Simpan file terlebih dahulu. File > Save.

Screen shot 2013-01-18 at 10.41.56 AM
Kemudian simpan dalam folder baru, beri nama filenya menu_flash.html.

Screen shot 2013-01-18 at 10.42.00 AM
STEP 6 - Kemudian kita ulangi pilih menu insert > common > flash button lalu ia menunjukkan paparan seperti di bawah.

Screen shot 2013-01-18 at 10.42.06 AM
Keterangan : 
  • Sample : Untuk melihat sampel sementara atau bentuk pilihan falsh button sesuai pilihan.
  • Style : Menu pilihan Flash button
  • Button Text : Teks yang akan di isikan ke dalam flash buttonnya.
  • Font : Jenis tulisan yang akan digunakan
  • Size : Ukuran teks yang akan digunakan
  • Link : Alamat tujuan link dari flash buttonya
  • Target : Target pilihan tujuan link
  • Bg colour : Background warna dari flash button
  • Apply : Melihat hasil sementara tapi belum disetujui klik
  • Ok : Jika sudah sesuai keinginan
Untuk contoh boleh lihat gambar di bawah ini :

Screen shot 2013-01-18 at 10.42.12 AM
STEP 7 - Setelah klik ok maka akan muncul kotak dialog flash Accessibility Attributes, di title klik menu kemudian klik ok.

Screen shot 2013-01-18 at 10.42.18 AM
Dan inilah hasilnya

Screen shot 2013-01-18 at 10.42.24 AM
Untuk menambah menu-menu berikutnya, ulangi langkah-langkah tadi.

NB : Pada saat sudah terbuat flash button tadi penyimpanan di folder tadi akan memaparkan flash button yang kita buat tadi.

Panduan Instalasi xampp-win32-1.8.3-1-VC1118.39

Assalamu'alaikum.. Salam sejahtera..
Setelah lama nian tidak ngeposting sesuatu yang bermanfaat, kali ini Tulisan Ilmu akan berbagi panduan atau cara instalasi xampp-win32-1.8.3-1-VC11. XAMPP adalah sebuah software web server apache yang didalamnya sudah tersedia database server mysql dan support php programming. XAMPP merupakan software yang mudah digunakan, gratis dan mendukung instalasi di Linux dan Windows.
Baik, sebelum melakukan peng-instalan ada beberapa hal yang harus sobat penuhi, yaitu :
1. Harus punya kompi atau laptop. (jelas lah, emangnya mau nginstalin dimana tu xapmm?? hehe)
2. Kompi atau laptop sobat sudah terinstal Web Browser (Firefox, Chrome, Opera, dll).
3. Download xampp-nya disini.
4. Sobat harus sehat jasmani dan rohani serta punya mental yang kuat. hehehe...
Jika hal-hal diatas sudah terpenuhi, maka sobat dapat segera melakukan peng-instalan. ikuti langkah-langkah dibawah ini.
  • Setelah xampp berhasil di download, klik 2 kali pada installernya sampai muncul tampilan seperti dibawah ini.
  
  •  Klik next sehingga muncul tampilan seperti dibawah ini.
  • Usahakan semua fitur tercentang, kemudian klik next sampai muncul perintah untuk memilih dimana kita akan menyimpan folder installan, kemudian klik next.
  • Kemudian akan muncul tampilan seperti dibawah ini. xampp versi BITNAMI telah support dengan berbagai CMS seperti joomla, drupal, dll sehingga dapat men-download langsung pada xampp-nya. hilangkan centang dan klik next.

  • Klik next pada tampilan berikut.
  • Selanjutnya adalah proses instalasi kedalam komputer kita. ini akan membutuhkan waktu beberapa menit, jadi harap sabar menunggu.
 
  • Jika tidak ada masalah, maka akan muncul tampilan seperti berikut. lalu klik finish.
  • Jika centang pada tamilan sebelumnya tidak dihilangkan, maka akan muncul tampilan xampp-control. fitur ini memungkinkan pengguna untuk menjalankan beberapa service yang disediakan oleh xampp. klik Start pada service Apache dan MySQL.
  • Jalankan browser dan cek apakah xampp sudah berjalan sebagaimana mestinya. ketikkan localhost pada link bar di browser.
  
  • Jika tampilan sudah seperti di atas, maka proses instalasi berhasil dan selesai. sobat bisa langsung menggunakan xampp tersebut.
Baik, itulah Panduan Instalasi xampp-win32-1.8.3-1-VC11 yang dapat saya sampaikan, semoga bermanfaat dan selamat mencoba..!!

JQuery untuk Orang Awam

jquerylogoJQuery 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 is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.
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 sederhana penggunaan JQuery
Contoh sederhana penggunaan JQuery
Penjelasan Program
1. Pertama, kita harus menyertakan (include) file library JQuery. Pastikan letak dari file library sudah benar.
2. 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 <body>.
  • 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.
3. Isi dari halaman. Perhatikan nama class dari masing-masing object.
Klik disini untuk melihat demo dari program di atas

Cara membuat script login dengan Jquery ajax dan php

Sambil mengerjakan script - script PHP, berikut kami coba sempatkan menulis tutorial Cara membuat script login dengan menggunakan JQUERY AJAX. Penggunaan AJAX tanpa bantuan JQUERY akan membuat kita harus mengetik banyak kode Javascript sehingga tentunya akan menyulitkan juga terutama untuk para pemula, dengan pemanfaat JQUERY, kode Javascript yang harus kita ketikkan menjadi lebih ringkas, dan itulah tentunya keuntungan kita menggunakan Javascript Framework JQUERY
Langkah - langkah yang dilakukan untuk membuat script login dengan JQUERY AJAX adalah sebagai berikut :
1. Menyiapkan JQUERY
Untuk menggunakan fungsi AJAX pada JQUERY, terlebih dahulu kita harus menyiapkan JQUERY dengan cara mendownloadnya kemudian kita simpan dalam komputer kita bersebelahan dengan script - script tutorial kita supaya tutorial ini dapat dijalankan pada komputer lokal meskipun tidak terkoneksi ke internet. Pada contoh script dibawah sudah kami siapkan Jquery lengkap dengan contoh project tutorial kita kali ini

2. Membuat form login » index.php
Script ini akan digunakan sebagai sarana untuk memasukkan username dan password ketika hendak login, berikut contoh script index.php sebagai halaman login
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<html>
    <head>
        <title>Login dengan Jquery AJAX</title>
        <style type="text/css">
            #login{
                font:bold 16px Tahoma,Verdana;
                display:block;
                border:#7596c0 1px solid;
                width:400px;
                height:280px;
                margin-left:auto;
                margin-right:auto;
                border-radius:5px;
                background-color:#98c1f3;
                box-shadow: 5px 5px 5px rgb(150, 149, 149);
                visibility:visible;
                color:#e9ecf0;
            }
            h3{
                font:bold 20px Tahoma,Verdana;
                margin:0 0 0 0;
                padding:0 0 0 0;
                color:#2572d2;
                text-align:center;
                line-height:50px;
                border-bottom:#ffffff 1px solid;
            }
            #inner{
                margin:0 20px 0 20px;
            }
            input.txt{
                font:normal 14px Tahoma,Verdana;
                padding:10px;
                margin:5px 0 5px 0;
                width:100td_persen;
                background-color:#dee9f6;
            }
            input.btn{
                font:bold 14px Tahoma,Verdana;
                padding:10px;
                margin:5px 0 10px 0;
                width:100td_persen;
                text-align:center;
            }
        </style>
        <script type="text/javascript" src="jquery-1.6.1.min.js">//memanggil jquery</script>
        <script type="text/javascript" src="login.js">//memanggil script ajax</script>
    </head>
    <body>
        <div id="login">
            <h3>LOGIN ADMINISTRATOR</h3>
            <div id="inner">
                  
                <input type="text" class="txt" placeholder="Username anda" id="txt_username"/>
                  
                <input type="password" class="txt" placeholder="Password anda" id="txt_password"/>
                <input type="button" class="btn" name="btn" id="btnLogin" onclick="check_login();" value="Login"/>
            </div>
        </div>
    </body>
</html>

3. Membuat script AJAX » login.js
Script ini merupakan script Jvascript AJAX yang akan menggunakan fungsi AJAX pada JQUERY dengan susunan script sebagai berikut :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function check_login()
{
    //Mengambil value dari input username & Password
    var username = $('#txt_username').val();
    var password = $('#txt_password').val();
    //Ubah alamat url berikut, sesuaikan dengan alamat script pada komputer anda
    var url_login    = 'http://localhost/tutorial/login.php';
    var url_admin    = 'http://localhost/tutorial/admin.php';
     
    //Ubah tulisan pada button saat click login
    $('#btnLogin').attr('value','Silahkan tunggu ...');
     
    //Gunakan jquery AJAX
    $.ajax({
        url     : url_login,
        //mengirimkan username dan password ke script login.php
        data    : 'var_usn='+username+'&var_pwd='+password,
        //Method pengiriman
        type    : 'POST',
        //Data yang akan diambil dari script pemroses
        dataType: 'html',
        //Respon jika data berhasil dikirim
        success : function(pesan){
            if(pesan=='ok'){
                //Arahkan ke halaman admin jika script pemroses mencetak kata ok
                window.location = url_admin;
            }
            else{
                //Cetak peringatan untuk username & password salah
                alert(pesan);
                $('#btnLogin').attr('value','Coba lagi ...');
            }
        },
    });
}
Dengan penjelasan - penjelasasn seperti pada contoh diatas, kami berharap pembaca sekalian dapat memahami maksud dari masing - masing line script yang kita gunakan
4. Membuat script pemrosesan » login.php
Script login.php merupakan script php sederhana yang kami gunakan untuk melakukan pengecekan kebenaran username dan password pada database, jika username dan password benar, maka script dibawah akan mencetak kata "ok", sedangkan jika username dan password salah maka akan dicetak kata "Username atau Password Salah !"
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
session_start();
//koneksi ke database
$conn = mysql_connect('localhost','root','kutukupret');
$db   = mysql_select_db('tutorial',$conn);
if(isset($_POST['var_usn']) AND isset($_POST['var_pwd'])){
    $username = addslashes($_POST['var_usn']);
    $password = addslashes($_POST['var_pwd']);
    $check    = mysql_query('select * from admin where Usn="'.$username.'" AND Pwd="'.$password.'" ');
    if(mysql_num_rows($check)==0){
        echo 'Username atau Password Salah !';
    }
    else{
        $_SESSION['login']['usn'] = $username;
        $_SESSION['login']['pwd'] = $password;
        echo 'ok';
    }
}
?>

Pesan login diatas selanjutnya yang akan diambil oleh script login.js, dimana kalo script diatas mencetak kata "ok", maka user akan langsung diarahkan ke halaman berikutnya, sebaliknya jika script diatas mencetak pesan kesalahan, maka script login.js akan memberikan javascript alert sebagai tanda peringatan kesalahan username dan password
5. Membuat script halaman admin » admin.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
session_start();
if(isset($_GET['logout']) AND $_GET['logout']=='1'){
    unset($_SESSION['login']);
    session_destroy();
}
if(!isset($_SESSION['login'])){
    header('location: index.php');
}
else{
    echo '<h3>SELAMAT DATANG : '.$_SESSION['login']['usn'].'</h3>';
    echo 'Halaman ini kita asumsikan sebagai halaman Administrator, dimana halaman ini hanya bisa diakses ketika Admin sudah login';
    echo '<br/><a href="?logout=1">LOGOUT</a>';
}
?>
Script diatas kita asumsikan sebagai halaman administrator yang mengharuskan user untuk login terebih dahulu ketika hendak mengakses halaman ini
Untuk mencoba script - script diatas tanpa adanya perubahan direktory, sebaiknya kita tempatkan script - script diatas pada folder dengn nama tutorial pada direktory web server komputer anda.
Download script login dengan JQUERY Ajax
Sekian dulu tutorial kali ini, semoga tulisan kami dapat bermanfaat sebagai sarana belajar anda, Terimakasih dan Salam kreatif

Cara Menggunakan JQuery


Seperti pada tutorial sebelumnya yaitu Fungsi dari jQuery maka pada tutorial kali ini kita akan membahas Bagaimana cara menggunakan jQuery? wah mantab tuh gan, buruan dong! tenang, akan segera saya jelaskan langkah - langkahnya.

1. Ok pertama - tama adalah kita harus mendownload terlebih dahulu jQuery Library (inti dari jQuery). Dimana download jQuery Library? mau tau aja atau mau tau banget? hehehe... Downloadnya di www.jquery.com , silahkan klik Download jQuery. Saat penulisan tutorial ini library jQuery telah sampai versi 1.9.1
screenshot website jquery.com
gambar : screenshot website jquery.com


2. Pada halaman selanjutnya pilih versi jquery, ada versi Production dan versi Developer. Untuk saat ini pilih versi Production jQuery karena versi Developer ditujukan kepada para master pemrograman dan pengembang jquery.
pilihan download jQuery
gambar :

Catatan :
jQuery selalu merilis dua versi Library yaitu versi Production dan Development. Perbedaannya adalah versi Production ukuran filenya lebih kecil karena telah 'dimampatkan' atau istilahnya di Compress. Diperuntukkan bagi pengguna awam yang ingin langsung menggunakan jQuery. Sedangkan versi Development isi filenya mudah dibaca karena belum di Compress dan ditujukan unruk para Developer yang tertarik mempelajari - memanipulasi - bahkan mengembangkan fungsi - fungsi yang dimiliki oleh jQuery.

3. Akan muncul code dari library JQuery
jquery code library
gambar : jquery code library

Klik CTRL + S di keyboard untuk menyimpan kode tersebut ke direktori website anda
logo jquery write less do more
gambar : save jquery lib pada direktori website

4. Ok sekarang adalah kode untuk memanggil jQuery library supaya dapat terLOAD di website yang anda buat. Buka dreamweaver dan masukkan kodenya.
Scriptnya yang saya cetak tebal merah :
script pemanggil jQuery
gambar : script pemanggil jQuery
5. Ok sekarang cara Penggunaannya, inti dari jQuery adalah :
A) Panggil / Load library jQuery (stabilo merah)
B) buat script jquery di bagian head untuk mengontrol object berdasarkan elementnya (stabilo biru)
C) Buat Object beserta elemennya berupa id dan class di bagian body (stabilo abu - abu)


sebagai contoh saya akan membuat control sembunyikan dan tampilkan gambar :
inti dari jQuery
gambar : inti dari jQuery

- Copyright © Info Dunia - Skyblue - Powered by Blogger - Designed by doni hardiawan -