{"id":35201,"date":"2025-06-30T13:30:28","date_gmt":"2025-06-30T06:30:28","guid":{"rendered":"https:\/\/jakarta.telkomuniversity.ac.id\/?p=35201"},"modified":"2025-06-30T15:16:06","modified_gmt":"2025-06-30T08:16:06","slug":"checklist-belajar-web-pemula-langkah-yang-wajib-dikuasai","status":"publish","type":"post","link":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/checklist-belajar-web-pemula-langkah-yang-wajib-dikuasai\/","title":{"rendered":"Checklist Belajar Web Pemula: Langkah yang Wajib Dikuasai"},"content":{"rendered":"
\n\t
\n\t\t\n\t\t
\n\t\t\t
\"Checklist<\/div>\n\t\t<\/figure>\n\t<\/div>\n<\/div><\/div><\/div>
\n\t
\n\t\t
\n\t\t\t

Membuat website adalah salah satu keterampilan digital paling penting di era modern ini. Bagi kamu mahasiswa Telkom University Jakarta, baik dari jurusan Informatika, Desain Komunikasi Visual, kemampuan membangun website bisa menjadi pondasi penting untuk menunjang tugas, portofolio, hingga karier masa depan.<\/p>\n

Namun setelah mempelajari dasar seperti HTML dan CSS, banyak pemula bertanya: \u201cSelanjutnya saya harus belajar apa?\u201d<\/strong> Artikel ini akan membimbing kamu melalui checklist lengkap<\/strong> pembelajaran website secara bertahap dan sistematis.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div>

\ud83c\udfaf Tahap 1: Penguasaan Dasar (Fundamental)<\/h2>\n\t
\n\t\t
\n\t\t\t

\u2705 1. HTML (HyperText Markup Language)<\/h3>\n
    \n
  • \n

    Struktur dasar halaman<\/p>\n<\/li>\n

  • \n

    Tag umum: <div><\/code>, <p><\/code>, <h1><\/code>, <img><\/code>, <a><\/code>, dll<\/p>\n<\/li>\n

  • \n

    Formulir: <form><\/code>, <input><\/code>, <textarea><\/code>, <button><\/code><\/p>\n<\/li>\n<\/ul>\n

    \ud83d\udd0d Kenapa penting?<\/em> HTML adalah \u201ctulang\u201d dari semua website.<\/p>\n

    \u2705 2. CSS (Cascading Style Sheets)<\/h3>\n
      \n
    • \n

      Selektor, class, ID<\/p>\n<\/li>\n

    • \n

      Properti warna, margin, padding, border, font, dll<\/p>\n<\/li>\n

    • \n

      Layout dasar: Flexbox dan Grid<\/p>\n<\/li>\n

    • \n

      Media query untuk desain responsif<\/p>\n<\/li>\n<\/ul>\n

      \ud83d\udd0d Kenapa penting?<\/em> CSS membuat website kamu enak dilihat dan nyaman di berbagai perangkat.<\/p>\n

      \u2705 3. Dasar JavaScript<\/h3>\n
        \n
      • \n

        Variabel, kondisi (if<\/code>), perulangan (for<\/code>, while<\/code>)<\/p>\n<\/li>\n

      • \n

        Fungsi dan event (seperti onclick<\/code>)<\/p>\n<\/li>\n

      • \n

        Manipulasi DOM (misalnya mengganti teks\/gambar dari script)<\/p>\n<\/li>\n<\/ul>\n

        \ud83d\udd0d Kenapa penting?<\/em> JavaScript memberikan interaksi seperti tombol, form dinamis, dll.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div>

        \ud83e\uddf1 Tahap 2: Praktik Proyek Kecil<\/h2>\n\t
        \n\t\t
        \n\t\t\t

        \u2705 4. Buat Website Portfolio Pribadi<\/h3>\n
          \n
        • \n

          Tampilkan biodata, foto, keterampilan<\/p>\n<\/li>\n

        • \n

          Link ke media sosial dan proyek lainnya<\/p>\n<\/li>\n

        • \n

          Tambahkan sedikit JavaScript seperti animasi atau tombol interaktif<\/p>\n<\/li>\n<\/ul>\n

          \u2705 5. Buat Website Tugas Kuliah<\/h3>\n
            \n
          • \n

            Buat landing page untuk laporan tugas atau proyek akhir<\/p>\n<\/li>\n

          • \n

            Upload ke GitHub Pages untuk bisa diakses online<\/p>\n<\/li>\n<\/ul>\n

            \ud83d\udd0d Tujuannya?<\/em> Belajar sambil membangun proyek nyata untuk portofolio.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n\n\t

            \n\t\t\n\t\t
            \n\t\t\t
            \"Checklist<\/div>\n\t\t<\/figure>\n\t<\/div>\n<\/div><\/div><\/div><\/div>

            \ud83d\udcc8 Tahap 3: Level Menengah<\/h2>\n\t
            \n\t\t
            \n\t\t\t

            \u2705 6. Git & GitHub<\/h3>\n
              \n
            • \n

              Versi kontrol dengan Git<\/p>\n<\/li>\n

            • \n

              Menyimpan dan berbagi kode dengan GitHub<\/p>\n<\/li>\n

            • \n

              Buat GitHub Pages untuk menampilkan website kamu secara gratis<\/p>\n<\/li>\n<\/ul>\n

              \ud83d\udd0d Kenapa penting?<\/em> Git dan GitHub adalah standar industri untuk kerja tim dan portofolio.<\/p>\n

              \u2705 7. Framework CSS (Opsional)<\/h3>\n
                \n
              • \n

                Bootstrap<\/strong>: framework cepat untuk desain responsif<\/p>\n<\/li>\n

              • \n

                Tailwind CSS<\/strong>: utility-first CSS yang populer<\/p>\n<\/li>\n<\/ul>\n

                \ud83d\udd0d Kenapa penting?<\/em> Mempercepat proses styling dan mendukung praktik UI\/UX modern.<\/p>\n

                \u2705 8. JavaScript Lanjutan<\/h3>\n
                  \n
                • \n

                  Array dan objek<\/p>\n<\/li>\n

                • \n

                  Event listener<\/p>\n<\/li>\n

                • \n

                  Form validation<\/p>\n<\/li>\n

                • \n

                  Fetch API untuk ambil data dari server (misalnya data JSON)<\/p>\n<\/li>\n<\/ul>\n\n\t\t<\/div>\n\t<\/div>\n\n\t

                  \n\t\t\n\t\t
                  \n\t\t\t
                  \"Checklist<\/div>\n\t\t<\/figure>\n\t<\/div>\n<\/div><\/div><\/div><\/div>

                  \ud83d\udd25 Tahap 4: Level Lanjutan (Opsional tapi direkomendasikan)
                  \n<\/h2>\n\t
                  \n\t\t
                  \n\t\t\t

                  \u2705 9. Belajar Frontend Framework<\/h3>\n
                    \n
                  • \n

                    React.js<\/strong>: library frontend paling populer saat ini<\/p>\n<\/li>\n

                  • \n

                    Vue.js<\/strong> atau Svelte<\/strong> sebagai alternatif<\/p>\n<\/li>\n<\/ul>\n

                    \ud83d\udd0d Kenapa penting?<\/em> Framework ini digunakan oleh banyak perusahaan startup dan korporasi.<\/p>\n

                    \u2705 10. Belajar Backend (Server-Side)<\/h3>\n
                      \n
                    • \n

                      Dasar Node.js dan Express<\/p>\n<\/li>\n

                    • \n

                      Dasar-dasar API dan database (misalnya MongoDB atau MySQL)<\/p>\n<\/li>\n

                    • \n

                      Otentikasi pengguna<\/p>\n<\/li>\n<\/ul>\n

                      \ud83d\udd0d Kenapa penting?<\/em> Untuk membangun website dinamis seperti e-commerce, sistem login, dsb.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div>

                      \ud83d\udccc Checklist Belajar Website (Print \/ Simpan)<\/h2>\n\t
                      \n\t\t
                      \n\t\t\t

                      Berikut checklist ringkas yang bisa kamu simpan:<\/p>\n

                      \u2705 HTML Dasar
                      \u2705 CSS & Layout (Flexbox \/ Grid)
                      \u2705 JavaScript Dasar
                      \u2705 Proyek Website Portofolio
                      \u2705 Git & GitHub
                      \u2705 Desain Responsif (Mobile Friendly)
                      \u2705 JavaScript Menengah (Form, Event, DOM)
                      \u2705 Bootstrap atau Tailwind CSS
                      \u2705 Frontend Framework (React \/ Vue)
                      \u2705 Backend Dasar (Node.js \/ API \/ Database)<\/p>\n\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div>

                      \n\t
                      \n\t\t
                      \n\t\t\t

                      Belajar membuat website adalah proses bertahap. Tidak perlu terburu-buru menguasai semuanya sekaligus. Yang terpenting adalah konsistensi belajar dan praktik langsung<\/strong> melalui proyek kecil.<\/p>\n

                      Bagi kamu mahasiswa Telkom University Jakarta, mulailah dari dasar, lalu tingkatkan level kemampuanmu dari waktu ke waktu. Dengan mengikuti checklist ini, kamu bisa membangun website yang modern, profesional, dan siap dipakai dalam dunia kerja nyata.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div>

                      \n\t
                      \n\t\t\n\t\t
                      \n\t\t\t
                      \"Checklist<\/div>\n\t\t<\/figure>\n\t<\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"Membuat website adalah salah satu keterampilan digital paling penting di era modern ini. Bagi kamu mahasiswa Telkom University Jakarta, baik dari jurusan Informatika, Desain Komunikasi Visual, kemampuan membangun website bisa menjadi pondasi penting untuk menunjang tugas, portofolio, hingga karier masa depan. Namun setelah mempelajari dasar seperti HTML dan CSS, banyak pemula bertanya: \u201cSelanjutnya saya harus [...]","protected":false},"author":37,"featured_media":35203,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"wds_primary_category":0,"footnotes":""},"categories":[300],"tags":[1553,1554,1552],"class_list":["post-35201","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-pendidikan","tag-belajar-web-pemula","tag-checklist-belajar-web","tag-checklist-belajar-web-pemula-langkah-yang-wajib-dikuasai"],"_links":{"self":[{"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/posts\/35201","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/users\/37"}],"replies":[{"embeddable":true,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/comments?post=35201"}],"version-history":[{"count":5,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/posts\/35201\/revisions"}],"predecessor-version":[{"id":35216,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/posts\/35201\/revisions\/35216"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/media\/35203"}],"wp:attachment":[{"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/media?parent=35201"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/categories?post=35201"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jakarta.telkomuniversity.ac.id\/en\/wp-json\/wp\/v2\/tags?post=35201"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}