Masih Bikin To-Do List? Ini 5 Ide Project Web Dev Biar Portofolio Kamu Dilirik HRD

Jujur deh, folder project di laptop kamu isinya apa aja? Jangan bilang isinya cuma "Hello World", kalkulator sederhana, sama aplikasi To-Do List hasil ngikutin tutorial di YouTube?

Gak salah sih, itu bagus banget buat latihan logika dasar pas awal belajar. Tapi kalau tujuannya buat ngelamar magang atau kerja? Wah, sorry to say, recruiter mungkin bakal auto-skip CV kamu.

Kenapa? Karena ribuan mahasiswa lain juga bikin hal yang sama persis! Tutorial "Create To-Do List App" itu ibarat lagu "Wonderwall"-nya anak gitar; semua orang bisa mainin, jadi nggak ada spesialnya lagi.

Recruiter itu gak cari yang paling jago (kan namanya juga junior atau intern), tapi mereka cari kandidat yang kreatif, mau memecahkan masalah, dan paham konsep.

Nah, daripada bingung mau bikin apa dan malah stuck (ujung-ujungnya scroll TikTok), mending kamu coba bangun 5 ide project web ini. Dijamin portofolio kamu bakal lebih stand out!

1. Landing Page UMKM atau Warung Sekitar Kampus

Ini project yang paling diremehkan, padahal nilainya tinggi banget di mata user. Coba deh kamu datang ke warkop langganan, laundry kiloan dekat kosan, atau usaha katering temanmu. Tawarin bikinin website sederhana buat mereka.

  • Apa yang kamu bikin: Satu halaman website profil usaha yang isinya menu, harga, foto produk, dan link ke WhatsApp.

  • Kenapa ini keren: Kamu belajar real-world case. Kamu gak cuma ngoding, tapi juga belajar menerjemahkan kebutuhan klien ke dalam desain.

  • Skill yang pamerkan: HTML5 Semantik, CSS Layouting (Flexbox/Grid), dan Responsive Design (wajib bagus di HP!).

2. Aplikasi "Pencatat Pengeluaran Anak Kos"

Kalau To-Do List cuma nambah dan hapus teks, coba naikin levelnya dikit ke manipulasi angka. Bikin aplikasi sederhana buat nyatet duit keluar.

  • Apa yang kamu bikin: Input nama barang, input harga, lalu muncul di list dan total pengeluarannya otomatis terhitung. Tambahkan fitur simpan ke localStorage biar pas di-refresh datanya gak ilang.

  • Kenapa ini keren: Ini memecahkan masalah nyata (anak kos yang boros).

  • Skill yang pamerkan: JavaScript Logic (aritmatika), DOM Manipulation, dan Browser Storage.

3. Web Katalog Film atau Resep (Fetch Public API)

Di dunia kerja nanti, kamu bakal sering banget "ngobrol" sama data dari server (Backend). Project ini nunjukin kalau kamu ngerti caranya ambil data orang lain.

  • Apa yang kamu bikin: Website yang nampilin poster film yang lagi tayang atau resep masakan. Gak perlu bikin datanya sendiri, pakai aja Public API gratisan (cari di Google: TMDB API atau TheMealDB).

  • Kenapa ini keren: Website kamu jadi dinamis, isinya berubah-ubah sesuai data asli, bukan teks statis doang.

  • Skill yang pamerkan: Fetch API / Axios, Async/Await, JSON Parsing, dan Error Handling.

4. Clone UI Halaman Login (Pixel Perfect)

Pernah liat halaman login Netflix, Spotify, atau Facebook? Coba tantang diri kamu buat bikin tampilan yang persis banget sama aslinya.

  • Apa yang kamu bikin: Fokus di tampilan (Frontend). Bikin semirip mungkin, dari warna, font, sampai efek pas tombol diklik (hover state).

  • Kenapa ini keren: Ini nunjukin kalau kamu punya "mata elang" alias teliti terhadap detail desain (Pixel Perfect). Frontend Developer sangat butuh skill ini.

  • Skill yang pamerkan: Advanced CSS, CSS Frameworks (cobain Tailwind atau Bootstrap), dan replikasi desain.

5. Mini Game Sederhana (Tebak Angka / Kuis)

Ngoding itu harusnya fun, kan? Coba bikin game simpel yang interaktif.

  • Apa yang kamu bikin: Game tebak angka (komputer pilih angka 1-100, user nebak), atau kuis pilihan ganda dengan skor di akhir.

  • Kenapa ini keren: Logika pemrogramannya (algoritma) lebih jalan di sini daripada sekadar bikin website profil.

  • Skill yang pamerkan: Conditional Logic (If-Else), Arrays, Objects, dan Event Handling.

Penutup: Mulai Aja Dulu!

Gak perlu langsung sempurna. Pilih satu dari lima ide di atas yang menurutmu paling menarik, terus kerjain weekend ini.

Ingat, kode yang jelek tapi jadi dan bisa dipakai, itu jauh lebih baik daripada ide jenius tapi cuma ada di angan-angan. Kalau udah jadi, jangan lupa push ke GitHub dan deploy (bisa pakai Vercel atau Netlify gratisan) biar bisa dipamerin di bio medsos kamu.

Selamat ngoding! Error itu biasa, yang gak biasa itu kalau kamu nyerah. Gas!


Gimana menurutmu? Sudah cukup pas buat target pembaca mahasiswa? Ada bagian yang mau ditambahin atau dikurangin?

Komentar