DAPATKAN BONUS TAMBAHAN KELAS FREEMIUM “​React JS Untuk Pemula​” 

dengan membeli kelas ini​ (Full Stack Web Developer) 
 
Kelas Online 

Full-Stack​ Web Developer 

UX - UI - HTML - CSS - Bootstrap (Frontend) - Laravel (Backend) - 
Hosting 
 
Membangun Website Penyedia Jasa Travel  
yang bisa dibeli oleh customer 
 

 
(Projek yang akan kita bangun) 
 
Lihat dulu yuk yang akan kamu pelajari di kelas BWAFWD: 
 
- Wireframe  
http://bit.ly/BWAUXWIREFRAME 
 
- User-Flow  
http://bit.ly/BWAUXFLOW 
 
- Visual Website Design 
http://bit.ly/BWAVSD 
 
- HTML 
http://bit.ly/BWAFWDHTML  
 
- Laravel 
https://nomads.fullstackdeveloper.id/ 
  
 
Nomads​ adalah nama projek website yang akan kita bangun di kelas ini: 
1. Pengguna dapat melakukan transaksi untuk mengikuti Trip pada 
wisata tertentu. 
2. Pengguna juga dapat mengundang member lain dalam mengikuti 
Trip yang sama (wajib melakukan register dan login terlebih dahulu). 
3. Pengguna wajib melakukan transfer kepada bank sebelum 
menyelesaikan transaksi pada trip yang diminati. 
 
Mentor 
   

   
Angga Risky  Galih Pratama 
(Product Designer)  (CTO di LEXAR.id) 
Mengajar UI/UX  Mengajar Coding 
 
 
Tools 
- Windows 10 / macOS 
- Adobe XD (​https://www.adobe.com/sea/products/xd.html​) 
Jika tidak bisa Adobe XD maka kita akan menggunakan alternatif 
yaitu Figma.com jadi tidak perlu khawatir, guys! 
- InVisionApp (​https://invisionapp.com​) 
- Visual Studio Code (​https://code.visualstudio.com/​) 
- Laragon Server (Windows) (​https://laragon.org/​) 
- MAMP Server (macOS) (​https://www.mamp.info/en/​) 
- Google Chrome (​https://www.google.com/chrome/​) 
- Maze.Design (​https://maze.design/​) 
- Whimsical (​https://whimsical.com/​) 
- Niat, Usaha dan Kerja Keras. 
 
Benefit Unggulan 
- Materi UI / UX Website Design 
- Materi Front-End Bootstrap 
- Materi Back-End Laravel 
- Materi Upload ke Hosting & Server 
- Sertifikat Kelulusan 
 - Source-Code Project 
- Design Master Project 
- Icon, Illustration, Fonts 
- Konsultasi Gratis Seumur Hidup (Group Private Telegram) 
- Video kualitas tinggi (1080 HD) 
- Akses Kelas Seumur Hidup 
- Audio lebih nyaman untuk didengarkan  
- Masih banyak lagi, lihat sendiri saja nanti 
 
Daftar Materi  
 
## Materi Kelas UI / UX 
- Perkenalan UI ​VIDEO SELESAI DIBUAT   
- Perkenalan UX V ​ IDEO SELESAI DIBUAT 
- Install Software Pendukung ​VIDEO SELESAI DIBUAT 
 
## Basic UX 
- Ideation ​VIDEO SELESAI DIBUAT 
- UX Customer Persona V ​ IDEO SELESAI DIBUAT 
- UX (Competitive Analysis/Benchmarking) ​VIDEO SELESAI DIBUAT 
- UX User-Flow ​VIDEO SELESAI DIBUAT 
- UX Wireframe V ​ IDEO SELESAI DIBUAT 
 
## Latihan UX 
- Mood Board V ​ IDEO SELESAI DIBUAT 
- Wireframe ​VIDEO SELESAI DIBUAT 
- Landing Page ​VIDEO SELESAI DIBUAT 
- Detail Travel Page V ​ IDEO SELESAI DIBUAT 
- Checkout Page V ​ IDEO SELESAI DIBUAT 
- Success Checkout Page ​VIDEO SELESAI DIBUAT 
 
## Visual Design 
- Transform Wireframe ke Visual 
- Landing Page ​VIDEO SELESAI DIBUAT 
- Detail Travel Page V ​ IDEO SELESAI DIBUAT 
- Checkout Page V ​ IDEO SELESAI DIBUAT 
- Success Checkout Page ​VIDEO SELESAI DIBUAT 
- Prototype 
- UI Design Animation V ​ IDEO SELESAI DIBUAT 
- Usability-Testing (Maze + InVision App) ​VIDEO SELESAI DIBUAT 
 
## Finalizing Designer 
- Slicing Asset (Adobe XD) ​VIDEO SELESAI DIBUAT 
- Invite Developer (inVision App) V ​ IDEO SELESAI DIBUAT 
- Support Developer (selama proyek berlangsung) 
 
## Figma (Bonus Materi) 
- Basic Penggunaan Figma V ​ IDEO SELESAI DIBUAT 
- Arahan transform Wireframe ke Visual Design V ​ IDEO SELESAI 
DIBUAT 
 
## Pengenalan Web Development dan Instalasi 
- Pengenalan Web Development ​VIDEO SELESAI DIBUAT 
- Instalasi Visual Studio Code ​VIDEO SELESAI DIBUAT 
- Instalasi Plugin Visual Studio Code V ​ IDEO SELESAI DIBUAT 
- Instalasi Web Server 
- Windows - Laragon 
- macOS - MAMP 
 
## Bootstrap & Slicing 
- Pengenalan Bootstrap V ​ IDEO SELESAI DIBUAT 
- Instalasi Bootstrap ​VIDEO SELESAI DIBUAT 
- Instalasi Plugin Untuk Slicing ​VIDEO SELESAI DIBUAT 
- Membuat Struktur Project (Folder & File) ​VIDEO SELESAI DIBUAT 
- Slicing dari Desain ke HTML dengan Bootstrap dengan Teknik Clean 
Code  
- Landing Page  
- Buat File SCSS dan Jalankan Live Server V ​ IDEO SELESAI 
DIBUAT 
- Membuat Navbar ​VIDEO SELESAI DIBUAT 
- Membuat Styling Navbar ​VIDEO SELESAI DIBUAT 
- Membuat Header V ​ IDEO SELESAI DIBUAT 
- Membuat Statistik Header ​VIDEO SELESAI DIBUAT 
- Membuat Wisata Populer ​VIDEO SELESAI DIBUAT 
- Membuat Our Networks ​VIDEO SELESAI DIBUAT 
- Membuat Testimonial V ​ IDEO SELESAI DIBUAT 
- Membuat Footer ​VIDEO SELESAI DIBUAT 
- Detail Travel Page  
- Membuat Bagian Kiri V ​ IDEO SELESAI DIBUAT 
- Membuat Galeri Foto V ​ IDEO SELESAI DIBUAT 
- Membuat Bagian Kanan V ​ IDEO SELESAI DIBUAT 
- Checkout Page  
- Membuat Bagian Kiri V ​ IDEO SELESAI DIBUAT 
- Membuat Bagian Kanan V ​ IDEO SELESAI DIBUAT 
- Success Checkout Page  
- Membuat Halaman Sukses V ​ IDEO SELESAI DIBUAT 
 
## Laravel & Integrasi 
- Pengenalan Laravel ​VIDEO SELESAI DIBUAT 
- Install Laravel Framework ​VIDEO SELESAI DIBUAT 
- Setup Awal Laravel  
- Database V ​ IDEO SELESAI DIBUAT 
 - Mailtrap (Email Testing) V ​ IDEO SELESAI DIBUAT 
- Pengenalan Routing ​VIDEO SELESAI DIBUAT 
- Pengenalan Controller V ​ IDEO SELESAI DIBUAT 
- Pengenalan Request & Response V ​ IDEO SELESAI DIBUAT 
- Pengenalan Blade & Views V ​ IDEO SELESAI DIBUAT 
- Memasang Template Admin  
- Mengunduh Template V ​ IDEO SELESAI DIBUAT 
- Mengintegrasikan Template V ​ IDEO SELESAI DIBUAT 
- Memisahkan Layout dan Konten ​VIDEO SELESAI DIBUAT 
- Merapikan Layout Admin ​VIDEO SELESAI DIBUAT 
- Mengkonversi Hasil Slicing HTML ke Laravel Blade 
- Memindahkan Template HTML ke Laravel ​VIDEO SELESAI 
DIBUAT 
- Landing Page ​VIDEO SELESAI DIBUAT 
- Detail Travel Page V ​ IDEO SELESAI DIBUAT 
- Checkout Page V ​ IDEO SELESAI DIBUAT 
- Success Checkout Page ​VIDEO SELESAI DIBUAT 
- Pengenalan Database Migration ​VIDEO SELESAI DIBUAT 
- Membuat Tabel 
- Data Paket Travel V ​ IDEO SELESAI DIBUAT 
- Data Galeri Travel ​VIDEO SELESAI DIBUAT 
- Data Transaksi ​VIDEO SELESAI DIBUAT 
- Data Transaksi Detail ​VIDEO SELESAI DIBUAT 
- Pengenalan Eloquent ORM V ​ IDEO SELESAI DIBUAT 
- Pengenalan Validasi V
​ IDEO SELESAI DIBUAT 
- Membuat Autentikasi User & Admin 
- Menambahkan Field Roles V ​ IDEO SELESAI DIBUAT 
- Membuat Middleware Untuk Admin V ​ IDEO SELESAI DIBUAT 
- Install dan Mengatur Authentication ​VIDEO SELESAI DIBUAT 
- Mengatur Autentikasi Admin ​VIDEO SELESAI DIBUAT 
- Menambahkan Verifikasi Email ​VIDEO SELESAI DIBUAT 
- Mengatur Autentikasi User ​VIDEO SELESAI DIBUAT 
- Menambahkan Field Username V ​ IDEO SELESAI DIBUAT 
- Membuat Admin Area 
- Membuat CRUD dengan Teknik Clean Code 
- Data Paket Travel 
- Model V ​ IDEO SELESAI DIBUAT 
- FormRequest V ​ IDEO SELESAI DIBUAT 
- Index ​VIDEO SELESAI DIBUAT 
- Create ​VIDEO SELESAI DIBUAT 
- Update V ​ IDEO SELESAI DIBUAT 
- Delete V ​ IDEO SELESAI DIBUAT 
- Data Galeri Travel 
- Model V ​ IDEO SELESAI DIBUAT 
- FormRequest ​VIDEO SELESAI DIBUAT 
- Index ​VIDEO SELESAI DIBUAT 
 - Create ​VIDEO SELESAI DIBUAT 
- Update V ​ IDEO SELESAI DIBUAT 
- Delete V​ IDEO SELESAI DIBUAT 
- Data Transaksi 
- Model ​VIDEO SELESAI DIBUAT 
- FormRequest V ​ IDEO SELESAI DIBUAT 
- Model Detail ​VIDEO SELESAI DIBUAT 
- Read & Detail ​VIDEO SELESAI DIBUAT 
- Update ​VIDEO SELESAI DIBUAT 
- Delete V
​ IDEO SELESAI DIBUAT 
- Membuat Statistik Dashboard ​VIDEO SELESAI DIBUAT 
- Integrasi Frontend 
- Integrasi Halaman Utama V ​ IDEO SELESAI DIBUAT 
- Integrasi Halaman Detail Travel ​VIDEO SELESAI DIBUAT 
- Penjelasan Routing Checkout V ​ IDEO SELESAI DIBUAT 
- Integrasi Halaman Checkout Tahap Pertama ​VIDEO SELESAI 
DIBUAT 
- Integrasi Halaman Checkout Tahap Kedua V ​ IDEO SELESAI 
DIBUAT 
 
## Deployment Aplikasi (Bonus Materi) 
- Mengamankan Aplikasi V ​ IDEO SELESAI DIBUAT 
- Memilih Hosting V​ IDEO SELESAI DIBUAT 
- Upload & Konfigurasi Aplikasi di Hosting ​VIDEO SELESAI DIBUAT 
 
## Bonus & Update Materi 
- Bonus Materi Slicing Login V​ IDEO SELESAI DIBUAT 
- Bonus Materi Email ​VIDEO SELESAI DIBUAT 
- Pengenalan MJML V ​ IDEO SELESAI DIBUAT 
- Slicing Gambar dan Membuat Header ​VIDEO SELESAI 
DIBUAT 
- Membuat Bagian Konten V ​ IDEO SELESAI DIBUAT 
- Membuat Bagian Bawah dan Footer V ​ IDEO SELESAI DIBUAT 
- Membuat Mailable di Laravel ​VIDEO SELESAI DIBUAT 
- Mengintegrasikan Data ke Email ​VIDEO SELESAI DIBUAT 
 
Tata Cara Order 
Harga kelas:  
Rp350.000 
*bayar sekali, akses video dan konsultasi selamanya 
 
Klik di bawah ini untuk melakukan order: 
https://buildwithangga.com/kelas/full-stack-web-developer 
 
(Konfirmasi pembayaran akan dikirimkan lewat W
​ hatsapp​ setelah transaksi) 
 
Catatan Penting: 
- Video akan diletakan pada G ​ oogle Drive d​ an bebas akses selamanya dan 
dapat di-download untuk belajar secara offline 
- Kelas akan dapat diakses melalui platform BWA & BelajarKoding 
- Dengan mengikuti kelas online ini, kalian mendapatkan akses ke 
serangkaian video pembelajaran sesuai dengan materi yang sudah ditulis 
di atas 
- Proses belajar dilakukan secara mandiri setelah kalian mendapatkan akses 
ke video pembelajaran 
- Kelas online ini tidak berupa pembelajaran secara live streaming 
- Video pembelajaran berbahasa Indonesia 
- Materi dari Dasar (tidak perlu khawatir, semua bisa belajar) 
- Semua tools yang diperlukan gratis / ​open-source 
 
 
Pertanyaan (WhatsApp):  
0877-310614-00  
👩 Miraz​ (Admin B​ elajarKoding​)  
(Jam 10.00 - 21.00 WIB) 
Biasakan membaca terlebih dahulu sebelum bertanya ya:) 
Terima kasih, kita tunggu di kelas ya, guys!