Tampilkan postingan dengan label Web Programming. Tampilkan semua postingan
Tampilkan postingan dengan label Web Programming. Tampilkan semua postingan

Rabu, 17 September 2014

Posted by Huai
No comments | 22.58



Assalamualaikum Wr.Wb
Berikut ini Penjelasan dari bagian-bagian XAMPP:
  • X , Kenapa disebut dengan system operasi? karena XAMPP bisa dijalankan di 4 OS besar yang sering digunakan oleh pengguna komputer saat ini. Dan 4 OS tersebut tidak lain dan tidak bukan adalah Windows, Linux, Mac OS dan Solaris.
  • A(Apacahe) merupakan aplikasi web server. Apache ini bersifat opensource yang berarti gratis dan bisa diedit oleh penggunanya. Tugas utama Apache adalah menghasilkan halaman web yang benar kepada user berdasarkan kode PHP yang dituliskan oleh pembuat halaman web. jika diperlukan juga berdasarkan kode PHP yang dituliskan,maka dapat saja suatu database diakses terlebih dahulu (misalnya dalam MySQL) untuk mendukung halaman web yang dihasilkan.
  • M ( MySQL), merupakan aplikasi database server. Perkembangannya disebut SQL yang merupakan kepanjangan dari Structured Query Language. SQL merupakan bahasa terstruktur yang digunakan untuk mengolah database. MySQL dapat digunakan untuk membuat dan mengelola database beserta isinya. Kita dapat memanfaatkan MySQL untuk menambahkan, mengubah, dan menghapus data yang berada dalam database.
  • P (PHP), bahasa pemrograman web. Bahasa pemrograman PHP merupakan bahasa pemrograman untuk membuat web yang bersifat server-side scripting. PHP memungkinkan kita untuk membuat halaman web yang bersifat dinamis. Sistem manajemen basis data yang sering digunakan bersama PHP adalah MySQl. namun PHP juga mendukung sistem manajement database Oracle, Microsoft Access, Interbase, d-base, PostgreSQL, dan sebagainya.
  • P (Perl), bahasa pemrograman, pertama kali dikembangkan oleh Larry Wall di mesin Unix. Perl pertama kali dirilis pada tanggal 18 Desember 1987 ditandai dengan keluarnya Perl 1. Dua diantara karakteristik utama perl adalah penanganan teks dan berbagai jalan pintas untuk meyelesaikan persoalan-persoalan umum.Perl sangat populer di gunakan dalam program-rogram CGI (Common Gateway Interface) dan protokol internet lainnya.
Fungsinya adalah sebagai server yang berdiri sendiri (localhost), yang terdiri atas program Apache HTTP Server, MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa pemrograman PHP dan Perl. Nama XAMPP merupakan singkatan dari X (empat sistem operasi apapun), Apache, MySQL, PHP dan Perl. Program ini tersedia dalam GNU General Public License dan bebas, merupakan web server yang mudah digunakan yang dapat melayani tampilan halaman web yang dinamis.

langsung saja Download XAMPP for Windows Klik Download [File Horse | 119Mb]

Sabtu, 30 Agustus 2014

Posted by Huai
No comments | 10.01


Membuat Menu Dropdown dengan HTML & CSS


Menu dropdown adalah menu yang ketika di klik / ditunjuk akan menampilkan sub menu di bawahnya, seperti terlihat pada gambar berikut:
menu
Nah.., untuk membuatnya silahkan anda buat file html dengan nama menu.html, dan ketikkan kode html berikut:


  1. <html>



  2. <head>



  3. <title>Membuat Menu Dropdown dengan CSS</title>



  4. <link rel="stylesheet" href="menu.css" type="text/css"/>



  5. </head>



  6. <body>



  7. <div id='ddmenu'>



  8. <ul>



  9. <li class='active'><a href='index.html'><span>Home</span></a></li>



  10. <li class='has-sub'><a href='#'><span>Produk</span></a>



  11. <ul>



  12. <li><a href='#'><span>Produk 1</span></a></li>



  13. <li class='last'><a href='#'><span>Produk 2</span></a></li>



  14. </ul>



  15. </li>



  16. <li><a href='#'><span>Tentang Kami</span></a></li>



  17. <li class='last'><a href='#'><span>Hubungi Kami</span></a></li>



  18. </ul>



  19. </div>



  20. </body>



  21. </html>




Selanjutnya buatlah file css pada folder yang sama dengan file html dengan nama menu.css, dan ketik kode CSS berikut:


  1. #ddmenu{ height:37px; display:block; padding:0; margin: 0; border:1px solid; border-radius:5px; }



  2. #ddmenu > ul {list-style:inside none; padding:0; margin:0;}



  3. #ddmenu > ul > li {list-style:inside none; padding:0; margin:0; float:left; display:block; position:relative;}



  4. #ddmenu > ul > li > a{ outline:none; display:block; position:relative; padding:12px 20px; font:bold 13px/100% Arial, Helvetica, sans-serif; text-align:center; text-decoration:none; text-shadow:1px 1px 0 rgba(0,0,0, 0.4); }



  5. #ddmenu > ul > li:first-child > a{border-radius:5px 0 0 5px;}



  6. #ddmenu > ul > li > a:after{ content:''; position:absolute; border-right:1px solid; top:-1px; bottom:-1px; right:-2px; z-index:99; }



  7. #ddmenu ul li.has-sub:hover > a:after{top:0; bottom:0;}



  8. #ddmenu > ul > li.has-sub > a:before{ content:''; position:absolute; top:18px; right:6px; border:5px solid transparent; border-top:5px solid #fff; }



  9. #ddmenu > ul > li.has-sub:hover > a:before{top:19px;}



  10. #ddmenu ul li.has-sub:hover > a{ background:#3f3f3f; border-color:#3f3f3f; padding-bottom:13px; padding-top:13px; top:-1px; z-index:999; }



  11. #ddmenu ul li.has-sub:hover > ul, #ddmenu ul li.has-sub:hover > div{display:block;}



  12. #ddmenu ul li.has-sub > a:hover{background:#3f3f3f; border-color:#3f3f3f;}



  13. #ddmenu ul li > ul, #ddmenu ul li > div{ display:none; width:auto; position:absolute; top:38px; padding:10px 0; background:#3f3f3f; border-radius:0 0 5px 5px; z-index:999; }



  14. #ddmenu ul li > ul{width:200px;}



  15. #ddmenu ul li > ul li{display:block; list-style:inside none; padding:0; margin:0; position:relative;}



  16. #ddmenu ul li > ul li a{ outline:none; display:block; position:relative; margin:0; padding:8px 20px; font:10pt Arial, Helvetica, sans-serif; color:#fff; text-decoration:none; text-shadow:1px 1px 0 rgba(0,0,0, 0.5); }



  17.  



  18.  



  19. #ddmenu, #ddmenu > ul > li > ul > li a:hover{ background:#333333; background:-moz-linear-gradient(top, #333333 0%, #222222 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#333333), color-stop(100%,#222222)); background:-webkit-linear-gradient(top, #333333 0%,#222222 100%); background:-o-linear-gradient(top, #333333 0%,#222222 100%); background:-ms-linear-gradient(top, #333333 0%,#222222 100%); background:linear-gradient(top, #333333 0%,#222222 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#222222',GradientType=0 ); }



  20. #ddmenu{border-color:#000;}



  21. #ddmenu > ul > li > a{border-right:1px solid #000; color:#fff;}



  22. #ddmenu > ul > li > a:after{border-color:#444;}



  23. #ddmenu > ul > li > a:hover{background:#111;}




Anda juga bisa hanya dengan SATE (Salin Tempel) alias Copy Paste dari kode yang sudah ada disini, silahkan dikembangkan pada website anda.
Idea Source : http://dosen.unived.ac.id

Sabtu, 26 Juli 2014

Posted by Huai
No comments | 02.53

Koneksi Database MySQL di PHP


MySQL merupakan database yang paling sering dipasangkan dengan PHP. Artikel berikut menunjukkan code PHP untuk melakukan koneksi ke database MySQL dan melakukan query.

Membuka dan Menutup Koneksi MySQL

Untuk melakukan koneksi ke MySQL gunakan perintah berikut :

mysql_connect(nama_host, nama_user, password)

atau

$var_koneksi = mysql_connect(nama_host, nama_user, password)

dan untuk menutup koneksi kita gunakan :

mysql_close()

atau

mysql_close($var_koneksi)

Sebagai contoh, misalkan kita ingin melakukan koneksi ke server "localhost" kita dengan user "root" tanpa password (kosong). Berikut adalah contoh scriptnya :

<?php
        error_reporting(0);
        $koneksi = mysql_connect("localhost","root","") or die("Koneksi Gagal !" . mysql_error());
        if($koneksi) echo "Koneksi Berhasil";
        mysql_close($koneksi);
?>

Berikut adalah screenshot dari halaman php tersebut jika koneksi berhasil atau gagal.


Memilih Database

Setelah koneksi berhasil saatnya kita memilih database yang akan kita gunakan, berikut adalah syntax perintahnya :

mysql_select_db ( nama_database )

atau

mysql_select_db ( nama_database, $var_koneksi)

Berikut adalah contoh scriptnya :

<?php
        error_reporting(0);
       
        $koneksi = mysql_connect("localhost","root","") or die("Koneksi Gagal !" . mysql_error());
        if($koneksi) echo "Koneksi Berhasil";
 
        $db = mysql_select_db("phi_minimart_master") or die("Database tidak ada !" . mysql_error());
       
        echo "<br />";
       
        if($db) echo "Database phi_minimart_master berhasil dibuka !";
 
        mysql_close($koneksi);
?>
Dan jika berhasil maka tampilan akan terlihat seperti pada gambar berikut ini.



Happy Coding Kawan
Free Copy Asal Berbagi -Maulanalfans-

Source : http://mysql.phi-integration.com/php-mysql/menggunakan-database-mysql-di-php
Posted by Huai
No comments | 02.10
Code Warna Pada HTML

Warna adalah sebuah reseprentasi dari spektrum tertentu yang didalamnya terdapat cahaya dan panjang gelombang cahaya yang mengikutinya. Didalam citra digital warna umumnya terdiri atas 2 yaitu hitam dan putih (warna sempurna) atau disebut Grayscale. Sedangkan macam-macam jenis warna lainnya itu disebut True Color seperti merah, biru, hijau, kuning. True Color ini terdapat 2 macam pengelompokkan yaitu RGB (Red Green Blue ),CMYK( Cyan Magenta Yellow Black ), Sedangkan metode sistem model dari warna yaitu HSV (Hue Saturation Value ) dan HSL ( Hue Saturation and Lightness ).

Kode heksadesimal adalah 3 atau 6 karakter kode yang sering digunakan dalam HTML dan CSS untuk memberitahu browser atas satu warna untuk ditampilkan. Jadi misalnya, #fff  atau #FFFFFF adalah kode warna untuk menghasilkan warna putih pada sebuah halaman web anda.

Dibawah ini terdapat daftar kode-kode warna lengkap untuk membuat Kode Warna CSS atau html dalam merancang halaman web, atau metode untuk menggambarkan dan menentukan warna tersebut.
#FFFFFF#FFFFCC#FFFF99#FFFF66#FFFF33#FFFF00
#FFCCFF#FFCCCC#FFCC99#FFCC66#FFCC33#FFCC00
#FF99FF#FF99CC#FF9999#FF9966#FF9933#FF9900
#FF66FF#FF66CC#FF6699#FF6666#FF6633#FF6600
#FF33FF#FF33CC#FF3399#FF3366#FF3333#FF3300
#FF00FF#FF00CC#FF0099#FF0066#FF0033#FF0000
#CCFFFF#CCFFCC#CCFF99#CCFF66#CCFF33#CCFF00
#CCCCFF#CCCCCC#CCCC99#CCCC66#CCCC33#CCCC00
#CC99FF#CC99CC#CC9999#CC9966#CC9933#CC9900
#CC66FF#CC66CC#CC6699#CC6666#CC6633#CC6600
#CC33FF#CC33CC#CC3399#CC3366#CC3333#CC3300
#CC00FF#CC00CC#CC0099#CC0066#CC0033#CC0000
#99FFFF#99FFCC#99FF99#99FF66#99FF33#99FF00
#99CCFF#99CCCC#99CC99#99CC66#99CC33#99CC00
#9999FF#9999CC#999999#999966#999933#999900
#9966FF#9966CC#996699#996666#999933#999900
#9933FF#9933CC#993399#993366#993333#993300
#9900FF#9900CC#990099#990066#990033#990000
#66FFFF#66FFCC#66FF99#66FF66#66FF33#66FF00
#66CCFF#66CCCC#66CC99#66CC66#66CC33#66CC00
#6699FF#6699CC#669999#669966#669933#669900
#6600FF#6600CC#660099#660066#660033#660000
#6666FF#6666CC#666699#666666#666633#666600
#6633FF#6633CC#663399#663366#663333#663300
#33FFFF#33FFCC#33FF99#33FF66#33FF33#33FF00
#33CCFF#33CCCC#33CC99#33CC66#33CC33#33CC00
#3399FF#3399CC#339999#339966#339933#339900
#3366FF#3366CC#336699#336666#336633#336600
#3333FF#3333CC#333399#333366#333333#333300
#3300FF#3300CC#330099#330066#330033#330000
#00FFFF#00FFCC#00FF99#00FF66#00FF33#00FF00
#00CCFF#00CCCC#00CC99#00CC66#00CC33#00CC00
#0099FF#0099CC#009999#009966#009933#009900
#0066FF#0066CC#006699#006666#006633#006600
#0033FF#0033CC#003399#003366#003333#003300
#0000FF#0000CC#000099#000066#000033#000000
Free Copy asalkan berbagi
Happy Coding - Maulnalafans-

Source : http://www.impoint.info/2013/07/kode-warna-html.html#axzz38Y8fjF5o