Minggu, 15 Oktober 2017

Tutorial Membuat Login Sederhana Dengan Php dan MySQL

Assalamualaikum Warohmatullah Hiwabarokatu

postingan kali ini akan melanjutkan pembahasan sebelumnya yaitu Tutorial Membuat tutorial-koneksi-php-ke-database-mysql


Nah, karena pada postingan sebelumnya sudah melakukan koneksi php ke Database Mysql maka sekarang kita akan membuat Login sederhana dengan Php dan Mysql.

      1. Pastikan Xampp telah Start.


  2. Membuka web browser dengan alamat “localhost/dashboard” dan membuka PypMyAdmin


      3. Karena pada postingan sebelumnya kita sudah membuat Database dan Table selanjutnya isi tabel "user" sesuai keinginan anda




4        4. Tahap ini kita akan membuat folder "admin" yang berada di dalam folder "praktikum" dengan 3 file yang berisi script login  yang akan kita buat.

         5. Sekarang buka Sublime Text 3  untuk melakukan / pengisian Script

      
       6. Selanjutnya buka akses halaman admin  di browser "localhost/praktikum/admin"















































Tutorial Koneksi Php ke Database MySQL

Assalamualaikum Warohmatullah Hiwabarokatu

Kali ini saya akan membahas cara meng-koneksi-kan atau menghubungkan Php ke DatabaseMysql dengan menggunakan PhpMyAdmin "Xampp"


  1.  Melakukan pengecekan pada control Xampp dan memastikan Xampp telah Start.

  2. Membuka web browser dengan alamat “localhost/dashboard” dan membuka PypMyAdmin
  3. Membuat Database / Basis Data "praktikum", pertama klik menu "Database" seperti gambar di bawah ini
  4. Selanjutnya buatlah database nya "praktikum" dan klik tombol create
  5. Membuat tabel pada database "praktikum" dengan banyak field 5                


      
      6. Membuat folder pada Htdocs yang terletak di dalam Xampp dengan nama folder "praktikum"  (untuk penamaan folder boleh sesuaikan keinginan sobat)

   

      7Selanjutnya adalah tahap membuat script koneksi PHP ke database Mysql, pertama-tama buka tools sublime text 3 sebagai aplikasi untuk membuat script. ketik script seperti dibwah ini dengan nama file conn.php yang berada di dalam folder "conn"


       8.  Nah sekarang saatnya melihat hasil dari koneksi yang telah dibuat dengan membuka browser dengan alamat "localhost/praktikum" maka akan tampil gambar seperti dibawah ini jika koneksinya berhasil.








































Senin, 02 Oktober 2017

Tutorial Membuat Website sederhana

Sebelum membuat Website dengan famework kita harus memilih terlebih dahulu framework apa yang akan kita gunakan, disini saya akan menggunakan framework Bootstrap, berikut langkah-langkah membuat website dengan bootstrap,

1. Download terlebih dahulu bootstrap pada link berikut getbootstrap.com Seperti pada gambar               berikut



 2.   Setelah mendownload bootstrap, sebelum menggunakan kita harus menginstalnya terlebih dahulu.


 3.  Setelah menginstal Bootstrap kita pilih aplikasi apa yang akan kita gunakan misalnya seperti
      notepad++, sublime Dll

 4.  Lalu simpan Boostrapnya di local disk c pilih folder Xampp > htdoch > praktikum > asset > css.



 5.   Dan Jquery saya simpan di folder Xampp > praktikum > asset > js


6. Setelah itu tambahkan scrip seperti berikut.



agar website responsive terhadap perangkat mobile Untuk memastikan render yang tepat dan sentuhan zooming, tambahkan berikut <meta> tag dalam<head> elemen
  • meta tag sendiri adalah rangkaian kode HTML yang biasa digunakan untuk mempermudah Google dan browser untuk mengidentifikasi seluruh konten yang ada dalam website tersebut.
  • meta charset="utf-8" Universal Character Set, atau yang umum disebut sebagai Charset adalah kumpulan dari beberapa jenis pengkodean karakter baik huruf, angka, symbol, dll. Untuk untuk saat ini pengkodean UTF-8 telah menjadi standarisasi untuk pengkodean dalam system operasi, bahasa pemrograman, API, dan software.
  • width=device-width Bagian menetapkan lebar halaman untuk mengikuti layar-lebar perangkat (yang akan bervariasi tergantung pada perangkat).

 7. Setelah itu masukan perintah seperti berikut maka :

 8. Dan berikut hasil nya
 9. Setelah itu kita akan membuat menu navigator terlebih dahulu dengan perintah berikut ini 

 10. Dan berikut hasil perintah diatas

 11. Lalu masukan perintah berikut dan desain dengan kreasi kita
 12. Berikut Hasilnya

 13. Setelah itu kita akan memberikan hak paten atas karya kita bias kita menggunakan perintah                  berikut 

 14. Dan berikut hasilnya
           




















Tutorial Menggunakan Framwork

Framework atau bahasa indonesianya kerangka kerja adalah sebuah software untuk memudahkan para programmer membuat aplikasi atau web yang isinya adalah berbagai fungsi, plugin, dan konsep sehingga membentuk suatu sistem tertentu. Dengan menggunakan framework, sebuah aplikasi akan tersusun dan terstruktur dengan rapi.
Namun, menggunakan framework bukan berarti kita bebas dari pengkodean. Kita sebagai pengguna/programmer menggunakan variabel dan fungsi-fungsi yang ada di sebuah framework itu. Karena itulah, kerja kita bisa menjadi efektif karena tidak harus membuat fungsi-fungsi lagi. Untuk lebih memahaminya, 

  1. Pertama kali yang di lakukan adalah instal Bootsrapnya dan kamu dapat mendownloadnya di website resminya di getbootsrap.com
  2. Setelah selesai mendownload kita akan mendapatkan sebuah file zip dengan nama bootstrap-4.0.0-beta-dist
  3. Exrak file Bootsrapnya     


   4. Kemudian save di sebuah folder yang kamu tentukan, LocalDisk(C:) > xampp > htdoc >                      praktikum >  asset



    5. Selanjutnya buat file nama Index.php  Save file tersebut di dalam folder praktikum, kemudian 
        tulis sourc codenya


    Yang Perlu di Perhatikan Adalah

     a. Pastikan Link stylesheet Bootsrap mengarah pada file yang tepat dimana file CSS Bootsrap                  berada, relatif terhadap file HTML yang memanggil


     b. Pastikan JavaScript Bootsrap mengarah pada path yang tepat dimana file JavaScript Bootsrap              berada, relative terhadap file HTML yang memanggil

       Karena pada contoh, file Index.php yang kita buat dalam folder Praktikum dan di dalamnya                sudah ada file Bootsrap maka filenya bisa kita asset/js/bootsrap.min.js, jika nanti kamu                      membuat file index.php nya tidak seperti path yang kita buat diatas tidak masalah tinggal di                sesuaikan saja path nya
   
      c. Pastikan JQuery terpanggil
         Boostrap membutuhkan JQuery agar berjalan dengan sempurna karena JavaSript nya Bootsrap            tidak akan bekerja jika tidak ada JQuery.so pastikan JavaScript nya terpanggil dengan baik.


        Demikian Tutorial penggunaan Bootsrap dari saya, TERIMAKASIH