Our Happy Students
Review setelah bergabung di kelas Full-Stack JavaScript Developer: Website Travel
Flash Sale 12.12 Kelas Premium Jadi Rp 99k
Gunakan kode promo JADIPRO
Akses kelas selamanya
Ambil PromoLearn how to build a real project from scratch
10,577 enrolled
MERN Stack adalah bagian dari Full-Stack Web Developer yang difokuskan kepada JavaScript (Full-Stack JavaScript Developer). M untuk MongoDB, E untuk ExpressJS, R untuk ReactJS, dan N untuk NodeJS. Kalian akan mempelajari semua hal tersebut pada kelas ini. Tapi bukan hanya sekedar ngoding aja namun kalian akan mulai dari bagian UI dan UX sehingga paham betul bagaimana caranya membangun suatu website yang memiliki better experience.
Tools pada kelas ini semuanya gratis dan pengguna OS apa saja dapat mengikutinya. Pertama kalian akan mulai merancang design website dari tahap melakukan riset dan pembuatan information architecture. Lalu setelah itu kita juga akan membuat Wireframe untuk digunakan sebagai gambaran kasar.
Setelah proses Wireframe selesai maka akan dilanjutkan kepada tahap Visual Design dan Web Development. Silakan bergabung untuk mempelajarinya lebih lanjut. Kami akan tunggu kalian di kelas ya.
Belajar Menggunakan Library Reactjs
Belajar Membuat API dengan Nodejs & Expressjs
Belajar membuat reusable component react from scratch
Belajar mengolah DB non-sequel dengan mongodb
Belajar UI/UX dalam membangun suatu website booking hotel online
Belajar Usability-Testing dengan menganalisa behaviour pengguna website
Cocok untuk yang ingin membangun website pencarian tempat berlibur
Diperuntukkan yang ingin mendalami library reactjs menggunakan framework nextjs
Bagi mereka yang ingin belajar UI/UX Design
Brief Project
5:00
Break Heula
1:00
Customer Part 1
3:00
Customer Part 2
4:00
Customer Part 3
5:00
Break Heula Again
1:00
Information Architecture Part 1
4:00
Information Architecture Part 2
3:00
Break Sebentar
1:00
UX User Flow Part 1
6:00
UX User Flow Part 3
5:00
Share UX Project
1:00
Persiapan
1:00
Part 1
5:00
Part 2
5:00
Part 3
4:00
Part 4
4:00
Part 5
3:00
Part 6
8:00
Perkenalan
1:00
New MoodBoard
4:00
Color Scheme
5:00
Icon Design Inspiration
4:00
Illustration Empty States
2:00
Pemilihan Font Tipografi
7:00
Perkenalan Figma
4:00
Grid System
3:00
Logo & Navigation
5:00
Coloring Logo
6:00
Hero Banner Title
6:00
UX Above the Fold
7:00
CTA Button
5:00
Drop Shadows
4:00
Components
4:00
Banner Image
4:00
Customize Frame
4:00
Data Placeholder Statistic
4:00
Icon Traveler
6:00
Icon Treasure & Cities
10:00
Export & Resize Icons
5:00
Column
4:00
Linear Gradient
7:00
Tugas Design
3:00
Badge Hotel
5:00
Other Items
5:00
New Badge
3:00
Add Image
5:00
Icon Star
4:00
UX Content
6:00
Design Footer
5:00
Copyright
2:00
Details
5:00
House Photos
5:00
Room Descriptions
3:00
Features dan Icons
7:00
Lamp Icon
3:00
Bathroom Icon
3:00
Dining Room Icon
5:00
Wifi Icon
2:00
AC Icon
3:00
Others Icon
4:00
Booking Form
8:00
Calendar Module
4:00
Icon Calendar
6:00
CTA Button
5:00
Tweking Design
3:00
Treasure Section
2:00
Story Section
2:00
Item Booking
5:00
Stepper Section
5:00
Form Customer
3:00
Design Button CTA
2:00
UX Stepper
4:00
Payment Section
6:00
Final Page
3:00
Sketching Illustration
3:00
Shapes Illustration
6:00
New Elements
6:00
Export Illustration
2:00
UI Animation
4:00
UI Prototype
5:00
Final Prototype
4:00
Persiapan Kolaborasi
3:00
Presentation
9:00
Feedback Design
2:00
Slicing Design Asset
3:00
Inspect Design Element
2:00
Support Developer
1:00
Pengenalan project
2:00
Tools required
3:00
Persiapan workspace part 1
6:00
Persiapan workspace part 2
5:00
Mempersiapkan component button
4:00
Mempersiapkan component button part 2
7:00
Mempersiapkan component button part 3
4:00
Testing component button
5:00
Testing component button part 2
6:00
Commit component button
2:00
Update variable color
5:00
Create logo as parts components
4:00
Persiapan Slicing header
3:00
Mulai slicing header component
6:00
Troubleshooting ketika mengalami salah penutupan tag + commit git
6:00
Export image from figma
5:00
Import image to hero js
5:00
Menyusun component hero
7:00
Menyusun component hero part 2
7:00
Menyusun component hero part 3
6:00
Styling Component Hero
6:00
Styling Component Hero Part 2
3:00
Number Format with internationalization browser API
3:00
Penjelasan singkat section mostpicked
2:00
export image dari figma + contoh menggunakan grid bootstrap
4:00
display grid + simple grid markup
6:00
markup mostpicked complete
6:00
mostpicked styling css
7:00
mostpicked styling css part 2
6:00
mostpicked styling css part 3
3:00
double check kerjaan di section mostpicked
4:00
Penjelasan Section Categories
2:00
Component categories
6:00
Component categories part 2
5:00
Component categories part 3 sampai conclusion component categories
3:00
Penjelasan Section Testimonial + Export assets
3:00
Smart component star
7:00
Smart component star part 2
2:00
Styling component star
6:00
Styling component star part 2
2:00
Testing component star
6:00
Component testimony
6:00
Component testimony part 2
4:00
Styling component testimony
4:00
Penjelasan dan mulai menulis component footer
7:00
Component footer part 2
7:00
Component footer part 3
5:00
menambahkan react reveal
7:00
Penjelasan singkat item details
3:00
Persiapan untuk slicing item details
4:00
component element input number
7:00
component element input number part 2
6:00
styling input number
3:00
testing input number
6:00
contoh input number
4:00
Elements input date dan pengenalan singkat hooks useEffect dan useRef
4:00
Elements input date part 2
13:00
Elements input date part 3
4:00
Styling input date
5:00
Testing input date part 2
2:00
Contoh input date
3:00
Testing input date + utils formatDate
6:00
Element breadcrumb
4:00
Styling breadcrumb
1:00
Testing breadcrumb
2:00
Sample breadcrumb
2:00
Parts page detail title
4:00
Parts page detail title part 2
4:00
detail page featured image
4:00
page detail description bug fix
2:00
booking form
6:00
booking form part 2
7:00
styling booking form
5:00
menyelesaikan details page
5:00
Intro checkout page
3:00
Improve parts header
2:00
Sneak peak component stepper
2:00
Component Stepper
7:00
Component Controller
1:00
Component main content
1:00
Component meta
2:00
Component numbering
3:00
Styling numbering
10:00
Component input text
7:00
Styling input text
2:00
Component input file
5:00
Booking Information
8:00
Payment
8:00
Completed
2:00
Checkout page
6:00
Checkout page part 2
4:00
End slicing session
4:00
Roadmap Node JS
1:00
Intro Node JS
3:00
Tools
1:00
Install Node JS on Windows
2:00
How to Use Node with REPL & File JS
5:00
Module build in
4:00
Module npm
5:00
Membuat module sendiri
6:00
Install Express JS with Node JS
3:00
Belajar Menangani Routing dan Instalasi Nodemon Development
6:00
Instalasi Template Engine EJS
4:00
Belajar Parsing data
4:00
Installing MongoDB on Windows Compass
3:00
Mengenal Mongoose dan Create Data
10:00
Membaca data dari database mongodb menggunakan mongoose
4:00
Validasi data menggunakan mongoose
5:00
Update dan Delete data menggunakan Mongoose
6:00
Membuat relationship dan memasukkan data menggunakan mongoose
6:00
Schema Staycation Part 1
4:00
Schema Staycation part 2
5:00
Schema Staycation part 3
6:00
Install Express Generator
3:00
Create Structure folder Express JS
4:00
Install Mongoose & Create Models Part 1
5:00
Validasi Mongoose
1:00
Install Mongoose & Create Models Part 2
6:00
Install Mongoose & Create Models Part 3
6:00
Install sbadmin2
2:00
Integrasi template sbadmin2
7:00
View Dashboard
6:00
Setting Sidebar and Navbar Project Staycation
5:00
Setting url Admin Staycation
2:00
View Category
10:00
View Bank
4:00
View Item
6:00
View Booking
5:00
Membuat Koneksi Database
2:00
CRUD Project Staycation Category Create
7:00
CRUD Project Staycation Category Read
5:00
CRUD Project Staycation Update Part 1
7:00
CRUD Project Staycation Update Part 2
6:00
CRUD Project Staycation Delete
4:00
Handle Error with try catch and validasi input required
3:00
Alert Message &Title Dinamis
12:00
CRUD Project Staycation Bank Create
13:00
CRUD Project Staycation Bank Read
3:00
CRUD Project Staycation Bank Update
12:00
CRUD Project Staycation Bank Delete
3:00
Repair Relasi Project Staycation
3:00
View Item with Nav Tabs
7:00
CRUD Project Staycation Item Create
18:00
CRUD Project Staycation Item Read
5:00
Show image Project Staycation Item
11:00
Show Item Single by id
8:00
CRUD Projrect Staycation Item Update
10:00
CRUD Project Staycation Item Delete
6:00
Detail Item Project Staycation Show Feature & Activity
14:00
CRUD Project Staycation Create Feature
11:00
CRUD Project Staycation Read Feature
3:00
CRUD Project Staycation Update Feature
8:00
CRUD Project Staycation Delete Feature
8:00
CRUD Project Staycation Create Activity
5:00
CRUD Project Staycation Read Activity
2:00
CRUD Project Staycation Update Activity
5:00
CRUD Project Staycation Delete Activity
4:00
Add Schema Users and Seeder
14:00
Login Project Staycation
8:00
Autentikasi Project Staycation
5:00
Logout Project Staycation
5:00
Booking Project Staycation
9:00
Show Detail Booking
15:00
Action Confirmation and Reject booking Project Staycation
8:00
Dashboard Project Staycation
5:00
API Landing Page Project Staycation Part 1
6:00
API Landing Page Project Staycation Part 2
10:00
API Landing Page Project Staycation Part 3
7:00
API Landing Page Project Staycation Part 4
8:00
API Landing Page Project Staycation Part 5
2:00
API Detail Page Project Staycation
7:00
API Booking Project Staycation Part 1
9:00
API Booking Project Staycation Part 2
10:00
Documentation API with Postman
5:00
Testing API Landing Page
12:00
Testing API Detail Page
6:00
Testing API Booking Page
10:00
Persiapan Tools
1:00
Create Akun Heroku
3:00
Create Repository Github
3:00
Deploy Heroku
10:00
Instalasi Redux
4:00
Actions, Reducers, Provider, store installed
4:00
Connect item details to checkout booking page
6:00
Try checkout booking
9:00
Setup postman to test ready endpoint
4:00
Action fetchPage
5:00
Action fetchPage part 2
5:00
Tracing error while integration landing page
6:00
Tracing error while integration landing page part 2
7:00
Tracing error while integration landing page part 3
2:00
API integration item details page
6:00
API integration item details page part 2
7:00
API integration item details page part 3
7:00
API integration item details page part 4
4:00
API integration item details page part 5
7:00
Setup postman method post checkout
5:00
Integrasi checkout page
7:00
Integrasi checkout page part 2
7:00
Integrasi checkout page part 3
6:00
Axios interceptor
6:00
Error handler with toaster
2:00
React Router DOM Part 1
12:00
React Router DOM Part 2
15:00
React Router DOM Part 3
14:00
React Router DOM Part 4
15:00
React Router DOM Part 5
12:00
Responsive Part 1
15:00
Responsive Part 2
15:00
Responsive Part 3
15:00
Responsive Part 4
18:00
Full-Stack Developer
(415.3K)
Full-Stack Developer
(57.2K)
Full-Stack Developer
(37.7K)
Review setelah bergabung di kelas Full-Stack JavaScript Developer: Website Travel
Terjangkau harganya namun Materi Sangat Berkualitas, sangat mudah menangkap apa yang disampaikan dari sang pemateri! Sukses terus untuk mas Angga, Mas Yein dan Mas Elfin sebagai mentor! Terimakasih Banyak! read more
Materinya daging sekali... Kalau saya boleh minta request, diakhir video tolong dibahas responsivenya dong mas.. terimaksih buat mas angga sudah buat platform keren ini. read more
Pelajaranya mudah dipahami, salain fokus pada modul pembelajaran juga diajarkan teknologi pendukung read more
Learn how to build a real project from scratch