Sabtu, 30 September 2017

TUTORIAL MEMBUAT WEBSITE SEDERHANA DENGAN FRAMWORK

Posted on September 30, 2017by with No comments
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 Framework

Posted on September 30, 2017by with No comments
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














































Langganan: Postingan (Atom)