Tips Trik membuat Web di Localhost (how to made web in localhost)

Dapet tugas kuliah buat web secara offline? alias localhost? ga usah bingung-bingung cari tutorial, sekarang admin akan kasi kamu tips sederhana untuk buat web secara offline.



1. pertama-tama kamu buka dulu/ download tempalte gratis dari admin ini:
     >> free download template Blue Corporation , download

2. Selanjutnya kamu buka editting web kamu, disini admin kasi contoh pakai notepad ++ aja ya, yaa yang 
    free aja
   >> belum punya? download disini aja, free download notepad ++, download

3. Nah kamu mesti instal penyimpan databasenya dulu, okeeh.
   >> belum punya juga?? waduuuh, ayoo download sini dlu. free downlaod XAMPP, download
   >> atau kamu bisa pakai Wamp Server, cara pemakaiannya atau cara install nya bisa kamu liat di 
        postingan admin "XAMPP atau Wamp Server? Cara Pakenya"
        free download Wamp Server, download

4. Sudahkah kamu instal xampp atau Wamp? selanjutnya kamu buka file bluecorporation yang sudah kamu   
    download tadi dan ubah "index.html" menjadi "index.php".. sudahkan?
    setelah itu silahkan buat sebuah database,, caranya:

  1. Buka mesin pencari anda, bisa pakai mozila, crome, atau yang lainnya.
  2. Lalu buka alamat url: http://localhost/phpmyadmin/
  3. Selanjutnya Create Database
  4. misalnya kamu buat dengan nama: mahasiswa
  5. setelah itu buka database mahasiswa dibelah kanan layar,
  • selanjutnya kamu buka database mahasiswa itu, "Create table on database mahasiswa"
  • buat tabel dengan Name:"Nilai", Number of columns: 5



  • Nah kamu sidah memiliki satu database dan satu tabel didalamnya :D .. selamat ya
setelah membuat database langkah selanjutnya, yaitu kamu membuka file index.php yang tadi telah kamu download dan kamu ubah nama file index.html menjadi index.php. dan buat juga file dengan nama "connect.inc" dan letakkan satu folder dengan folder bluecorporation
kalian bisa membuatnya dengan file text terlebih dahulu, namun extensi nya diganti jadi .inc
nah lalu buka dan isi source code koneksi database berikut ini:

<?php
#*****koneksi ke mysql****#
$host = "localhost";
$user = "root";
$pass = "";
$dbname = "mahasiswa";
$conn = mysql_connect($host,$user,$pass);
if($conn){
$sele = mysql_select_db($dbname);
if(!$sele){
echo mysql_error();
}
}
#******akhir koneksi***#
?>

  • Rename atau ubah nama folder bluecorporation menjadi web_mhs
  • Copy folder dan letakkan pada C:\xampp\htdocs
  • Paste folder pada C:\xampp\htdocs
  • Langkah selanjutnya kamu berkutat di index.php
  • Buka index.php
copy source code berikut ini dan letakkan paling atas coding php, berfungsi untuk memanggil database yang dibuat

<?
include "connect.inc";
?>

hapus source code berikut ini:

          <p>Posted on 18. Sep, 2015 by Sara in Filed under templates, internet, with Comments 18</p>
 
          <img src="images/img_1.jpg" width="617" height="197" alt="" />
          <div class="clr"></div>
          <p>This is a free CSS website template by CoolWebTemplates.net. This work is distributed under the <a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons Attribution 3.0 License</a>, which means that you are free to use it for any personal or commercial purpose provided you credit me in the form of a link back to CoolWebTemplates.net.</p>
          <p><a href="#">Read more </a></p>
        </div>
        <div class="article">
          <h2><span>Aliquam Risus</span> Justo</h2>
          <div class="clr"></div>
          <p>Posted on 18. Sep, 2015 by Sara in Filed under templates, internet, with Comments 18</p>
          <img src="images/img_2.jpg" width="617" height="197" alt="" class="fl" />
          <div class="clr"></div>
          <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. <br />
            Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Donec mattis, purus nec placerat bibendum, dui pede condimentum odio, ac blandit ante orci ut diam. Cras fringilla magna.</p>
          <p><a href="#">Read more </a></p>

setelah dihapus ganti menjadi source code berikut, source code ini digunakan untuk menampilkan data yang terdapat database yang dibuat sebelumnya. namun ingat, bahwa pada tabel yang sudah dibuat kalian sudah memasukkan data.

selanjutnya copy coding php ini dan letakkan di tempat kosong yang telah dihapus sebelumnya,


<table width="500" border="0" align="center">
    <tr>
      <td width="100" align="center" bgcolor="#666666">NIM</td>
      <td width="200" align="center" bgcolor="#666666">Nama</td>
      <td width="30" align="center" bgcolor="#666666">Kelas</td>
      <td width="20" align="center" bgcolor="#666666">Kelamin</td>
      <td width="50" align="center" bgcolor="#666666" colspan="2">Nilai</td>
      </tr>
 <?php
 $sql=mysql_query("SELECT * FROM `nilai`");
while ($row=mysql_fetch_array($sql)){
$nim = $row['nim_mhs'];
$nama = $row['nama_mhs'];
$kls = $row['kls_mhs'];
$kelamin = $row['kelamin'];
$nilai = $row['nilai'];
$no++;

echo"<tr>
 <td align=\"right\">$no</td>
 <td align=\"center\">$nim </td>
 <td align=\"center\">$nama</td>
 <td align=\"center\">$kls</td>
 <td align=\"left\">$kelamin</td>
 <td align=\"center\">nilai</td>
</tr>";
}
?>
</table>  


jadi intinya, kalian akan memanggil seluruh data yang ada pada database dan dimasukkan kedalam tabel dan kemudian ditampilkan pada browser.
untuk melihat hasilnya, buka firefox, atau internet explorer atau apalah yang kalian pnya untuk browsing, lalu masukkan url: localhost/web_mhs
jika tidak muncul tampilan, pastikan kalian sudah menjalankan XAMPP dalam keadaan start (Apache dan MySql) seperti gambar dibawah ini:


okeey.. sekian Tips Trik membuat Web di Localhost (how to made web in localhost) , semoga bermanfaat. kalau ada kendala dan masalah bisa coment disini :D




No comments

Post a Comment

Powered by Blogger.