Brief Project

Break Heula

Customer Part 1

Customer Part 2

Customer Part 3

Break Heula Again

Information Architecture Part 1

Information Architecture Part 2

Quiz

Break Sebentar

UX User Flow Part 1

UX User Flow Part 2

UX User Flow Part 3

Share UX Project

Quiz

Persiapan

Part 1

Part 2

Part 3

Part 4

Part 5

Part 6

Perkenalan

New MoodBoard

Color Scheme

Icon Design Inspiration

Illustration Empty States

Pemilihan Font Tipografi

Perkenalan Figma

Grid System

Logo & Navigation

Coloring Logo

Hero Banner Title

UX Above the Fold

CTA Button

Drop Shadows

Components

Banner Image

Customize Frame

Data Placeholder Statistic

Icon Traveler

Icon Treasure & Cities

Export & Resize Icons

Column

Linear Gradient

Tugas Design

Badge Hotel

Other Items

New Badge

Add Image

Icon Star

UX Content

Design Footer

Copyright

Details

House Photos

Room Descriptions

Features dan Icons

Lamp Icon

Bathroom Icon

Dining Room Icon

Wifi Icon

AC Icon

Others Icon

Booking Form

Calendar Module

Icon Calendar

CTA Button

Tweking Design

Treasure Section

Story Section

Item Booking

Stepper Section

Form Customer

Design Button CTA

UX Stepper

Payment Section

Final Page

Sketching Illustration

Shapes Illustration

New Elements

Export Illustration

UI Animation

UI Prototype

Final Prototype

Persiapan Kolaborasi

Presentation

Feedback Design

Slicing Design Asset

Inspect Design Element

Support Developer

Pengenalan project

Tools required

Persiapan workspace part 1

Persiapan workspace part 2

Quiz

Mempersiapkan component button

Mempersiapkan component button part 2

Mempersiapkan component button part 3

Testing component button

Testing component button part 2

Commit component button

Quiz

Update variable color

Create logo as parts components

Persiapan Slicing header

Mulai slicing header component

Styling navbar header

Troubleshooting ketika mengalami salah penutupan tag + commit git

Export image from figma

Import image to hero js

Menyusun component hero

Menyusun component hero part 2

Menyusun component hero part 3

Styling Component Hero

Styling Component Hero Part 2

Number Format with internationalization browser API

Penjelasan singkat section mostpicked

export image dari figma + contoh menggunakan grid bootstrap

display grid + simple grid markup

markup mostpicked complete

mostpicked styling css

mostpicked styling css part 2

mostpicked styling css part 3

double check kerjaan di section mostpicked

Quiz

Penjelasan Section Categories

Component categories

Component categories part 2

Component categories part 3 sampai conclusion component categories

Penjelasan Section Testimonial + Export assets

Smart component star

Smart component star part 2

Styling component star

Styling component star part 2

Testing component star

Component testimony

Component testimony part 2

Styling component testimony

Penjelasan dan mulai menulis component footer

Component footer part 2

Component footer part 3

menambahkan react reveal

Penjelasan singkat item details

Persiapan untuk slicing item details

component element input number

component element input number part 2

styling input number

testing input number

contoh input number

Elements input date dan pengenalan singkat hooks useEffect dan useRef

Elements input date part 2

Elements input date part 3

Styling input date

Testing input date + utils formatDate

Testing input date part 2

Contoh input date

Element breadcrumb

Styling breadcrumb

Testing breadcrumb

Sample breadcrumb

Parts page detail title

Parts page detail title part 2

detail page featured image

page detail description

page detail description bug fix

booking form

booking form part 2

styling booking form

menyelesaikan details page

Intro checkout page

Improve parts header

Sneak peak component stepper

Component Stepper

Component Controller

Component main content

Component meta

Component numbering

Styling numbering

Quiz

Component input text

Styling input text

Component input file

Booking Information

Payment

Completed

Checkout page

Checkout page part 2

End slicing session

Roadmap Node JS

Intro Node JS

Tools

Install Node JS on Windows

How to Use Node with REPL & File JS

Module build in

Module npm

Membuat module sendiri

Install Express JS with Node JS

Belajar Menangani Routing dan Instalasi Nodemon Development

Instalasi Template Engine EJS

Belajar Parsing data

Quiz

Installing MongoDB on Windows Compass

Mengenal Mongoose dan Create Data

Membaca data dari database mongodb menggunakan mongoose

Validasi data menggunakan mongoose

Update dan Delete data menggunakan Mongoose

Membuat relationship dan memasukkan data menggunakan mongoose

Quiz

Schema Staycation Part 1

Schema Staycation part 2

Schema Staycation part 3

Install Express Generator

Create Structure folder Express JS

Install Mongoose & Create Models Part 1

Validasi Mongoose

Install Mongoose & Create Models Part 2

Install Mongoose & Create Models Part 3

Install sbadmin2

Integrasi template sbadmin2

Pemisahan Template dan Content

View Dashboard

Setting Sidebar and Navbar Project Staycation

Setting url Admin Staycation

View Category

View Bank

View Item

View Booking

Quiz

Membuat Koneksi Database

CRUD Project Staycation Category Create

CRUD Project Staycation Category Read

CRUD Project Staycation Update Part 1

CRUD Project Staycation Update Part 2

CRUD Project Staycation Delete

Handle Error with try catch and validasi input required

Alert Message &Title Dinamis

CRUD Project Staycation Bank Create

CRUD Project Staycation Bank Read

CRUD Project Staycation Bank Update

CRUD Project Staycation Bank Delete

Repair Relasi Project Staycation

View Item with Nav Tabs

CRUD Project Staycation Item Create

CRUD Project Staycation Item Read

Show image Project Staycation Item

Show Item Single by id

CRUD Projrect Staycation Item Update

CRUD Project Staycation Item Delete

Detail Item Project Staycation Show Feature & Activity

CRUD Project Staycation Create Feature

CRUD Project Staycation Read Feature

CRUD Project Staycation Update Feature

CRUD Project Staycation Delete Feature

CRUD Project Staycation Create Activity

CRUD Project Staycation Read Activity

CRUD Project Staycation Update Activity

CRUD Project Staycation Delete Activity

Add Schema Users and Seeder

Login Project Staycation

Autentikasi Project Staycation

Logout Project Staycation

Booking Project Staycation

Show Detail Booking

Action Confirmation and Reject booking Project Staycation

Dashboard Project Staycation

API Landing Page Project Staycation Part 1

API Landing Page Project Staycation Part 2

API Landing Page Project Staycation Part 3

API Landing Page Project Staycation Part 4

API Landing Page Project Staycation Part 5

Quiz

API Detail Page Project Staycation

API Booking Project Staycation Part 1

API Booking Project Staycation Part 2

Documentation API with Postman

Testing API Landing Page

Testing API Detail Page

Testing API Booking Page

Persiapan Tools

Create Akun Heroku

Create Repository Github

Create akun mongodb atlas

Deploy Heroku

Quiz

Instalasi Redux

Actions, Reducers, Provider, store installed

Connect item details to checkout booking page

Try checkout booking

Setup postman to test ready endpoint

Action fetchPage

Action fetchPage part 2

Tracing error while integration landing page

Tracing error while integration landing page part 2

Tracing error while integration landing page part 3

API integration item details page

API integration item details page part 2

API integration item details page part 3

API integration item details page part 4

API integration item details page part 5

Setup postman method post checkout

Integrasi checkout page

Integrasi checkout page part 2

Integrasi checkout page part 3

Axios interceptor

Error handler with toaster