Ingin jadi web developer tapi bingung mulai dari mana? Tenang di bawah ini ada daftar situs pembelajaran web yang kurasinya fokus ke kualitas materi, konsistensi update, dan dukungan komunitas. Ada jalur gratis, berbayar, proyek nyata, hingga roadmap karier.

1) MDN Web Docs (Mozilla) – “Kitab Suci” Front-End

Panduan resmi yang superlengkap untuk HTML, CSS, dan JavaScript. Bagian Learn Web Development memberikan jalur belajar bertahap dari pemula hingga menengah, plus referensi API yang selalu up-to-date. Cocok sebagai referensi utama harian.

2) freeCodeCamp – Kurikulum Gratis + Sertifikasi

Track Responsive Web Design membuatmu menguasai HTML & CSS lewat latihan interaktif dan proyek. Ada juga sertifikasi lain (JS, Front End Libraries, dsb.)—semuanya gratis dan berbasis proyek.

3) The Odin Project – Path Full-Stack Berbasis Proyek

Belajar dengan membangun. Path Full Stack JavaScript menyusun materi dari HTML/CSS, JavaScript, sampai Node.js—tiap modul punya proyek realistis. Sangat kuat untuk portofolio.

4) Frontend Mentor – Asah Skill dengan Desain Nyata

Kamu akan mengerjakan tantangan berdasarkan desain Figma: dari komponen kecil sampai aplikasi. Ada level gratis dan Pro; bagus untuk melatih pixel-perfect, responsif, dan aksesibilitas. 

5) web.dev (Google) – Praktik Modern & Kinerja

Pusat artikel praktik terbaik web modern dari tim Chrome/Google: performa, PWA, aksesibilitas, dan Core Web Vitals—materi yang penting buat SEO & UX.

6) JavaScript.info – Tutorial JS Modern dari Dasar–Lanjut

Penjelasan runtut, contoh jelas, dan latihan. Bagus untuk memperkuat fundamental JS “zaman now” (event loop, async, modul, class).

7) Smashing Magazine – Artikel Mendalam untuk Praktisi

Majalah online dengan artikel panjang soal CSS, JS, aksesibilitas, dan UX. Cocok ketika kamu sudah bisa koding dan ingin naik level dengan best practice. 

8) CSS-Tricks (Arsip Emas CSS)

Banyak trik, pola, dan penjelasan CSS/Front-End yang legendaris. Kini berada di bawah DigitalOcean, tapi arsipnya tetap sangat berguna. 

9) roadmap.sh – Peta Belajar & Skill Checklist

Bukan kursus, melainkan peta yang menunjukkan apa saja yang perlu dipelajari untuk jadi Front-End/Back-End, lengkap versi PDF yang baru diperbarui. Pakai sebagai kompas agar belajar tetap terarah. 

10) Scrimba – Kursus Interaktif (Screencast yang Bisa Disunting)

Belajar lewat “scrim”: video yang bisa kamu pause lalu edit kodenya langsung di player. Path Frontend Developer kolaborasi dengan MDN, ada modul gratis dan berbayar.

11) Coursera – Spesialisasi Terkurasi (Berbayar/Opsi Beasiswa)

MOOC dari universitas/perusahaan ternama. Cocok kalau kamu butuh struktur akademik dan sertifikat. (Model bisnisnya: langganan spesialisasi/sertifikat.) 

12) Udemy – Kursus Populer Berbasis Proyek

Banyak pilihan kursus web (React/Next, Node, dsb.) dengan harga promo. Pilih instruktur bereputasi dan cek kurikulum + update terakhir sebelum membeli. (Catatan: katalog dinamis—lakukan due diligence). (Rujukan umum: platform kursus komersial; tidak ada satu halaman “resmi” untuk semua kursus).

13) Dicoding (Bahasa Indonesia) – Kurikulum Industri + Komunitas

Learning path Front-End Web Developer dengan kelas Pemula→Fundamental. Banyak materi praktikal (DOM, event, Web Storage, ES6, Web Component, build tools) dan dukungan komunitas lokal.

14) Frontend YouTube (Pilihan Kurasi)

Channel-channel seperti playlist pengantar front-end & coaching teknis juga berguna buat pemula pilih yang struktur materinya jelas dan ada demo langsung.

15) Komunitas & Forum (Untuk Feedback Cepat)

Subreddit Frontend, learnprogramming, dan diskusi terkait platform (mis. Scrimba/Frontend Mentor) membantu dapat masukan, review kode, serta tips karier.

Sekian semoga bermanfaat !!!