Cara menyimpan data dengan Session Storage dan Local Storage mengunakan Javascript

Dalam hal menyimpan data sebuah website sebenarnya ada banyak cara dari menggunakan database di server, local atau bahkan dengan menggunakan session, nak kali ini saya membahas bangaimana sih cara menyimpan data pada localStorage browser atau ke sessionStorage, nah di tutorial ini saya hanya mengunakan console dari browser yah.  

Berikut ini adalah cara bagaimana mengunakan sessionStorage, kalian juga bisa membuatnya dengan mengunakan sebuah function.

 

 sessionStorage.setItem("mySite", "Gali Code");
 var mySite = sessionStorage.getItem("mySite");
 console.log(mySite);

Kemudian berikut adalah cara mengunakan localStorage sebenernya cara mengunakannya sama dengan sessionStorage cuma lokasi penyimpan datanya saja yang berbeda.

 

 

 localStorage.setItem("mySite", "Gali Code 2");
 var mySite = localStorage.getItem("mySite");
 console.log(mySite);

Baik sekian dulu yah tutorial sederhana ini sampai ketemu lagi di tutorial selanjutnya. Salam semangat belajar code dengan panenkode.

Sumbit form tanpa refresh page dengan javascripts

Helo kali ini saya akan share cara post form tanpa refresh page website dengan javascripts. Mungkin cara ini sudah banyak yang tahu tapi bagi yang baru belajar silakan simak artikel ini. Dalam sumbit form kita bisa lakukan tanpa javascripts cuma page akan di refresh dan memuat data ulang atau mendownload data-data ulang dari server sehingga membuat prosess menjadi lamat bahkan lama jika internet kalian lambat, tetapi kita bisa mengatasinya dengan mengunakan javascript berserta API json. tetapi disini kita hanya membahas sumbit nya saja. Sumbit dengan javasctipt ada dua cara. 

1. Bisa menggunakan form pembukan dan penutup seperti berikut:

<form id="formrvc">
    <div class="form-group">
        <label for="revenuecenter">Revenue Center Name</label>
        <input type="text" class="form-control norvc" placeholder="" name="revenuecenter">
    </div>
    <div class="form-group">
        <button class="btn btn-primary requestData">Request</button>
    </div>
</form>

Kemudian untuk javascript nya harus di tambahkan e.preventDefault() supaya form tidak refresh saat kita tekan sumbit.

$('#formrvc').on("click", ".requestData", function (e) {
   e.preventDefault();
   var Data = $(".norvc").val();
   alert("The following data would have been submitted to the server: \n\n" + Data);
 });

2. Tanpa mengunakan form seperti berikut ini:
   

<div class="form-group">
     <label for="revenuecenter">Revenue Center Name</label>
     <input type="text" class="form-control norvc" placeholder="" name="revenuecenter">
</div>
<div class="form-group">
     <button class="btn btn-primary requestData">Request</button>
</div>

Kemudian untuk javascriptnya agak berbeda sedikit kita tidak perlu mengunakan e.preventDefault() serta parsing formnya:

$('.requestData').on("click", function () {

    var Data = $(".norvc").val();
    alert("The following data would have been submitted to the server: \n\n" + Data);
 });

 

Dari kedua cara diatas hasilnya sama saja sekarang yang mana saja boleh digunakan saya bisanya menggunakan yang cara 2 tanpa form kemudia bisa pilih datanya mana saya yang diamabil untuk di prosess selanjutnya.

Belajar Javascripts Bagi Pemula

Javascripts adalah sebuah bahasa pemrograman web yang bisa memanipulasi tag element yang terdapat pada halaman website. Javascripts bisa berjalan pada browser tanpa perlu compiler seperti php, java dan lain sebagainya. Mempelajari javascripts sangat mudah dan gampang bagi yang belum paham pemrograman sekalipun. Penerapan javascripts sering sekali kita lihat pada pembuatan game serta tampilan website guna mempercantik halaman website.

Dalam penulisan scripts javascript harus di awali dengan open tag javascript seperti sample code dibawah ini:

<script type="text/javascript">
Your JavaScript code
</script>

JavaScript adalah salah satu dari 3 bahasa yang harus dipelajari semua pengembang web:

1. HTML untuk mendefinisikan konten halaman web
   
2. CSS untuk menentukan tata letak halaman web
   
3. JavaScript untuk memprogram perilaku halaman web

Halaman web bukan satu-satunya tempat di mana JavaScript digunakan. Banyak program desktop dan server menggunakan JavaScript. Mempelajari javascript sangat berguna untuk menguasai pemrograman yang lebih advance seperti pada NodeJs karena dalam mengunakan nodejs semuanya harus ditulis dalam javascript, penulisan javascript sekarang banyak sekali seperti dalam ReactJs, VeuJs bahkan Angular. Bahkan dalam beberapa database yang baru sudah mengunakan penulisan JavaScript seperti MongoDB and CouchDB.

APAKAH KAMU TAHU?

JavaScript dan Java adalah bahasa yang sama sekali berbeda, baik dalam konsep maupun desain. JavaScript ditemukan oleh Brendan Eich pada tahun 1995, dan menjadi standar ECMA pada tahun 1997. ECMA-262 adalah nama resmi standar. ECMAScript adalah nama resmi bahasa tersebut.

Kalian sudah tahu open tag yang digunakan sebelum memulai menulis script javascript diatas tapi ada cara lain juga dalam menulis javascript, dimana script bisa langsung disisipkan pada element html seperti button, txt dan lainnya dengan mengunakan salah satu function dari javascript yang ada pada browser seperti getElementById() ini adalah function yang bisa untuk mengambil element berdasarkan ID yang ada pada HTML, berikut adalah contoh kodenya:

document.getElementById("demo").innerHTML = "Hello JavaScript!"

Berikut adalah kode lengkap dalam penulisan javascript tanpa open tag script seperti diatas.

<!DOCTYPE html>
<html>
<body>

<h2>Hai Saya Sedang Belajar JavaScripts</h2>
<p id="demo">Halo Dunia.</p>
<button type="button" onclick='document.getElementById("demo").innerHTML = "Halo JavaScript!"'>Tekan Saya!</button>

</body>
</html>

Baik sekian dulu menu pembuka dari belajar javascript nanti kita lanjut ketahap yang lebih seru lagi dari javascript. Bye guesss...