Akses Selamanya

Ambil Promo
flash sale
hamburger-menu

Career path

Become Front-End Developer

Mulai belajar gratis
My Progress
logo
App Developer
0%
logo
UI/UX Designer
0%
BuildWithAngga
BuildWithAngga
BuildWithAngga BuildWithAngga BuildWithAngga

Low Risk, High Return

Investasi Skills Terbaru
Demi Karir Impianmu

Lihat benefit lainnya
Great Portfolio
Great Portfolio

Menjadi kandidat yang memiliki value tinggi ketika melamar kerja

Career Shortcuts
Career Shortcuts

Ikuti panduan belajar terarah buatan oleh professional mentor

Lifetime Access
Lifetime Access

Belajar jadi lebih produktif sesuai dengan fase masing-masing

Well-Designed Roadmap

Syllabus Become Front-End Developer

HTML5 Dasar trailer kelas

HTML5 Dasar

rating rating rating rating rating
()
  • icon check

    Memahami elemen dasar seperti <!DOCTYPE html>, <html>, <head>, <body>, serta cara membangun struktur halaman yang benar.

  • icon check

    Pengenalan elemen-elemen semantik baru seperti <header>, <nav>, <section>, <article>, <footer> untuk membuat markup lebih terstruktur dan mudah dipahami.

  • icon check

    Cara menggunakan elemen HTML5 untuk menyematkan media tanpa plugin tambahan, seperti <audio> dan <video>.

  • icon check

    Memahami peningkatan fitur form seperti input type baru (email, date, number, dsb.), atribut validasi bawaan, dan peningkatan pengalaman pengguna.

CSS Website Design trailer kelas

CSS Website Design

rating rating rating rating rating
()
  • icon check

    Memahami fungsi CSS untuk mengubah tampilan visual website yang dibangun dengan HTML.

  • icon check

    Mempelajari cara memilih elemen HTML yang spesifik untuk diberi gaya (misalnya, memilih berdasarkan tag, class, atau ID).

  • icon check

    Mengatur posisi elemen secara presisi menggunakan properti position (static, relative, absolute, fixed).

  • icon check

    Mengubah properti teks seperti jenis font, ukuran, ketebalan, dan spasi.

Vanilla JavaScript Pada Website Development trailer kelas

Vanilla JavaScript Pada Website Development

rating rating rating rating rating
()
  • icon check

    Latihan sederhana function iteration

  • icon check

    Belajar membaca dokumentasi Javascript MDN

  • icon check

    Belajar cara mendeklarasi variable

  • icon check

    Berkenalan dengan vanilla javascript

ES6 Dasar trailer kelas

ES6 Dasar

rating rating rating rating rating
()
  • icon check

    Mempelajari sintaks fungsi yang lebih ringkas dan modern, serta perbedaan perilaku this dibandingkan fungsi tradisional.

  • icon check

    Mempelajari sintaks class yang lebih sederhana dan jelas untuk membuat Object-Oriented Programming (OOP) di JavaScript, mirip dengan bahasa lain.

  • icon check

    Pengenalan tentang Promise sebagai cara modern untuk menangani operasi asynchronous (menggantikan callback hell).

Adonis JavaScript Framework: Basic Web Development trailer kelas

Adonis JavaScript Framework: Basic Web Development

rating rating rating rating rating
()
  • icon check

    Membuat Aplikasi CRUD

  • icon check

    Adonis Fundamental

Mastering React JS: Progressive Web Apps (E-Commerce) trailer kelas

Mastering React JS: Progressive Web Apps (E-Commerce)

rating rating rating rating rating
()
  • icon check

    Membuat fitur Push Notification

  • icon check

    Membuat Splash screen pada aplikasi

  • icon check

    Membuat App Banner (Add to Home Screen)

  • icon check

    Memahami Service Worker dengan Workbox JS

Web Dev Tools trailer kelas

Web Dev Tools

rating rating rating rating rating
()
  • icon check

    Menguasai Code Editor (Visual Studio Code)

  • icon check

    Dasar-Dasar Version Control (Git & GitHub)

  • icon check

    Penggunaan Terminal/Command Line

Wordpress.com Website Development trailer kelas

Wordpress.com Website Development

rating rating rating rating rating
()
  • icon check

    Mempublikasikan website agar diakses masyarakat

  • icon check

    Memodifikasi tema pada website

  • icon check

    Membangun suatu website untuk bisnis

  • icon check

    Mengenal Content Management System

Wordpress.org Website Development trailer kelas

Wordpress.org Website Development

rating rating rating rating rating
()
  • icon check

    Mengenal Content Management System

  • icon check

    Belajar kustomisasi pada Wordpress.org

  • icon check

    Belajar membuat halaman dan artikel pada Wordpress.org

  • icon check

    Memahami menu-menu yang ada di Wordpress.org

Type Script Front-End Development trailer kelas

Type Script Front-End Development

rating rating rating rating rating
()
  • icon check

    Pengenalan TypeScript

  • icon check

    Konsep Static Typing

  • icon check

    Interface dan Type Alias

CSS Tailwind Web Design trailer kelas

CSS Tailwind Web Design

rating rating rating rating rating
()
  • icon check

    Memahami konsep dasar Tailwind CSS yang berfokus pada utility classes dan perbedaannya dengan framework berbasis komponen seperti Bootstrap.

  • icon check

    Membangun desain dari nol dengan menggabungkan kelas-kelas kecil untuk mengatur warna, ukuran, spacing (padding, margin), tipografi, dan lainnya.

  • icon check

    Mengaplikasikan semua konsep untuk membangun sebuah halaman web modern, seperti halaman single product.

  • icon check

    Menerapkan pendekatan mobile-first dan menggunakan breakpoint variants (misalnya md:, lg:) untuk membuat desain yang fully-responsive.

Vue JavaScript Framework trailer kelas

Vue JavaScript Framework

rating rating rating rating rating
()
  • icon check

    Mempelajari cara membuat instance Vue dan menghubungkan data dari JavaScript ke tampilan HTML secara reaktif (jika data berubah, tampilan ikut berubah).

  • icon check

    Mempelajari apa itu Vue, kelebihannya (seperti kemudahan belajar dan performa), dan posisinya di antara framework JavaScript lainnya seperti React dan Angular.

  • icon check

    Menggunakan Vue Command-Line Interface untuk mempercepat proses setup dan development proyek Vue yang lebih besar.

React JavaScript trailer kelas

React JavaScript

rating rating rating rating rating
()
  • icon check

    Mempelejari apa itu React, mengapa React menjadi library JavaScript yang sangat populer, dan keunggulannya dalam membangun UI.

  • icon check

    Mempelajari sintaks JSX, yang memungkinkan penulisan kode mirip HTML di dalam JavaScript.

  • icon check

    Membangun UI dengan pendekatan berbasis komponen, yaitu memecah tampilan menjadi bagian-bagian kecil yang dapat digunakan kembali.

CSS Bootstrap 4 Web Design trailer kelas

CSS Bootstrap 4 Web Design

rating rating rating rating rating
()
  • icon check

    Pengenalan CSS Framework

  • icon check

    Instalasi dan Setup Bootstrap

  • icon check

    Membuat Website Responsif

  • icon check

    Mempelajari Bootstrap Grid System

Full-Stack JavaScript Developer: Website Travel trailer kelas

Full-Stack JavaScript Developer: Website Travel

rating rating rating rating rating
()
  • icon check

    Belajar Menggunakan Library Reactjs

  • icon check

    Belajar Membuat API dengan Nodejs & Expressjs

  • icon check

    Belajar membuat reusable component react from scratch

  • icon check

    Belajar mengolah DB non-sequel dengan mongodb

  • icon check

    Belajar UI/UX dalam membangun suatu website booking hotel online

  • icon check

    Belajar Usability-Testing dengan menganalisa behaviour pengguna website

Master WordPress Quickly: Speed Optimization trailer kelas

Master WordPress Quickly: Speed Optimization

rating rating rating rating rating
()
  • icon check

    Mempelajari berbagai plugin untuk mendukung kinerja website

  • icon check

    Mengoptimasi website dengan plugin Smush, W3 Total Cache, WPS Hide Login, dll

  • icon check

    Meningkatkan keamanan website

  • icon check

    Membangun web yang ramah SEO

  • icon check

    Melakukan export/backup website

Master Class: React JS dan Tailwind CSS Website Development trailer kelas

Master Class: React JS dan Tailwind CSS Website Development

rating rating rating rating rating
()
  • icon check

    Belajar custom hooks

  • icon check

    Belajar buat mock API

  • icon check

    Mendeploy dengan netlify

  • icon check

    Slicing file HTML ke ReactJS

Struktur Data JavaScript: Improve Website E-Commerce trailer kelas

Struktur Data JavaScript: Improve Website E-Commerce

rating rating rating rating rating
()
  • icon check

    Belajar memecah masalah menjadi bagian-bagian kecil

  • icon check

    Membahas struktur data yang lebih kompleks seperti tree dan graph

  • icon check

    Belajar struktur data seperti stack, queue, linked list

  • icon check

    Implementasi sistem rekomendasi ecommerce dengan struktur data

Full-Stack Website Developer: PHP Laravel dan Vue JS (Closed) trailer kelas

Full-Stack Website Developer: PHP Laravel dan Vue JS (Closed)

rating rating rating rating rating
()
  • icon check

    Memahami konversi template HTML ke project Vue JavaScript

  • icon check

    Mempelajari penggunaan API dari Back-End Developer

  • icon check

    Membuat API dengan PHP dan Framework Laravel

  • icon check

    Membuat CMS Admin Panel dari data di aplikasi

  • icon check

    Mempelajari deployment (unggah aplikasi frontend ke Netlify)

  • icon check

    Mempelajari deployment dan configuration CMS/API ke DigitalOcean

SvelteJS - Front-End JavaScript Development: Web Donasi Online trailer kelas

SvelteJS - Front-End JavaScript Development: Web Donasi Online

rating rating rating rating rating
()
  • icon check

    Mempersiapkan struktur aplikasi Svelte

  • icon check

    Mengubah template HTML menjadi komponen Svelte

  • icon check

    Continuous Deployment

  • icon check

    Fitur donasi via payment gateway

  • icon check

    State management

  • icon check

    Penanganan Event dan Form

  • icon check

    Pengaturan Router untuk Single-page app (SPA)

  • icon check

    Lambda Functions untuk membangun backend

Full-Stack JavaScript Developer 2021: Website Top Up Voucher Game trailer kelas

Full-Stack JavaScript Developer 2021: Website Top Up Voucher Game

rating rating rating rating rating
()
  • icon check

    Mendeploy project ke Vercel (Front-End) dan Heroku (Back-End)

  • icon check

    Mengintegrasikan NodeJS REST API dengan ReactJS (NextJS)

  • icon check

    Membuat fitur Sign Up dan Sign In

  • icon check

    Membuat CRUD yang mencakup login dengan JWT

  • icon check

    Membuat Storybook untuk membangun component library pada React

  • icon check

    Mengolah database dengan MongoDB

  • icon check

    Melakukan konversi HTML ke NextJS

  • icon check

    Memahami pengembangan website secara utuh (Front-End dan Back-End)

Frontend Best Practice: On Page SEO & Semantic HTML trailer kelas

Frontend Best Practice: On Page SEO & Semantic HTML

rating rating rating rating rating
()
  • icon check

    Memastikan kesesuaian code dengan best practice SEO & Semantic HTML

  • icon check

    Mengatur Open Graph Meta Tag untuk Behaviour URL

  • icon check

    Implementasi Best Practice SEO untuk website

  • icon check

    Memahami Basic SEO & Semantic HTML untuk optimasi code

Webflow Workshop: Build a Simple Landing Page trailer kelas

Webflow Workshop: Build a Simple Landing Page

rating rating rating rating rating
()
  • icon check

    Mempelajari tool dasar Webflow

  • icon check

    Melakukan slicing design asset dari Figma ke Webflow

  • icon check

    Membangun elemen UI website (navigation, CTA button, content section, dll)

  • icon check

    Menampilkan prototype website secara live

Lihat kelas lainnya

Trusted By 900K+ Students

Join Our Supportive
Community 😊

BuildWithAngga menyediakan komunitas belajar UI/UX
design & Web Development untuk pemula ke mahir

Berkualitas Tinggi

Banyak ilmu dari BuildWithAngga
yang terbaru modal bekerja.

user picture

Aqil

Front-End Developer

Always Up to Date

BuildWithAngga memberikan materi
kelas dengan tools terbaru.

user picture

Edi

Full-Stack Developer

Hemat Waktu

Materi design & development mudah
dipahami, thanks BuildWithAngga.

user picture

Evita

UI/UX Designer

Pemula to Expert

Mudah bikin portfolio dari kelas
online BuildWithAngga.

user picture

Wahyu

Mobile App Developer

Alur Belajar Jelas

BuildWithAngga terbaik! cocok
banget pemula belajar UI/UX design.

user picture

Rizqy

UI/UX Designer

Discover and Learn

Tiap kelas BuildWithAngga ada
ilmu design & development terbaru.

user picture

Sharen

UI/UX Designer
Katalog Kelas Karya Students Katalog Kelas

Berkualitas Tinggi

Banyak ilmu dari BuildWithAngga
yang terbaru modal bekerja.

user picture

Aqil

Front-End Developer

Always Up to Date

BuildWithAngga memberikan materi
kelas dengan tools terbaru.

user picture

Edi

Full-Stack Developer

Hemat Waktu

Materi design & development mudah
dipahami, thanks BuildWithAngga.

user picture

Evita

UI/UX Designer

Pemula to Expert

Mudah bikin portfolio dari kelas
online BuildWithAngga.

user picture

Wahyu

Mobile App Developer

Alur Belajar Jelas

BuildWithAngga terbaik! cocok
banget pemula belajar UI/UX design.

user picture

Rizqy

UI/UX Designer

Discover and Learn

Tiap kelas BuildWithAngga ada
ilmu design & development terbaru.

user picture

Sharen

UI/UX Designer
Roadmap
icon

Become Front-End Developer

logo buildwithangga

PT. Angga Membangun Indonesia

Jl. KH. Wahid Hasyim Kel No.10D

Jakarta, Indonesia

‪+62877‑7891-9943‬ (WhatsApp)

[email protected]

© 2019-2026 BuildWithAngga

Start Popular Career

Mastering Hot Tools

Learn Language

Resources

Community

Company

Useful Links

Marketing Banner

Kode Promo