Mengenal Pengertian Dan Sejarah MySQL


Sebelumnya kita pernah Mengenal Apa itu PHP ? nahh untuk menjalankan program PHP itu memerlukan MySQL dan Apache, tapi untuk postingan kali ini saya akan menjelaskan Mengenal Pengertian MySQL ? Oke sekarang simak penjelasannya berikut ini.

Pengertian MySQL

MySQL adalah sebuah software (perangkat lunak) sistem manajemen basis data SQL atau DBMS yang bersifat open source dan sangat populer saat ini. MySQL juga memiliki beberapa fitur seperti multithreaded dan multi-user.  MySQL AB membuat MySQL tersedia sebagai perangkat lunak gratis dibawah lisensi GNU General Public License (GPL), tetapi mereka juga menjual dibawah lisensi komersial untuk kasus-kasus dimana penggunaannya tidak cocok dengan penggunaan GPL.

Sejarah MySQL

Michael Widenius (a.k.a. Monty) 
MySQL pertama kali ditemukan oleh Michael Widenius (a.k.a. Monty) pada tahun 1979 di Swedia. Michael Widenius (a.k.a. Monty) adalah seorang programer dari sebuah perusahaan bernama TcX di Swedia. Pada saat itu Monty sedang mengembangkan sebuah sistem database sederhana yang dinamakan UNIREG. UNIREG ini menggunakan koneksi low-level ISAM database engine dengan indexing (baca : sistem database sederhana yang mendukung index).

Pada tahun 1994 perusahaan TcX tersebut sedang mengembangkan aplikasi berbasis web, dan berencana menggunakan UNIREG sebagai sistem databasenya. Tetapi TcX menganggap kalau UNIREG tidak cocok untuk database yang dinamis seperti web, oleh karena itu UNIREG ditolak oleh TcX.

TcX mencoba mencari alternatif sistem database lainnya, salah satunya adalah mSQL (miniSQL), sebuah RDBMS yang tidak terlalu mahal dan hampir open source, maksudnya jika anda membeli aplikasi ini, anda juga akan mendapatkan source code nya juga. Namun mSQL versi 1 ini juga memiliki kekurangan, yaitu tidak mendukung indexing, sehingga performanya tidak terlalu bagus.

Dengan hasutan petinggi-petinggi TcX, Monty mencoba menghubungi David Hughes (programmer yang mengembangkan mSQL) untuk menanyakan apakah ia tertarik mengembangkan sebuah konektor di mSQL yang dapat dihubungkan dengan UNIREG ISAM sehingga mendukung indexing. Pada saat itu Hughes menolak, dengan alasan sedang mengembangkan teknologi indexing yang independen untuk mSQL versi 2.

Dikarenakan penolakan David Hughes, TcX (dan juga Monty) akhirnya memutuskan untuk merancang dan mengembangkan sendiri konsep sistem database baru. Sistem ini merupakan gabungan dari UNIREG dan mSQL (yang source codenya dapat bebas digunakan). Sehingga pada May 1995, sebuah RDBMS baru, yang dinamakan MySQL dirilis.

David Axmark dari Detron HB, rekanan TcX mengusulkan agar MySQL di ‘jual’ dengan model bisnis baru. Ia mengusulkan agar MySQL dikembangkan dan dirilis dengan gratis. Pendapatan perusahaan selanjutnya di dapat dari menjual jasa “support” untuk perusahaan yang ingin mengimplementasikan MySQL. Konsep bisnis yang juga diterapkan perusahaan-perusahaan Open Source lainnya.

Asal Mula Nama dan Logo MySQL

Asal penamaan MySQL sendiri agak unik. Monty berkata :
It is not perfectly clear where the name MySQL derives from. TcX’s base directory and a large amount of their libraries and tools have had the prefix ‘My’ for well over ten years. However, my daughter (some years younger) is also named My. So which of the two gave its name to MySQL is still a mystery.
Berbagai sumber menyatakan, bahkan juga di situs MySQL sendiri bahwa “My” dari MySQL berasal dari nama anak perempuan Monty. Namun seperti kutipan diatas, Monty pun mengakui bahwa selama ia di TcX, library dan aplikasi yang dikembangkan perusahaan itu juga banyak dimulai dengan awalan “My”.

LOGO MySQL
MySQL Logo
Sedangkan Logo lumba-lumba dalam lambang MySQL di namai Sakila, yang berasal dari sebuah kontest “Name the Doplhin” yang diadakan MySQL AB. Nama Sakila ini diajukan oleh  Ambrose Twebaze, seorang programmer open source dari Swaziland, Afrika. ‘Sakila‘ memiliki akar dari bahasa Siswati, bahasa yang digunakan di Swaziland.

Source :
  1. http://dev.mysql.com/doc/refman/5.0/en/history.html
  2. http://docstore.mik.ua/orelly/weblinux2/mysql/ch01_02.htm
  3. http://buytaert.net/the-history-of-mysql-ab
  4. http://monty-says.blogspot.com/2009/12/help-saving-mysql.html

Menyembukan Sidebar Di Halaman Tertentu Pada Blogger

Menyembukan Sidebar Di Halaman Tertentu Pada Blogger


Menyembukan Sidebar Di Halaman Tertentu Pada Blogger - Terkadang kita ingin bisa menyembunyikan sidebar di halaman tertentu dan membuat halaman tersebut menuliki lebar maxsimal seperti ukuran lebar template blog.  Tenang, untuk kali ini Blog Pintasku akan memberikan tutorial untuk menyembunyikan sidebar tersebut, silahkan simak tutorialnya berikut ini.

Menghilangkan sidebar di halaman terntentu di blogger itu sangatlah mudah, sobat hanya perlu mencari selector css pada tag sidebar lalu meletakannya di dalam tag kondisonal blogger .

Mencari Selector Sidebar

Karena setiap template yang digunakan itu pastinya berbeda - beda jadi kita harus mengetahui selector yang digunakannya. biasanya yang berbeda itu dari nama id. Untuk mecari selector sidebarnya kita bisa menggunakan fitur Inspect Element yang ada pada browser, umumnya sih browser modern pasti memiliki fitur ini, tetapi saya sarankan sobat menggunakan browser mozilla. dan google chrome. Oke sekarang ikuti instruksi berikut ini,

  1. Buka blog sobat
  2. Jika sudah tampil blognya sekarang kita klik kanan, lalu pilih Inspect Element, maka akan muncul bar seperti pada gambar.
  3. Jangan lupa kita harus mencari terlebih dahulu, tag sidebarnya, biasanya terletak di dalam tag <div id='content-wrapper'>

Nahh kita sudah mendapatkan selector CSSnya, sekarang kita masuk ke tutorial selanjutnya.

Menyembukan Sidebar Di Halaman Tertentu Pada Blogger

Oke sekarang kita sudah mendapatkan selector sidebar, sekarang kita terapkan di blogger cara menyembunyikan sidebar tersebut. 

Langkah 1 : Masuk menu Templates > Edit HTML
Langkah 2 : Sekarang letakan kode berikut ini tepat di atas tag </head>
<style type='text/css'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
#sidebar-wrapper {display:none;}
#main-wrapper {width:100%;}
</b:if>
</style>
Keterangan : 
Tulisan yang berwarna merah adalah tag kondisonal blogger, sobat bisa menggantinya sesuai dengan kebutuhan sobat. Untuk melihat daftar tag kondisonal blogger, silahkan baca artikel saya mengenai
Sedangkan Tulisan yang berwarna biru adalah kode css untuk isi halaman, jadi disana adalah kode css untuk melebarkan isi halaman tersebut. Dan semua selectornya bisa di ganti sesuai dengan selector yang digunakan pada template blog sobat.

Sekian Tutorial Cara Menyembukan Sidebar Di Halaman Tertentu Pada Blogger, semoga tutorial ini bisa membantu dan bermanffat untuk semuanya. Terimakasih


Membuat Widget Ricent Post Slider Responsive Di Blogger

Membuat Widget Ricent Post Slider Responsive Di Blogger


Membuat Widget Ricent Post Slider Responsive Di Blogger - Sebelumnya Blog Pintasku pernah memberikan Tutorial Membuat Ricent Post Slider Rotator Di Blogger, nahh untuk postingan kali ini kita akan belajar cara membuat widget ricent post slider juga, tetapi untuk yang satu ini berbeda, karena memiliki desain yang lebih elegan dan Responsive.

Ricent Post artinya postingan terbaru, jadi slider ini nantinya akan menampilkan postingan terbaru dari blog sobat dengan efek slider. Widget ini menurut saya bagus untuk di tampilkan di halaman Home Page blog sobat, apalagi jika template blog sobat sudah responsive, maka widget ini juga cocok untuk blog sobat. Oke langsung saja ke tutorialnya berikut ini, tapi sebelum mengikuti tutorialnya silahkan lihat dulu tampilan slidernya, klik tombol demo untuk melihat tampilan widget  ricent post slider responsive.

Membuat Widget Ricent Post Slider Responsive Di Blogger

Langkah 1 : Masuk ke menu Templates > Edit HTML
Langkah 2 : Masukan kode CSS berikut ini, tepat di atas tag ]]></b:skin>
#featuredpost {margin:15px auto;}
#slides *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#slides ul,#slides li{padding:0;margin:0;list-style:none;position:relative}
#slides ul{height:320px}
#slides li{width:50%;height:100%;position:absolute;display:none}
#slides li:nth-child(1), #slides li:nth-child(2), #slides li:nth-child(3), #slides li:nth-child(4), #slides li:nth-child(5){display:block}
#slides li:nth-child(1){left:0;top:0}
#slides li:nth-child(2){left:50%;width:25%;height:50%}
#slides li:nth-child(3){left:75%;width:25%;height:50%}
#slides li:nth-child(4){left:50%;top:50%;width:25%;height:50%}
#slides li:nth-child(5){left:75%;top:50%;width:25%;height:50%}
#slides li:nth-child(1) h4 {overflow:hidden;font-size:25px;bottom:0;color:#fafafa;width:100%;
padding:10px 10px 10px 90px;text-align:left;text-transform:uppercase;background:rgba(0,0,0,0.3);
height:90px;font-family:&#39;Oswald&#39;;text-shadow:2px 2px 0 rgba(0,0,0,0.2);line-height:32px;left:0;}
#slides li:nth-child(1) .label_text {font-size:30px;display:block;bottom:10px;left:10px;
padding:0;font-family:&#39;Oswald&#39;;box-shadow:5px 3px 0 rgba(0,0,0,0.2);}
#slides li:nth-child(1) span.dd {display:block;font-size:30px;padding:12px 15px;
background:#ff6553;margin:0;}
#slides li:nth-child(1) span.dm {display:block;font-size:14px;background:#333;color:#fff;
padding:5px 21px;text-transform:uppercase;margin:0;}
#slides li:nth-child(1) span.dy, #slides li:nth-child(1) span.autname{display:none;}
#slides a{display:block;width:100%;height:100%;overflow:hidden}
#slides img{display:block;width:100%;height:auto;border:0;padding:0;background-color:#333;-moz-transform:scale(1.0) rotate(0);-webkit-transform:scale(1.0) rotate(0);-ms-transform:scale(1.0) rotate(0);transform:scale(1.0) rotate(0);transition:all 0.6s linear;}
#slides li a:hover img {-moz-transform:scale(1.1) rotate(1deg);-webkit-transform:scale(1.1) rotate(1deg);-ms-transform:scale(1.1) rotate(1deg);transform:scale(1.1) rotate(1deg);transition:all 0.3s linear;}
#slides .overlayx{width:100%;height:100%;position:absolute;z-index:2;background-image:url(http://2.bp.blogspot.com/-0haO2Mfkjjk/VDgZww2tfEI/AAAAAAAAHAk/zhu3INYSkHA/s1600/fade.png);background-position:50% 40%;background-repeat:repeat-x;}
#slides h4{position:absolute;bottom:40px;margin:0;font-size:13px;font-family:&#39;Oswald&#39;;
left:10px;padding:5px 10px;color:#f9f9f9;z-index:3;line-height:20px;font-weight:normal;
background:rgba(41,41,41,0.7);text-align:left;text-transform:uppercase;margin-right:10px;}
#slides .label_text{font-size:12px;color:#fff;bottom:10px;z-index:3;left:10px;
position:absolute;background:rgba(255,101,83,0.8);padding:3px 6px;font-family:&#39;Oswald&#39;;
text-transform:uppercase;}
#slides li:nth-child(2) .autname,#slides li:nth-child(3) .autname,#slides li:nth-child(4) .autname,#slides li:nth-child(5) .autname{display:none;}
#slides .overlayx,#slides li{transition:all .4s ease-in-out}
#slides li:nth-child(1) .overlayx{display:none;}
#slides li:hover .overlayx{opacity:0.1}
@media only screen and (max-width:800px){
#slides li:nth-child(1) h4 {font-size:18px;line-height:24px;}}
@media only screen and (max-width:600px){
  #slides ul{height:600px}
  #slides li:nth-child(1){width:100%;height:50%}
  #slides li:nth-child(2){top:50%;height:25%;left:0;width:50%}
  #slides li:nth-child(3){left:50%;top:50%;width:50%;height:25%}
  #slides li:nth-child(4){left:0;top:75%;height:25%;width:100%}
  #slides li:nth-child(5){display:none;}}
@media only screen and (max-width:480px){
#slides li:nth-child(1) h4 {font-size:13px;line-height:16px;}}
Langkah 3 : Sekarang kita letakan script berikut ini dan letakan di atas tag </body>
<script type="text/javascript" src="https://googledrive.com/host/0Bwx-LVTRaDmab21RLXU1RDZfZlE"></script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
FeaturedPost({
blogURL:"http://pintasku.blogspot.com/",
MaxPost:8,
idcontaint:"#featuredpost",
ImageSize:500,
interval:10000,
autoplay:true,
tagName:false
});
});
//]]>
</script>
Ganti tulisan url yang berwarna merah dengan url blog sobat.
Langkah 4 : Nahh sekarang kita hanya perlu menambahkan tag HTML berikut ini tepat di atas tag <div id='content-wrapper'>
<div id="featuredpost"></div>
Langkah 5 : Save dan lihat hasilnya

Sekian Tutorial Cara Membuat Widget Ricent Post Slider Responsive Di Blogger  semoga tutorial di atas bisa membantu dan bermanfaat untuk semuanya. Terimakasih

Belajar Styling List Dengan CSS


Belajar Styling List Dengan CSS - Sebelumnya kita pernah mempelajari Tutorial Cara Membuat Daftar (List) dalam HTML, Nahh untuk sekarang kita akan belajar Bagaimana Cara Styling atau memanipulasi List / daftar menggunakan CSS, oke langsung saja simak tutorialnya berikut ini.

Pada umumnya Pada HTML sebuah daftar/list ini ada 2 jenis, yaitu :
  1. Ordered List <ol> ( untuk membuat daftar / list menggunakan angka atau huruf  )
  2. Unordered List <ul> ( untuk membuat daftar / list menggunakan simbol  )
Untuk lebih jelasnya silahkan baca saja pada tutorial :
Sedangkan untuk cara memanipulasinya itu kita bisa menggunakan sebuah property list-style-type dan list-style-image.

1. Property List Style Type

 Property List Style Type memiliki 4 nilai (value), yaitu :
  • circle
  • square
  • upper-roman
  • lower-alpha
Berikut ini adalah contoh penggunaanya dalam HTML.
<!DOCTYPE html>
<html>
   <head>
        <title>Belajar Styling List Dengan CSS</title>
<style>
ul.a {
    list-style-type: circle;
}

ul.b {
    list-style-type: square;
}

ol.c {
    list-style-type: upper-roman;
}

ol.d {
    list-style-type: lower-alpha;
}
</style>
</head>
<body>

<p>Nilai circle dan square untuk unordered lists:</p>
<ul class="a">
  <li>HTML</li>
  <li>CSS</li>
  <li>PHP</li>
</ul>

<ul class="b">
  <li>HTML</li>
  <li>CSS</li>
  <li>PHP</li>
</ul>

<p>Nilai upper-roman dan lower-alpha untuk ordered lists:</p>
<ol class="c">
  <li>HTML</li>
  <li>CSS</li>
  <li>PHP</li>
</ol>

<ol class="d">
  <li>HTML</li>
  <li>CSS</li>
  <li>PHP</li>
</ol>

</body>
</html>

2. Property List Style Image

Nilai (Value) untuk Property List Style Image itu menggunakan sebuah gambar, sesuai dengan nama propertynya, yaitu image. 

Supaya bisa lebih mengerti, sekarang sobat buatlah sebuah folder baru, lalu sekarang kita buat halaman HTML dan CSS dengan kode berikut ini dan letakan di folder baru tersebut. Jangan lupa untuk menyimpan sebuah gambar pada folder tersebut.
<!DOCTYPE html>
<html>
   <head>
        <title>Belajar Styling List Dengan CSS</title>
<style>
ul {
    list-style-image: url('sqpurple.gif');
}
</style>
</head>
<body>

<ul>
  <li>HTML</li>
  <li>CSS</li>
  <li>PHP</li>
</ul>

</body>
</html>
Penggunaan Property List Style Image


Nahh cukup sekian Tutorial Belajar Styling List Dengan CSS semoga tutorial ini bisa membantu dan bermanfaat untuk semuanya. Terimakasih