Digital Bootcamp - Intensive Class

Fullstack Web Dev With Laravel + Vue.Js

"Unlock Your Future with Fullstack Development"

📚 Kenapa harus mengikuti bootcamp Fullstack Web Developer With Laravel + Vue.Js?

👨‍🏫 Trainer yang akan mengajar 👩‍🏫

Tim-Mentor-Fullstack-Web-Development-1

Rizal Pahlevi

IT Development Manager

Backend & Frontend development, Database Management, System Architect.

Tim-Mentor-Fullstack-Web-Development-2

Reza Kusumah

System Architect & Business Analyst

Software Engineering, Database Management, System Analyst, Business Process Analyst.

foto-trainer-ke-13-(1)

Agus Ramdhani

Media, IT & Digital Strategist

Digital Product & Business, Technology & Project Management, Enterprise Solution, Software Engineering.

🎯 Target dan Sasaran kelas bootcamp ini

  • Membekali peserta dengan kemampuan End-to-End dalam pengembangan aplikasi berbasis web dari penguasaan fullstack development dengan laravel sebagai backend hingga teknologi frontend modern dengan Vue.js untuk membangun aplikasi web yang handal dan modern.
  • Menguasai penerapan best practice dalam pengambangan aplikasi web menggunakan standar industri seperti arsitektur MVC, Eloquent ORM, RESTful API, clean code, teknik keamanan dan performa tinggi, collaborative development dalam pengembangan aplikasi.
  • Menyiapkan karir sebagai fullstack developer dengan mengembangkan keterampilan praktis, membangun portofolio proyek nyata dan proses deployment aplikasi dalam lingkungan produksi.

💻 Topik yang akan dipelajari

  • Understanding of Fullstack Developer

  • Introduction to SDLC (Software Development Life Cycle)

  • Introduction to Fullstack Web Development

  • Fundamental PHP

  • Basic and Advance Database with MySQL

  • Introduction to Laravel

  • Introduction to Vue Js

  • State Management with Vuex

  • API Development & Integration

  • Authentication & Authorization

  • Form Handling & Validation

  • Real-Time Features

  • Deployment & Performance Optimization
  • Portofolio Project

🎁 Benefit yang didapat

ikon-dibimbing-it=expert

Dibimbing IT Expert &
Top Level Management Industri

ikon-fleksibelitas-program

Fleksibilitas Program dan
Fokus Skillset Tertentu

ikon-sertifikat

Sertifikat Diterbitkan CCIT FT-UI
(Universitas Indonesia)

ikon-belajar-dan-upgrade

3+ Bulan Belajar & Upgrade Skill Bareng Praktisi Top Industri

ikon-pendamping-24jam

Pendampingan Personal dan
24 Jam Akses Materi via LMS

ikon-bonus-eksklusif

Bonus Eksklusif 2 Materi Soft Skill Buat Siap Kerja!

⚙️ Tools yang akan digunakan

xampp-icon

Xampp

visual-studio-code-icon

VS Code

Vue Js

Laravel

NPM

Redis

MySQL

Composer

Gitlab

📝 Proyek yang akan dikerjakan

  • Solusi Aplikasi To-Do List
  • Solusi Aplikasi Kasir Online atau Point of Sale (POS)
  • Solusi Aplikasi LIMS (Laboratorium Information Management System) untuk Klinik & Rumah Sakit .

🏢 Prospek karir

📢 Untuk siapa kelas ini?

  • Mahasiswa (UI & Non UI) dan Umum yang ingin belajar dan memperkaya portofolio
  • Pemula yang Serius Ingin Masuk Dunia Web Development
  • Frontend Developer yang Mau Belajar Backend
  • Backend Developer yang Mau Kuasai Frontend
  • Profesional yang ingin switch karir dan Tech Entrepreneur

🕣 Jadwal

  1. Live Zoom setiap Senin dan Rabu pukul 18.30 – 21.30 (Malam)
  2. Durasi kelas 2,5 – 3 jam per sesi selama 3 bulan.
  3. Kelas dimulai tanggal 11 Agustus 2025.

🗂️ Teknis Pelaksanaan

  1. Peserta yang melakukan pendaftaran, wajib join di group Whatsapp yang diberikan.
  2. Setiap sesi live akan dilaksanakan secara online menggunakan Zoom selama 24x pertemuan dilanjutkan dengan project portofolio dan bimbingan softskill untuk siap kerja dan pengembangan karir.
  3. Peserta wajib aktif di platform LMS (Learning Management System) baik dalam pembelajaran maupun forum kolaborasi.
  4. Peserta dapat mendownload ataupun mengakses materi belajar termasuk sampel source code (khusus kelas programming) di LMS.
  5. Peserta dapat bertanya dan berdiskusi dengan mentor dan peserta lain terkait materi, tugas dan konsultasi di LMS.

Module 1: Understanding of Fullstack Developer

Topic: Understanding the Role of a Fullstack Developer

  • Responsibilities, required skills, and industry demand for Fullstack Developers.

Topic: Technology Stack in Fullstack Development

  • Overview of frontend, backend, databases, and DevOps tools used in modern web development.

Module 2: Introduction to SDLC (Software Development Life Cycle)

Topic: Overview of SDLC

  • Introduction to SDLC
  • SDLC Models & Methodologies

Topic: Understanding SDLC Process

  • Phase 1 – Planning & Requirement Analysis
  • Phase 2 – System Design & Architecture
  • Phase 3 – Development & Coding Standards
  • Phase 4 – Testing & Quality Assurance

Module 4: Fundamental PHP

Topic: Basic Php Syntax

  • PHP File Structure (<?php … ?>)
  • Output Functions (echo, print)
  • Data Types (String, Integer, Float, Boolean, Array, Object, NULL)
  • Variables & Constants ($var, define(), const)

Topic: Control structures

  • Conditional Statements (if, else, elseif, switch-case)
  • Looping Statements (for, while, do-while, foreach)
  • Break & Continue
  • Hands-on Exercise: Building a Small PHP Application with Control Structures

Topic: Functions

  • Functions with Parameters & Return Values
  • Default Parameter Values
  • Recursive Functions
  • Variable Scope (global, local, static)
  • Anonymous Functions & Closures
  • Hands-on Exercise: Developing Reusable Functions in PHP Projects

Topic: OOP PHP

  • OOP Basics (Class, Object, Property, Method)
  • Access Modifiers (public, private, protected)
  • Constructor & Destructor (__construct(), __destruct())
  • Inheritance
  • Polymorphism & Method Overriding
  • Static Methods & Properties
  • Interfaces & Abstract Classes
  • Traits in PHP
  • Hands-on Exercise: Building a Small OOP-Based PHP Application

Module 6: Introduction to Laravel

Topic: Understanding MVC in Laravel

  • Model, View, Controller Structure
  • Routing in Laravel
  • Using Controllers & Middleware
  • Working with Blade Templates
  • Hands-on Exercise:
    – Build a Basic Laravel MVC App, Develop a Simple Blog Application with Routes, Controllers, and Views

Topic: Database & Eloquent ORM

  • Configuring Laravel with MySQL/MariaDB
  • Using Migrations & Seeders
  • CRUD Operations with Eloquent
  • Defining Database Relationships
  • Hands-on Exercise:
    Build a Laravel CRUD App Using Eloquent ORM
    – Create a Task Management App with: Database Migration, CRUD Operations, User Authentication

Topic: React Native Basics

  • Learning React Native Core Component
  • Styling Core Component
  • Creating Reusable Component
  • Component Props
  • Basic Event Handling
  • Hands-on Exercise:
    – Build a simple profile screen with images, text, and interactive buttons

Topic: React Native Routing

  • Expo File Based Routing
  • Stack, Drawer, & Tab Routing
  • Route With Parameter
  • Hands-on Exercise:
    – Build a multi-screen app with Stack & Tab Navigation

Topic: State Management & Hooks

  • Learn how useEffect & useState works
  • Statefull Component vs Stateless Component
  • Hands-on Exercise:
    – Implement a to-do list app with Context API

Topic: Basic Form Handling

  • Creating Simple Form Input
  • Basic Form Input Validation
  • Displaying Submitted Form Data in a Basic UI
  • Hands-on Exercise:
    – Build a login & registration form with validation

Module 8: State Management with Vuex

Topic: Managing State in Vue.js

  • Introduction to Vuex
  • Mutations, Actions, and Getters
  • Handling Global State
  • Best Practices for State Management
  • Hands-on Exercise:
    – Create a Vue Component with Local State

Module 10: Authentication & Authorization

Topic: Implementing User Authentication

  • User Registration & Login in Laravel
  • Laravel Sanctum for API Authentication
  • Role-Based Access Control (RBAC)
  • Protecting Routes in Vue.js
  • Hands-on Exercise:
    -Implement User Authentication & Role-Based Access for an API

Module 11: Form Handling & Validation

Topic: Input Validation & Error Handling

  • Client-Side Validation in Vue.js
  • Server-Side Validation in Laravel
  • Flash Messages for User Feedback
  • Debugging with Laravel Logs & Vue DevTools
  • Hands-on Exercise:
    – Implement a Laravel Form Validation with Custom Rules
    – Implement Custom Error Handling for an API

Module 13: Deployment & Performance Optimization

Topic: Deploying Laravel & Vue.js Applications

  • Setting Up a VPS Server (DigitalOcean/AWS)
  • Configuring Apache/Nginx
  • Laravel Environment Configuration
  • Database Optimization & Caching
  • Hands-on Exercise:
    – Deploy a Laravel API with Vue.js Frontend on a Cloud Server

Topic: Frontend Performance Optimization

  • Minification & Bundling
  • Code Splitting in Vue
  • Lazy Loading Components
  • Best Practices for Large-Scale Apps
  • Hands-on Exercise:
    – Optimize an Existing Vue.js & Laravel Application for Performance

Topic: Introduction to Redis Caching Database

  • What is Redis & How It Works
  • Installing & Configuring Redis in Laravel
  • Using Redis for Caching Queries
  • Implementing Session Storage with Redis
  • Hands-on Exercise:
    – Implement Redis Caching for API Responses & Sessions

Module 3: Introduction to Fullstack Web Development

Topic: Overview of Fullstack Development

  • What is Fullstack Development?
  • Frontend vs Backend
  • Web Application Architecture
  • Monolithic vs Microservices

Topic: Setting Up Development Environment

  • Installing Laravel via Composer
  • Setting Up Vue.js with Vue CLI
  • Basic Folder Structure for Laravel & Vue.js
  • Using Git for Version Control

Module 5: Basic and Advance Database with MySQL

Topic: Introduction to Relational Databases and MySQL

  • Understanding Databases
    – Definition and Importance of Databases
    – Relational vs. Non-Relational Databases
  • MySQL Overview
    – History and Features of MySQL
    – Installation and Configuration on Various Platforms
  • MySQL Workbench:
    – Introduction to MySQL Workbench
    – Connecting to Databases and Basic Navigation
  • Hands-on Exercise: Setting Up MySQL & Creating a New Database

Topic: Basic SQL Operations

  • Data Retrieval:
    – SELECT Statements
    – Filtering Data with WHERE Clauses
    – Sorting Results with ORDER BY
  • Data Manipulation:
    – INSERT INTO Statements
    – UPDATE and DELETE Operations
  • Functions and Expressions:
    – Using Built-in Functions (e.g., COUNT, SUM, AVG)
    – String and Date Functions
  • Hands-on Exercise:
    – Create & Populate a Database for a Simple E-Commerce System

Topic: Advanced SQL Techniques

  • Complex Queries:
    – Subqueries and Nested Queries
    – Common Table Expressions (CTEs)
  • Joins:
    – INNER JOIN, LEFT JOIN, RIGHT JOIN, FULL JOIN
    – Self Joins and Cross Joins
  • Set Operations:
    – UNION, INTERSECT, and EXCEPT
  • Hands-on Exercise:
    – Optimize Queries for a Large Dataset Using Indexing

Topic: Database Design and Normalization

  • Schema Design:
    – Defining Tables, Columns, and Data Types
    – Primary and Foreign Keys
  • Normalization:
    – First, Second, and Third Normal Forms
    – Denormalization Techniques
  • Entity-Relationship (ER) Modeling:
    – Creating ER Diagrams
    – Mapping ER Models to Relational Schemas
  • Hands-on Exercise:
    – Design & Implement a Well-Normalized Database Schema

Topic: Indexing and Query Optimization

  • Indexes:
    – Creating and Managing Indexes
    – Understanding Index Types (e.g., B-Tree, Hash)
  • Query Optimization:
    – Analyzing Query Performance with EXPLAIN
    – Optimizing Joins and Subqueries
  • Performance Tuning:
    – Configuring MySQL Performance Settings
    – Monitoring and Profiling Queries
  • Hands-on Exercise:
    – Implement Stored Procedures & Triggers in a Real-World Use Case

Topic: Stored Procedures, Functions, and Triggers

  • Stored Procedures:
    – Creating and Executing Stored Procedures
    – Parameter Handling and Control Flow
  • User-Defined Functions:
    – Defining and Using Functions
    – Differences Between Procedures and Functions
  • Triggers:
    – Creating Triggers for Data Integrity
    – Use Cases for BEFORE and AFTER Triggers
  • Hands-on Exercise:
    – Implement Role-Based Access Control in MySQL

Module 7: Introduction to Vue Js

Topic: Vue.js Core Concepts

  • Understanding Components & Props
  • Data Binding with v-model & v-bind
  • Event Handling in Vue
  • Vue Lifecycle Hooks
  • Hands-on Exercise: Build a Basic Vue.js Frontend
    – Create a Dynamic To-Do App Using Vue Components
    – Implement Data Binding, Events, and State Management

Topic: Vue Router & Navigation

  • Setting Up Vue Router
  • Dynamic Routing with Params
  • Route Guards & Navigation Guards
  • Lazy Loading Routes
  • Hands-on Exercise: Build a Vue Router-Based SPA (Single Page Application)
    – Create a Multi-Page Blog App with Dynamic Navigation
    – Implement Protected Routes for Authentication

Module 9: API Development & Integration

Topic: Building RESTful APIs in Laravel

  • Creating API Routes & Controllers
  • Handling Requests & Responses
  • JSON Structure Best Practices
  • Testing APIs with Postman
  • Hands-on Exercise:
    – Design RESTful API Endpoints for a Blogging Platform

Topic: Fetching API Data in Vue.js

  • Making API Calls with Axios
  • Handling API Errors & Loading States
  • CRUD Operations via API
  • Managing Authentication Tokens
  • Hands-on Exercise:
    – Build a Vue.js App that Fetches & Displays Data from Laravel API

Module 12: Real-Time Features

Topic: WebSockets & Laravel Broadcasting

  • Introduction to WebSockets
  • Using Laravel Echo
  • Real-Time Notifications
  • Implementing a Chat System
  • Hands-on Exercise:
    – Set up Laravel Broadcasting with Pusher
    – Build a Real-Time Notification System in Laravel
    – Implement Secure Private Channels for a Real-Time Chat App

Topic: Intoduction to Figma

  • Overview of Figma interface & tools
  • Creating and managing a new design file
  • Understanding frames, layers, and artboards

Topic: Creating UI/UX Design for Mobile Apps

  • Research & Wireframing
  • UI Design & Styling
  • Prototyping & Testing
  • Hands-on Exercise:
    – Develop and implementing simple UI/UX design for mobile apps

Module 14: Portofolio Project

Topic: Projects

Topic: Assesment / Uji Kompetensi

Premium

Rp.7.000.000

Umum

Rp.5.500.000

Mahasiswa

Rp.3.500.000

Frequently Asked Question

Tidak. Kursus ini dirancang dan disesuaikan  untuk pemula , mahasiswa, umum dan profesional tanpa latar belakang IT. Materi disusun secara bertahap, mulai dari dasar hingga tingkat lanjut, sehingga dapat diikuti oleh siapa saja.

Ya. Setelah menyelesaikan seluruh materi dan tugas yang diberikan, Anda akan menerima sertifikat resmi dikeluarkan oleh CCIT FT Universitas Indonesia (UI) yang dapat digunakan untuk melamar pekerjaan atau menambah portofolio profesional.

Kursus ini menggunakan metode blended learning, yaitu kombinasi antara:

  • Belajar mandiri melalui platform e-learning, di mana peserta dapat mengakses materi, video, dan tugas kapan saja.
  • Virtual meet via Zoom (live session) bersama mentor, dijadwalkan secara rutin untuk diskusi, tanya jawab, atau membahas topik penting secara interaktif.
    Metode ini memberikan fleksibilitas belajar sekaligus pengalaman interaktif dengan pendampingan mentor.

Ya. Kami menyediakan forum diskusi, sesi tanya jawab bersama mentor, serta dukungan teknis untuk membantu Anda selama proses belajar.

Untuk kursus secara umum (selain Mobile Development), perangkat minimal yang disarankan adalah:

  • Prosesor: Minimal Dual-core, seperti Intel Core i3 generasi ke-6 atau AMD Ryzen 3 2200U
  • RAM: Minimal 4GB (disarankan 8GB)
  • Sistem Operasi: Windows 10, macOS 10.13 atau versi lebih baru
  • Koneksi Internet: Stabil, minimal 10 Mbps

    Untuk kursus Mobile Development dan Game Development, disarankan:
  • Prosesor: Quad-core, seperti Intel Core i5 generasi ke-8 atau AMD Ryzen 5 3500U
  • RAM: Minimal 8GB (disarankan 12GB atau lebih)
  • Penyimpanan: SSD minimal 256GB

Ya. Kursus ini bekerja sama dengan CCIT FT Universitas Indonesia, sehingga sertifikat yang diterbitkan memiliki kredibilitas tinggi dan dapat menjadi nilai tambah pada CV Anda.

Durasi kelas intensive bootcamp adalah 3 bulan, dengan sesi live melalui Zoom 2 kali dalam seminggu, masing-masing berdurasi 3 jam. Jadwal berlangsung pada hari kerja (weekdays) pukul 19.00 – 22.00 WIB atau hari libur (weekend) pukul 09.00 - 12.00

Durasi kelas fast track adalah 5 hari, dengan sesi live melalui Zoom 5 kali dalam seminggu, masing-masing berdurasi 3 jam. Jadwal berlangsung pada hari kerja (weekdays) pukul 19.00 – 22.00 WIB atau hari libur (weekend) pukul 09.00 - 12.00

Ya. Materi kursus dapat diakses kapan saja melalui platform LMS atau LXP, sehingga Anda bisa belajar secara fleksibel di luar jadwal live session.

Ya. Tugas diberikan di setiap akhir pertemuan. Selain itu, peserta akan mengerjakan proyek nyata (real project) sebagai bagian dari proses belajar dan portofolio.

Ya. Kursus ini berbayar, namun Anda akan mendapatkan akses seumur hidup ke seluruh materi pembelajaran, termasuk video, modul, dan forum diskusi.

Ya. Peserta akan mendapatkan bimbingan langsung dari mentor profesional, serta akses ke group chat khusus untuk berdiskusi dan berkonsultasi.

Tidak ada tes masuk untuk dapat mengikuti program di Digiskill Hub, semua orang dengan latar belakang apapun dapat mengikuti program ini

Ingin belajar skill digital menarik lainnya?

Kami juga ada program Intensive Bootcamp lainnya — pembelajaran mendalam dan langsung praktik bareng mentor!