»  Kunci Saya Belajar Web
Kunci Saya Belajar Web
Kunci Saya Belajar Web

Kunci Saya Belajar Web

Mei 03, 2018 • •

Kunci Belajar Web

  • Pelajari HTML
    Bagian dasar sebuah web adalah salah satunya adalah HTML, saya mengawali pembelajaran web ini dengan apa itu HTML dan bagian-bagian HTML yang nantinya akan saya gunakan ketika membuat sebuah web.
  • Pelajari CSS
    Ketika sebuah HTML ibarat sebuah patung manekin, maka CSS adalah pakaian yang akan mempercantik tampilannya, disitulah fungsi CSS. Semakin kesini perkembangan CSS pun semakin banyak yang harus dipelajari.
  • Pelajari Javascript
    Java script menjadi bagian penyempurna untuk sebuah web setelah HTML dan CSS. Pengembangan dan modifikasi kode yang bisa kita lakukan dengan Javascript.
  • Googling Materinya
    Jaman sekarang sudah sangat dimudahkan ketika kita sudah mentok dan kebingungan dalam pembuatan sebuah web. Disaat itulah fungsi google sangat dibutuhkan.
  • Sharing di Forum
    Tanpa harus bertatap muka dalam belajarnya, forum internet bisa menjadi solusi ketika kita menemukan kendala, banyak orang yang akan membantu. Selain forum bisa juga bergabung di channel atau grup-grup social media seperti whatsapp dan telegram.
  • Luangkan Waktu
    Belajar sesuatu memang harus bisa membagi dan meluangkan waktu dari kegiatan sehari-hari sebagai salah satu pengorbanan yang nantinya akan menghasilkan ilmu yang kita perlukan.

Dasar template dengan Bootstrap

Berikut adalah dasar template bootstrap yang biasa saya pakai dalam belajar membuat sebuah halaman website.

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

    <!-- Option 2: Separate Popper and Bootstrap JS -->
    <!--
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
    -->
  </body>
</html>

Dari dasar template itu kita bisa banyak mengembangkan kode lain baik itu untuk tampilan maupun nantinya isi dari web yang kita buat. Dan jangan lupa mempelajari bagian-bagian dasar penting lainnya yang bisa kita gunakan nantinya.

Pengembangan web

Bootstrap memang salah satu framework CSS yang banyak digunakan oleh segelintir web programmer. Namun sebenarnya kalau kita sudah belajar banyak tentang dunia web yang nantinya bukan hanya membuat Front end tapi juga lebih berkembang ke bagian back end. Bahkan nantinya akan mengarah kepada web yang berhubungan dengan database. Untuk itu jangan berhenti belajar karena teknologi semakin kesini semakin berkembang begitupun dunia coding.

Copy Paste

Tak dapat saya pungkiri dalam proses pembelajarannya saya pribadi banyak copy paste kode-kode dari beberapa sumber. Namun memang dalam tahap copy paste pun kita sambil mempelajarinya. Karena dengan begitu, saya akan semakin mencari banyak sumber dan secara tidak langsung menambah informasi mengenai dunia web programming.

Inspirasi Belajar Web

  • Github
    Tempat saya mencari project-project dan source code yang bisa jadi bahan pelajaran.
  • Bootstrap
    Salah satu framework yang selalu jadi dasar pembuatan web, termasuk blog ini, 90% CSS nya menggunakan bootstrap.
  • Google Font
    Tulisan yang bagus akan semakin menarik ketika font yang dipakai juga menarik dan terlihat elegant, google font membantu saya dalam hal ini.
  • Font Awesome
    Gambar berformat .png mungkin sudah sangat jarang dipakai untuk icon pendukung sebuah web atau blog setelah font awesome ini muncul.
  • CSS Compressor
    Merapihkan bagian CSS merupakan salah satu hal yang menjadi bagian dalam melakukan coding sebuah web bagi saya.
  • W3School
    Bahkan ketika awal saya berkenalan dengan HTML dasar, w3school adalah inspirasi yang sangat membantu.
  • CSS Gradient
    Salah satu color pallete yang saya gunakan untuk mengambil warna-warna menarik, selain beberapa web color pallete yang lain.
  • Firebase google
    Sebagai hosting yang saya pakai untuk menyimpan file-file CSS, Js dan yang lainnya. Sebelumnya saya menggunakan Googlesite.
Tags :

« Next article

older article »