Learn Livewire V3 from Scratch : Practical Course

In this course, we will be Learning Laravel Livewire v3 (A tool to build Powerful, dynamic, front-end UIs without leaving PHP)  along with Laravel (TALL stack in general) in a practical way by building multiple practical projects along the way.

Projects Roadmap and Status:

[Uploaded] Livewire Basics

[Uploaded] Building a Simple Student's Management System

[Uploaded] Building Amazing and Performant data tables with the TALL Stack

[Uploaded] Building a re-usable Comments System with Livewire

[Uploaded] Building Multi-Step Forms with Livewire

[Uploaded] Building a Re-Usable drag and drop Uploader

[Uploaded] Building real-time applications with Laravel, Livewire and Reverb

Project Description:

[Uploaded] Livewire Basics

In this section, we'll look into the basics of Livewire and some of the fundamental features Livewire provides.

Some of the topics we'll cover in this section include:

• Learn how to Define Components in Livewire

• Look into Properties and Actions in Livewire and their general use cases.

• Learn about Lifecycle Hooks in Livewire and their conventions.

• Learn about Full Page Components in Livewire, how to use them, and some issues we might face. (these eliminate the use of Laravel Controllers and intermediate views)

• A gentle introduction to Alpine.js and how to use it in Livewire/Blade

[Uploaded] Building a Simple Student's Management System

In this section, we'll build a simple CRUD app and dive into the fundamentals of building CRUD applications with Livewire and the TALL Stack, we'll start by installing Laravel and then set up Livewire along with Laravel Breeze installation, and we will learn the following topics along the way:

• Learn about Lifecycle hooks and Build dependent dropdowns in Livewire

• Learn how to extract properties and methods to a Form Object and use it in a Livewire Component

• Learn how to work with Factories and Seeders in Laravel, and seed the necessary data for all of our Models

• Learn about the new #[Rule] attribute syntax in Livewire and implement Validations.

• Learn about wire:navigate and implement SPA kind of experience in a Livewire-based app.

• Look into the issues we might face while using dedicated form objects, and eventually fix all of them.

[Uploaded] Building Performant data tables with the TALL Stack

We'll continue from where we left off in the previous section and build an interesting data table in this section.

This includes Excel Exports, Filtering Functionality, Bulk Records Selection, Loading Indicators etc.

Some of the features that we'll cover in this section are listed below:

• Learn how to Implement Loading Indicators (while paginating data or while performing any operation)

• Learn how to Implement Search functionality (supporting multi-column searching)

• Learn how to Implement Columns Sort functionality (supports multi-column sorting)

• Learn how to implement Bulk Actions (a feature to select multiple rows and perform group action on all of them)

• Learn how to implement Excel Exports

• We'll also learn how to install and configure the Filament Notifications package to display notifications.

• We'll also implement Selecting all the records (across all the pages), and make the necessary visual changes.

• Learn how to Implement Filter Functionality

• And many more...

[Uploaded] Building a re-usable Comments System with Livewire

In this Section, we'll be building a re-usable Comments Component that instantly works for any model. We'll use polymorphic relationships, which can be attached to multiple models.

Some of the features that we'll cover in this section are listed below:

• Learn how to build a re-usable Comments Component that supports multiple models along with Comment Edit, Delete, and Reply Functionality.

• Learn how to implement proper authorization checks (on both frontend and backend) so that only the authorized user can delete the comment.

• We'll sprinkle in Alpine.js to make our Livewire Component more interactive (like showing reply/edit forms, applying transitions etc.)

• We'll also learn how to automatically focus the reply/edit forms when it is rendered in the form. (using Alpine.js)

• We'll also implement replying to Comments, Editing Comments/Replies, Deleting Comments and Replies

• Learn how to properly paginate the comments and fix a few issues along the way.

• At the end, we'll look at how to optimize our database queries using eager loading strategies.

[Uploaded] Building Multi-Step Forms with Livewire

In this section, We'll learn about everything we need to build multi-step forms in Livewire. We'll cover the basics of creating a multi-step form, adding steps, navigating steps and accessing state, and building a practical project at the end of the Section.

Some of the features that we'll cover in this section are listed below:

• Learn how to navigate between the steps of the multi-step form seamlessly, we'll also implement proper Validations along the way.

• We'll use a Laravel package dedicated to building multi-step forms in this section, and build features on top based on our needs.

• Learn how to work with Image Uploads and fix state-related issues

• Learn how to define a configurable navigation component to show the state of the Multi-Step Component.

• Finally, we'll build a fully working practical example with more advanced step navigation, file uploads, and custom state.

[Uploaded] Building real-time applications with Laravel, Livewire and Reverb

• Learn how to Integrate Laravel with Reverb to build Real-Time Applications

• Learn how to display user typing events using Whisper and Client-to-Client communication

• Learn how to use presence channels to show online users for each room

• Learn how to use Flexbox tricks to keep messages scrolled into view as they roll in

• Seeding databases in Order

• Listening for Broadcasted events from the backend and reacting to them accordingly in Livewire

• We'll also learn how to listen for users leaving or joining events and add/remove them from the online user list