Semua paket
🏭

Fullstack Laravel

Web developer komplit: frontend dasar + backend Laravel yang solid.

Progress: 0/382 modul0%
Lanjutkan belajar: Pengenalan Web: Cara Kerja Browser dan Server
1

HTML & CSS

Struktur dan styling sampai menengah. · 49 modul

Pengenalan Web: Cara Kerja Browser dan ServerPemula
HTML Pertama: Struktur DokumenPemula
Tag, Elemen, dan AtributPemula
Komentar dan Best PracticePemula
Entity dan Karakter SpesialPemula
Layouting Dasar: div, span, class, idPemula
Heading h1 sampai h6Pemula
Hierarki Heading dan SEOPemula
Paragraf dan Format TeksPemula
Format Teks Lanjutan: sub, sup, mark, codePemula
Block vs InlinePemula
List: ul, ol, liPemula
Description List: dl, dt, ddPemula
List BersarangPemula
Link Dasar: a hrefPemula
Link Lanjutan: Email, Telepon, AnchorPemula
Link Anchor dan Navigasi Satu HalamanPemula
Link pada Gambar dan TombolPemula
Gambar Dasar: img, src, altPemula
Gambar Lanjutan: figure, srcsetPemula
Memilih Format Gambar: JPG, PNG, SVG, WebPPemula
Alt Text MendalamPemula
Audio: Memutar SuaraPemula
Video: Menyematkan VideoPemula
Subtitle Video dengan trackPemula
iframe dan EmbedPemula
Favicon: Ikon Tab BrowserPemula
Tabel Dasar: table, tr, tdMenengah
Tabel: thead, tbody, tfoot, thMenengah
Tabel: colspan dan rowspanMenengah
Tabel Aksesibel: scope dan captionMenengah
Caption dan Deskripsi TabelMenengah
colgroup dan colMenengah
Tabel Responsif di HPMenengah
Form Dasar: form, action, methodMenengah
GET vs POST MendalamMenengah
Input Teks: text, email, password, numberMenengah
Input Email MendalamMenengah
Input Password MendalamMenengah
Input Number dan RangeMenengah
Input Tel, URL, dan SearchMenengah
Input Tanggal dan WaktuMenengah
Checkbox dan RadioMenengah
Input File: Upload BerkasMenengah
Input Tersembunyi dan TombolMenengah
Select: Dropdown PilihanMenengah
Select Lanjutan: optgroup dan multipleMenengah
Textarea: Input MultibarisMenengah
Label, Fieldset, LegendMenengah
2

CSS Lanjutan

Layout modern dan responsif. · 64 modul

Pengenalan CSS dan Cara PakaiPemula
Sintaks Aturan CSSPemula
Selektor Dasar: Elemen, Class, IDPemula
Selektor KombinasiPemula
Selektor AtributPemula
Spesifisitas: Siapa yang MenangPemula
Cascade dan InheritancePemula
Satuan CSS: px, em, rem, %Pemula
Warna di CSSPemula
Box ModelPemula
Margin: Jarak LuarPemula
Padding: Jarak DalamPemula
BorderPemula
Border Radius: Sudut MembulatPemula
OutlinePemula
Box ShadowPemula
BackgroundPemula
Styling Teks DasarPemula
Font FamilyPemula
Ukuran dan Ketebalan FontPemula
Line Height dan SpasiPemula
Font KustomPemula
Text ShadowPemula
White Space dan Text OverflowPemula
Display: Block, Inline, Inline-BlockPemula
Menyembunyikan ElemenPemula
Position: Static dan RelativePemula
Position: Absolute, Fixed, StickyMenengah
Z-Index dan StackingMenengah
Float dan ClearMenengah
OverflowMenengah
Flex ContainerMenengah
Justify dan AlignMenengah
Flex WrapMenengah
Properti Flex ItemMenengah
Gap di FlexboxMenengah
Studi Kasus: NavbarMenengah
Studi Kasus: Kartu ProdukMenengah
Studi Kasus: Centering SempurnaMenengah
Grid ContainerMenengah
Gap di GridMenengah
Penempatan Grid ItemMenengah
Grid Template AreasMenengah
Grid vs FlexboxMenengah
Studi Kasus: Galeri FotoMenengah
Studi Kasus: Layout HalamanMenengah
Media QueryPemula
Mobile FirstMenengah
Strategi BreakpointMenengah
Gambar ResponsifMenengah
Tipografi ResponsifMenengah
Studi Kasus: Landing ResponsifMenengah
Transisi CSSMenengah
Transform 2DMenengah
Keyframes DasarMenengah
Properti AnimationMenengah
Pseudo-ClassMenengah
Pseudo-ElementMenengah
Variabel CSSMenengah
Filter CSSMenengah
Backdrop FilterMenengah
Object Fit dan Object PositionPemula
Proyek: Kartu ProfilMenengah
Cheat Sheet CSSPemula
3

JavaScript Praktis

DOM dan fetch API. · 89 modul

Pengenalan JavaScript: Bahasa yang Menghidupkan WebPemula
Cara Menjalankan JavaScriptPemula
Variabel: let dan constPemula
Tipe Data PrimitifPemula
Tipe Data Referensi: Array & ObjectPemula
Konversi Tipe DataPemula
Operator AritmatikaPemula
Operator Perbandingan & LogikaPemula
Percabangan if-elsePemula
Kondisi Bertingkat & Early ReturnPemula
Switch: Percabangan Banyak PilihanPemula
Ternary Operator: if Satu BarisPemula
Loop for: Pengulangan KlasikPemula
for...in vs for...ofPemula
Loop while & do-whilePemula
break & continuePemula
Fungsi: DasarPemula
Parameter & ArgumenPemula
Return Value: Mengembalikan NilaiPemula
Arrow FunctionPemula
Function Expression vs DeclarationPemula
Default & Rest ParameterPemula
Scope: Wilayah VariabelPemula
Hoisting: Kode DiangkatPemula
Closure: Fungsi yang MengingatPemula
Array: DasarPemula
Array: Tambah & Hapus ElemenPemula
Array.map: TransformasiPemula
Array.filter: MenyaringPemula
Array.find & findIndexPemula
Array.reduce: AgregasiPemula
Array.sort & reversePemula
forEach, some, every, includesPemula
Array MultidimensiPemula
Proyek Mini: Olah Data ArrayPemula
Object: DasarMenengah
Method & thisMenengah
Object: Manipulasi PropertiMenengah
DestructuringMenengah
Spread & Rest (...)Menengah
Nested Object & Optional ChainingMenengah
Copy Object: Shallow vs DeepMenengah
JSON: Format Data UniversalMenengah
Date: DasarMenengah
Template Literal MendalamMenengah
Math: Fungsi MatematikaMenengah
Number: Method & PresisiMenengah
String: Method PentingMenengah
Regex: DasarMenengah
Date: Format & ManipulasiMenengah
Set & Map: Struktur Data yang Sering DiremehkanMenengah
Fitur Modern JavaScript: .at(), hasOwn, dan Assignment PintarMenengah
DOM: Seleksi ElemenMenengah
DOM: Membuat & Menambah ElemenMenengah
DOM: Class & StyleMenengah
DOM: innerHTML vs textContentMenengah
DOM: Event ListenerMenengah
DOM: Event DelegationMenengah
DOM: Menangani FormMenengah
DOM: Navigasi (Traversal)Menengah
Keyboard Event: keydown, keyup, dan ShortcutMenengah
Mouse Event: Klik, Gerakan, dan KoordinatMenengah
Custom Event: Komunikasi Antar Komponen Tanpa CouplingMenengah
BOM & window: Browser di Luar Halaman WebMenengah
Timer di JavaScript: setTimeout & setIntervalPemula
localStorage & sessionStorageMenengah
sessionStorage & Cookie: Menyimpan Data di BrowserMenengah
Geolocation API: Menemukan Posisi UserMenengah
Clipboard API: Menyalin Teks dengan JavaScriptMenengah
Notification API: Mengirim Notifikasi BrowserMenengah
Proyek Mini: Todo ListMenengah
Callback: Fondasi Kode AsinkronMenengah
Promise: Janji yang Ditepati (atau Tidak)Menengah
Promise Chaining: Merangkai .then() BerantaiMenengah
Menangani Error di Promise: .catch() dan .finally()Menengah
async/await: Menulis Kode Asinkron Seperti Kode BiasaMenengah
Error Handling di async/await: try...catch yang BenarMenengah
Fetch API: Mengambil Data dari InternetMenengah
Fetch: POST, PUT, dan DELETEMenengah
Error Handling: try-catchMenengah
Custom Error: Membuat Jenis Error SendiriMenengah
Modul ES6: export dan importMenengah
Class dan OOP: Cetakan untuk Banyak ObjectMenengah
Inheritance: extends dan superMenengah
Rekursi: Fungsi yang Memanggil Dirinya SendiriMenengah
Debounce dan Throttle: Menjinakkan EventMenengah
Canvas Dasar: Menggambar dengan KodeMenengah
Strict Mode: Biarkan JavaScript Marah Lebih AwalMenengah
Testing Dasar: Percaya Tapi VerifikasiMenengah
4

PHP

Backend dari nol sampai OOP. · 60 modul

Pengenalan PHPPemula
Instalasi XAMPPPemula
Sintaks Dasar PHPPemula
VariabelPemula
Tipe Data SkalarPemula
Type JugglingPemula
Operator Aritmatika & AssignmentPemula
Operator Perbandingan & LogikaPemula
Percabangan if-elsePemula
switch dan matchPemula
Loop for dan foreachPemula
Loop while dan do-whilePemula
Fungsi DasarPemula
Fungsi LanjutanPemula
Array DasarPemula
Fungsi Array DasarMenengah
Sorting ArrayMenengah
Mencari & Filter ArrayMenengah
Transformasi Array dengan array_mapMenengah
Filter Fleksibel dengan array_filterMenengah
Melebur Array dengan array_reduceMenengah
Fungsi String DasarMenengah
Format StringMenengah
Manipulasi String LanjutanMenengah
Tanggal & Waktu dengan DateTimeMenengah
JSON Encode & DecodeMenengah
Regex Dasar dengan preg_matchMenengah
Form dengan GETMenengah
Form dengan POSTMenengah
Input Ganda: Checkbox & SelectMenengah
Keamanan Form DasarMenengah
Validasi Form DasarMenengah
Validasi LanjutanMenengah
Mencegah CSRF dengan TokenMenengah
Mencegah XSSMahir
Mencegah SQL InjectionMahir
Hash Password yang BenarMahir
Session DasarMenengah
Session untuk LoginMenengah
Mengamankan SessionMahir
CookieMenengah
Upload File DasarMenengah
Upload File yang AmanMenengah
Membaca & Menulis FileMahir
Class & Object DasarMahir
Property, Method & VisibilityMahir
Constructor & DestructorMahir
Static Property & MethodMahir
InheritanceMahir
Interface & Abstract ClassMahir
TraitMahir
Namespace di PHPMahir
Magic Method PHPMahir
Enum di PHP 8.1Mahir
Composer DasarMahir
Autoload PSR-4Mahir
Error Handling DasarMahir
Exception & try-catchMahir
Proyek: Buku TamuMahir
Proyek: Login SederhanaMahir
5

Laravel

Framework full-stack PHP. · 65 modul

Pengenalan Laravel: Kenapa Framework Ini PopulerPemula
Laravel vs PHP Murni: Kapan Pakai FrameworkPemula
Instalasi Laravel dengan ComposerPemula
Struktur Folder Project Laravel 11Pemula
Artisan: Perintah Wajib HafalPemula
.env dan Konfigurasi: Rahasia ProjectPemula
Routing Dasar: Menghubungkan URL ke KodePemula
Route Parameter: URL DinamisPemula
Route Model Binding: Otomatis Ambil DataPemula
Route Group: Prefix dan Middleware SekaligusPemula
Named Route dan Route CachePemula
Controller: Memisahkan Logika dari RoutePemula
Resource Controller: 7 Aksi CRUD SekaligusPemula
Blade Dasar: Template Engine LaravelPemula
Echo dan Escaping: {{ }} vs {!! !!}Pemula
Directive If dan Loop di BladePemula
Blade Component: Komponen ReusablePemula
Slot dan Named SlotPemula
Layout dengan @extends dan @sectionPemula
@include: Pecah View Jadi Bagian KecilPemula
Migration: Version Control untuk DatabaseMenengah
Mengubah Tabel: Tambah, Ubah, Hapus KolomMenengah
Seeder: Isi Database dengan Data DummyMenengah
Factory: Data Dummy Massal yang RealistisMenengah
Eloquent: ORM yang ManusiawiMenengah
Konvensi Model: Nama Tabel dan KeyMenengah
Eloquent Create: Menyimpan Data BaruMenengah
Eloquent Read: Query yang EkspresifMenengah
Eloquent Update dan DeleteMenengah
Query Builder: SQL Tanpa Tulis SQLMenengah
Agregasi: Count, Sum, Avg, dan GroupingMenengah
Mass Assignment: $fillable dan $guardedMenengah
Soft Delete: Hapus Tanpa MenghapusMenengah
HasMany dan BelongsTo: Relasi Satu-ke-BanyakMenengah
Query Lewat Relasi: whereHas dan withCountMenengah
BelongsToMany: Relasi Banyak-ke-BanyakMenengah
Data Tambahan di Pivot: withPivotMenengah
Relasi Bertingkat: hasManyThroughMenengah
Eager Loading: Muat Relasi SekaligusMenengah
Masalah N+1: Musuh Performa TersembunyiMenengah
Validasi Input: Jangan Percaya UserMenengah
Form Request: Validasi yang Rapi dan ReusableMenengah
Autentikasi dengan Breeze: Login Siap PakaiMenengah
Session Auth Manual: Auth::attemptMenengah
Middleware Bawaan: auth, guest, throttleMenengah
Middleware Custom: Cek Role SendiriMenengah
Gate dan Policy: Otorisasi per AksiMahir
API Resource: Transformasi Response JSONMahir
REST Controller untuk APIMahir
REST CRUD Lengkap: Store, Update, Destroy via APIMahir
Pagination: Data Besar per HalamanMahir
Sanctum: Token Auth untuk SPA dan MobileMahir
Upload File: Validasi dan Simpan AmanMahir
Storage Disk: Local, Public, dan CloudMahir
Mail: Kirim Email dengan MailableMahir
Notification: Multi-Channel SekaligusMahir
Queue: Kerja Berat di BackgroundMahir
Job Class: Bungkus Tugas BackgroundMahir
Cache: Hindari Query BerulangMahir
Testing: Feature Test untuk RouteMahir
Service Provider: Tempat BootstrappingMahir
Service Container & Dependency InjectionMahir
Event dan Listener: Kode yang Loosely CoupledMahir
Proyek: REST API Todo LengkapMahir
Proyek Akhir: Blog Full-Stack LengkapMahir
6

HTTP & Git

API dan kolaborasi. · 55 modul

Pengenalan HTTP: Bahasa Percakapan Browser dan ServerPemula
HTTP vs HTTPS: Kenapa Huruf S Itu PentingPemula
Evolusi HTTP: dari 1.1 ke HTTP/2 dan HTTP/3Menengah
Anatomi URL: Membaca Alamat Web Bagian per BagianPemula
GET dan POST: Dua Method yang Paling Sering DipakaiPemula
PUT, PATCH, DELETE: Mengubah dan Menghapus DataPemula
HEAD, OPTIONS, dan Method LainnyaMenengah
Status 2xx: Semua yang Berarti SuksesPemula
Status 304: Konten Tidak Berubah, Pakai Cache SajaMenengah
Status 3xx: Redirect dan CacheMenengah
Status 400: Bedah Validasi Input APIMenengah
401 vs 403: Bedah Tuntas Dua Error AuthMenengah
Strategi 404: Bukan Sekadar Halaman Not FoundMenengah
Status 4xx: Kesalahan di Pihak ClientMenengah
500 vs 502 vs 503: Bedah Error ServerMenengah
Status 5xx: Kesalahan di Pihak ServerMenengah
Header Request: Informasi yang Dikirim ClientMenengah
Header Content-Type: Label Wajib Setiap BodyMenengah
Header Cache-Control: Atur Kapan Cache Boleh DipakaiMenengah
ETag dan Conditional Request: Sidik Jari FileMenengah
Content Negotiation: Tawar-menawar Format DataMenengah
Strategi Caching: Kapan Ambil dari Cache, Kapan ke ServerMenengah
Header Response & CORS: Aturan Main Beda DomainMenengah
Konfigurasi CORS di Server: Express dan LaravelMenengah
JSON: Format Data yang Dipakai Hampir Semua APIPemula
Prinsip REST: Cara Mendesain API yang RapiMenengah
API Versioning: Mengubah API Tanpa Merusak Klien LamaMenengah
Query Parameter Praktis: Filter, Sort, dan PaginationMenengah
Cursor Pagination: Pagination untuk Data yang Terus BerubahMenengah
Postman: Mencoba API Tanpa Nulis KodePemula
Dokumentasi API: Menulis yang Bikin Orang PahamMenengah
OpenAPI dan Swagger: Dokumentasi yang Bisa DieksekusiMenengah
GraphQL: Gambaran Alternatif RESTMenengah
Webhook: Saat Server yang MenghubungimuMenengah
Fetch GET: Mengambil Data dari APIMenengah
Fetch POST: Mengirim Data ke APIMenengah
Upload File dengan fetch dan FormDataMenengah
Fetch Lanjutan: Header, Timeout, dan AbortMahir
Pola Interceptor: Auth dan Logging TerpusatMahir
Error Handling API: Gagal dengan AnggunMahir
Rate Limit: Memahami Batasan Kuota APIMahir
Idempotency Key: Aman dari Klik GandaMahir
Bedah Header Authorization: Bearer, Basic, ApiKeyMahir
Basic Auth: Cara Login Paling SederhanaMahir
API Key: Kunci Sederhana untuk Integrasi ServerMenengah
Bearer Token & JWT: Standar Login API ModernMahir
Cookie: Stempel Tangan di KonserMenengah
Atribut Cookie: HttpOnly, Secure, SameSiteMenengah
Cookie vs Token: Kapan Pakai yang ManaMenengah
Gambaran OAuth: Login dengan Google & co.Mahir
gRPC: Gambaran Komunikasi Super Cepat antar ServerMahir
WebSocket: Telepon Dua Arah untuk WebMahir
Server-Sent Events: Radio Satu Arah dari ServerMahir
API Gateway: Resepsionis untuk MicroserviceMahir
Proyek Mini: API Client LengkapMahir