Pengenalan Web

 

Pengenalan tentang Web

Berikut pengenalan singkat, ringkas, dan praktis tentang web — cocok untuk pemula yang ingin paham konsep dasar, komponen, cara kerja, dan langkah belajar selanjutnya.

Web (World Wide Web) adalah kumpulan dokumen (halaman web) yang saling terhubung melalui link dan dapat diakses lewat internet menggunakan browser (mis. Chrome, Firefox). Halaman web biasanya berisi teks, gambar, video, dan aplikasi interaktif.

    Komponen utama dari sebuah web

• Browser (client): Aplikasi pengguna untuk membuka halaman web.

• Server: Komputer yang menyimpan file, data, dan menjalankan aplikasi web.

• HTTP/HTTPS: Protokol komunikasi antara browser dan server. HTTPS adalah versi aman (terenkripsi).

• Domain & DNS: Nama domain (mis. contoh.com) diterjemahkan ke alamat IP lewat DNS.

• Database: Menyimpan data dynamic (user, produk, postingan).

    Struktur dasar dari web

• HTML — struktur dan konten (judul, paragraf, tabel).

• CSS — tata letak dan gaya visual (warna, font, layout).

• JavaScript — interaksi dan dinamis (form validasi, tombol, fetch data).

Catatan: Praktik baik — pisahkan HTML dan CSS (dan JS) ke file terpisah agar rapi dan mudah dipelihara.

    Frontend, Backend, dan API

• Frontend: Apa yang dilihat dan diinteraksikan pengguna (HTML, CSS, JS, framework seperti React/Vue).

• Backend: Logika aplikasi dan penyimpanan data (bahasa: PHP, Node.js, Python, Java; database: MySQL, PostgreSQL, MongoDB).

• API: Antarmuka yang memungkinkan frontend dan backend berkomunikasi (mis. REST, GraphQL).

    Cara kerja singkat

1. Pengguna ketik URL → browser kirim request ke server via HTTP.

2. Server menerima, memproses, dan mengirim balik response (HTML/CSS/JS/data).

3. Browser merender halaman; JavaScript dijalankan untuk interaksi lanjutan.

4. Jika perlu data lebih lanjut, frontend bisa memanggil API (AJAX / fetch).

    Teknologi andalan & istilah yang sering muncul

• Responsive design: Desain web yang menyesuaikan ukuran layar (mobile-first).

• Framework CSS: Bootstrap, Tailwind.

• Framework JS: React, Vue, Angular.

• Version control: Git / GitHub.

• Deployment: Netlify, Vercel, DigitalOcean, Heroku.

• CMS: WordPress, Joomla (untuk website tanpa banyak coding).

    Keamanan dasar yang perlu diperhatikan

• Selalu gunakan HTTPS.

• Validasi input di frontend dan backend (hindari SQL injection, XSS).

• Simpan password dengan hashing (mis. bcrypt).

• Batasi akses file sensitif dan gunakan mekanisme autentikasi/otorisasi.

    Aplikasi web sehari-hari

• Situs berita, toko online (e-commerce), aplikasi perbankan, dashboard internal perusahaan, blog, dan layanan streaming.

    Peluang belajar & karir

• Peran: Frontend Developer, Backend Developer, Full-Stack Developer, DevOps, UI/UX Designer.

• Jalur belajar: dasar HTML → CSS → JavaScript → framework frontend → dasar backend + database → deployment + security.

• Praktik: bangun proyek sederhana (portofolio, blog, toko kecil).

    Langkah cepat untuk memulai

1. Pelajari HTML dasar; buat halaman sederhana.

2. Tambahkan CSS eksternal (file .css yang terpisah).

3. Pelajari JavaScript untuk interaksi dasar.

4. Pelajari Git untuk versi kontrol.

5. Deploy proyek pertama ke layanan gratis (mis. GitHub Pages, Netlify).