Front-end Learning Path

Roadmap Pembelajaran Front-End

Kuasai pengembangan front-end modern dari HTML dasar hingga JavaScript lanjutan dan desain responsif

1

Belajar Dasar Pemrograman Web

DURASI

45 Jam

RATING

⭐ 4.88

MODUL

131

SISWA

232,864

LEVEL

Pemula

HTML Dasar

Struktur HTML
Tag Semantik
Form & Input
Aksesibilitas

CSS Dasar

Selector & Properti
Box Model
Flexbox
Grid Dasar

Proyek Akhir

Membuat Website Pertama
Layouting
Responsive Design
2

Belajar Dasar Javascript

DURASI

46 Jam

RATING

⭐ 4.9

MODUL

111

SISWA

233,291

LEVEL

Pemula

Dasar JavaScript

Variabel & Tipe Data
Fungsi
Alur Kontrol
Manipulasi DOM

Fitur ES6+

Arrow Functions
Destructuring
Template Literals
Modul

Proyek Akhir

Membangun Website Interaktif
Event Handling
Integrasi API
3

Belajar Membuat Front-End Web untuk Pemula

DURASI

55 Jam

RATING

⭐ 4.88

MODUL

69

SISWA

152,017

LEVEL

Menengah

Dasar Front-End

Desain Web Responsif
CSS Flexbox & Grid
Mobile First
Kompatibilitas Antar Browser

CSS Lanjutan

CSS Animations
CSS Transitions
CSS Variables
SASS/SCSS

Proyek Portfolio

Membangun Portfolio Profesional
Optimasi Performa
SEO Best Practices
4

Mengenal React untuk Pemula

DURASI

35 Jam

RATING

⭐ 4.9

MODUL

56

SISWA

28,558

LEVEL

Pemula

Dasar React

Components & JSX
Props & State
Event Handling
Form Handling

React Hooks

useState Hook
useEffect Hook
useContext Hook
Custom Hooks

Proyek Aplikasi

Membangun Aplikasi Web
Manajemen State
Integrasi API
5

Belajar Front-End Developer yang Profesional

DURASI

55 Jam

RATING

⭐ 4.92

MODUL

70

SISWA

4,547

LEVEL

Menengah

Advanced Front-End

Optimasi Performa
Web Accessibility
Progressive Web Apps
Build Tools & Bundlers

CSS Framework Modern

Tailwind CSS
Styled Components
CSS-in-JS Solutions
Design Systems

Proyek Enterprise

Membangun Aplikasi Skala Besar
Monitoring Performa
Production Deployment
6

Menjadi Front-End Web Developer Expert

DURASI

70 Jam

RATING

⭐ 4.9

MODUL

103

SISWA

2,657

LEVEL

Mahir

Expert Front-End Patterns

Advanced Component Patterns
State Management Mastery
Advanced Hooks & Optimization
Testing Strategies

Performa & Keamanan

Advanced Performance Tuning
Security Best Practices
Monitoring & Analytics
DevOps for Front-End

Professional Project

Full-Stack Development
Real-world Architecture
DevOps & Deployment
Career Development

Ready to Start Your React Journey?

Follow this roadmap step by step and build amazing React applications.