Laravel 11 with Inertia.js and Vue 3 | A Practical Guide
Laravel 11 with Inertia.js and Vue 3 | A Practical Guide, available at $54.99, has an average rating of 4.75, with 95 lectures, based on 20 reviews, and has 222 subscribers.
You will learn about Learn how to Build Single Page Applications using Laravel 11, Inertia and Vue 3 Learn how to Implement Roles and Permissions on an Inertia based App (Without using any external package) Learn how to Build dependent dropdowns in Laravel and Vue Learn how to Build Data-tables using Laravel, Inertia and Vue. Learn how to build a Multiple Drag and Drop File Uploading and Processing with Laravel/Inertia/Vue Learn how to Implement Translations in an Inertia based app. Learn how to implement Infinite Scrolling in Inertia Based Applications Learn how to Customize Error Pages in Inertia This course is ideal for individuals who are Students who want to Build Monolith(SPA) Applications using Laravel, Inertia and Vue It is particularly useful for Students who want to Build Monolith(SPA) Applications using Laravel, Inertia and Vue.
Enroll now: Laravel 11 with Inertia.js and Vue 3 | A Practical Guide
Summary
Title: Laravel 11 with Inertia.js and Vue 3 | A Practical Guide
Price: $54.99
Average Rating: 4.75
Number of Lectures: 95
Number of Published Lectures: 95
Number of Curriculum Items: 95
Number of Published Curriculum Objects: 95
Original Price: $34.99
Quality Status: approved
Status: Live
What You Will Learn
- Learn how to Build Single Page Applications using Laravel 11, Inertia and Vue 3
- Learn how to Implement Roles and Permissions on an Inertia based App (Without using any external package)
- Learn how to Build dependent dropdowns in Laravel and Vue
- Learn how to Build Data-tables using Laravel, Inertia and Vue.
- Learn how to build a Multiple Drag and Drop File Uploading and Processing with Laravel/Inertia/Vue
- Learn how to Implement Translations in an Inertia based app.
- Learn how to implement Infinite Scrolling in Inertia Based Applications
- Learn how to Customize Error Pages in Inertia
Who Should Attend
- Students who want to Build Monolith(SPA) Applications using Laravel, Inertia and Vue
Target Audiences
- Students who want to Build Monolith(SPA) Applications using Laravel, Inertia and Vue
In this course, we will be Learning Inertia.js(A tool to build single-page apps, without creating any APIs) along with Vue.js in a practical way by building multiple practical projects along the way.
Inertia serves as the solution, seamlessly connecting Laravel as a backend with a frontend Framework (React/Vue/Svelte), enabling us to build everything in one application (a monolith) while achieving the same outcome. The best part? We don’t have to create an API.
Projects Roadmap and Status:
[Uploaded] Learn Inertia
[Uploaded] Flexible Flash Notifications with Inertia
[Uploaded] Customizing Error Pages in Inertia
[Uploaded] Building a Simple Student’s Management System
[Uploaded] Implementing Roles/Permissions in Inertia-Based Applications.
[Uploaded] Multiple Drag And Drop File Uploading and Processing with Inertia
[Uploaded] Translations with Laravel and Inertia
[Uploaded] Infinite Scrolling with Inertia
Project Description:
[Uploaded] Learn Inertia
In this section, we’ll look into the basics of Inertia and some of the fundamental features of Inertia.js.
Some of the topics we’ll cover in this section include:
-
Learn how to set up Laravel with Inertia and Vue Stack.
-
Learn how to Format the data with API Resources.
-
Learn about how to work with forms, and display validation errors
-
Learn how to preserve the scroll behavior, and preserve the state of the page
-
Learn how to implement Manual Visits and Partial Reloads in Inertia.
-
Learn how to Implement Authorization checks (on both frontend and backend)
-
Learn how to Customize the default Error pages and render Custom Inertia Pages (403, 404, 419 pages)
-
Learn how to display Flash Notifications in Inertia/Vue
-
Learn how to Set up page titles and meta tags.
[Uploaded] Flexible Flash Notifications with Inertia
In this Section, we’ll learn how to build a flexible flash notifications feature in Inertia.
By the end of the section, we’ll have the ability to flash any notification, anywhere in our application, without repeating any code.
[Uploaded] Customizing Error Pages in Inertia
Learn how to Customize the default error pages in Inertia.
We’ll learn the following in this Section:
-
Learn how to customize the default error pages in Laravel
-
Learn how to return an Inertia Response whenever any error is encountered in our app.
-
Learn how to render different types of errors by re-using the same vue component.
-
Learn how to define a config to enable/disable the rendering of custom error pages
[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 Laravel, Inertia, and the Vue Stack, and we will learn the following topics along the way:
-
Learn about Watchers in Vue.js and Build dependent dropdowns in Inertia/Vue
-
Learn how to work with Factories and Seeders in Laravel, and seed the necessary data for all of our Models
-
Learn how to use a Re-usable Vue Component to display validation messages.
-
Learn how to Implement Server Side Pagination from scratch.
-
Learn how to Implement Search Functionality in an Inertia/Vue Data-table.
-
Learn how to Implement filters in an Inertia/Vue data table.
[Uploaded] Implementing Roles/Permissions in Inertia-Based Applications.
We’ll continue from where we left off in the previous section and implement the Roles and Permissions functionality without using any external plugins.
Some of the features that we’ll cover in this section are listed below:
-
Implement Roles CRUD.
-
Manage Permissions related data for a specific role on Role Create/Edit Pages
-
Implement Authorization/Gate Checks throughout the project (on both frontend and backend)
[Uploaded] Multiple Drag And Drop File Uploading and Processing with Inertia
In this section, we’ll build a multiple-file chunked uploader in Inertia/Vue with the ability to pause, resume, and cancel uploads.
And learn the following along the way:
-
Learn how to Integrate and Use Laravel Reverb in an Inertia/Vue Application.
-
Learn how to edit metadata (like the title and description) for each upload — even while they’re uploading and processing.
-
Learn how to queue and process uploaded files on the Backend
-
Learn how to report progress updates to the client using Laravel Reverb.
-
And many more…
[Uploaded] Translations with Laravel and Inertia
Localization is a breeze in Laravel applications, but what happens when you need to bring this to the client side? Turns out in Inertia, it’s pretty simple.
In this section, we’ll build a language switcher, share translations with the client, and build a simple translation helper for Vue to use directly in templates. We’ll also cover caching translations to keep things running smoothly.
[Uploaded] Infinite Scrolling with Inertia
In this section, we’ll seed our database with a bunch of data and start building the solution, we’ll start by using Inertia’s router to load additional data, and later we’ll optimize the infinite scrolling flow by replacing the router with Axios.
Course Curriculum
Chapter 1: Learn Inertia.js
Lecture 1: Introduction to Learn Inertia
Lecture 2: Install and Setup Laravel/Inertia.js with Vue.js
Lecture 3: Overview of the Project
Lecture 4: Creating Pages
Lecture 5: Title and Meta Tags
Lecture 6: Passing Data to Pages
Lecture 7: Swapping to API Resources
Lecture 8: Fixing few Issues before moving forward
Lecture 9: Form Basics
Lecture 10: Submitting Forms
Lecture 11: Showing Validation Errors
Lecture 12: Resetting Forms
Lecture 13: Clearing Validation Errors
Lecture 14: Accessing Form Processing State
Lecture 15: Manual Visits and Partial Reloads
Lecture 16: Partial Visits (and more) with Links
Lecture 17: Shared Data
Lecture 18: Making Use of Ziggy
Lecture 19: Hooking into Forms for Flash Messages
Lecture 20: Revisiting Shared Data for Better Flash Messages
Lecture 21: Shorthand Routes
Lecture 22: Remembering Form States
Lecture 23: Preserving States
Lecture 24: Basic Authorization
Chapter 2: Flexible Flash Notifications in Inertia
Lecture 1: Hooking into Inertia's Router
Lecture 2: Let's Improve the Flash Notifications flow
Lecture 3: Fix Remaining Issues
Chapter 3: Customizing Error Pages in Inertia
Lecture 1: Customizing the default Error page
Lecture 2: Returning an Inertia Response
Lecture 3: Handling Multiple Error Types with a Single Page
Lecture 4: Define a Config to Show/Hide Custom Error Pages
Chapter 4: Let's Build a Students Management System
Lecture 1: Introduction to Students Management System
Lecture 2: Install and Setup Laravel with Inertia and Vue
Lecture 3: Define the Models/Migrations/Factories/Seeders/Relationships
Lecture 4: Displaying the Students Data
Lecture 5: Let's Implement Pagination
Lecture 6: Let's work on the Record Creation Flow
Lecture 7: Implementing Dependent Dropdowns
Lecture 8: Display Validation Errors and Finalize Record Creation Flow
Lecture 9: Let's Work on Record Update Flow
Lecture 10: Deleting Individual Records
Lecture 11: Let's Implement Search Functionality
Lecture 12: Fixing Pagination Related Issues
Lecture 13: Fix Remaining Issues
Lecture 14: Let's Implement Filter By Class Feature
Chapter 5: Implementing Roles and Permissions in Inertia Based Applications
Lecture 1: Introduction to Implementing Roles/Permissions in Inertia based Applications
Lecture 2: Database Structure Overview
Lecture 3: Lets Define the Models/Migrations/Pivot Tables/Seeders for Roles/Permissions
Lecture 4: Displaying and Deleting Roles (Overview)
Lecture 5: Creating and Updating Roles (Overview)
Lecture 6: Implement Permissions Selection on Role Create Page
Lecture 7: Implement Permissions Selection on Role Edit Page (Overview)
Lecture 8: Defining the Auth Gates with a Middleware
Lecture 9: Implementing Checks on the Backend
Lecture 10: Implementing Checks on the Frontend
Chapter 6: Multiple Drag And Drop File Uploading/Processing with Inertia, Vue 3 and Reverb
Lecture 1: Introduction to Multiple Drag/Drop Uploader Section
Lecture 2: Install and Setup Laravel with Inertia and Vue
Lecture 3: Define the Video Model and Uploader Component
Lecture 4: Start Working On Uploader Component
Lecture 5: Let's Define the UploadItem Component
Lecture 6: Initially Creating a Video Record
Lecture 7: Updating the Upload Details
Lecture 8: Finalizing Video Details Update Flow
Lecture 9: Starting Chunked Uploads
Lecture 10: Showing Upload Progress
Lecture 11: Handling Chunks on the Server
Lecture 12: Cancelling Uploads
Lecture 13: Pausing and Resuming Uploads
Lecture 14: Authorizing Requests
Lecture 15: Dragging and Dropping Files
Lecture 16: Let's Install and Configure Laravel Reverb
Lecture 17: Privately Broadcasting
Lecture 18: Encoding the Video with FFMPeg
Lecture 19: Broadcasting the Encoding Progress
Lecture 20: Clean Up after Encoding and Fix Remaining Issues
Lecture 21: Fix Additional Issues
Chapter 7: Learn how to Implement Infinite Scrolling in Inertia Based Applications
Lecture 1: Introduction to Implementing Infinite Scrolling in Inertia Based Applications
Lecture 2: Install and Configure a new Laravel Project
Lecture 3: Setup Model/Migration/Factory/Seeder
Lecture 4: Displaying the Posts Data
Lecture 5: Let's Implement useIntersectionOnserver
Lecture 6: Let's Start Implementing Infinite Scrolling Behaviour
Lecture 7: Use Axios instead of Inertia's router
Lecture 8: Finalizing the Infinite Scrolling Feature
Lecture 9: Fix Remaining Issues
Chapter 8: Learn how to Implement Translations in Laravel and Inertia
Lecture 1: Introduction to Implementing Translations in Laravel and Inertia
Lecture 2: Install and Setup a Fresh Laravel Project
Lecture 3: Storing available languages with an Enum
Lecture 4: Sharing available languages globally
Lecture 5: Building the Language Selector
Lecture 6: Storing the chosen Language in a Session
Lecture 7: Setting the locale through a Middleware
Instructors
-
Tapan Sharma
Software Engineer
Rating Distribution
- 1 stars: 0 votes
- 2 stars: 0 votes
- 3 stars: 1 votes
- 4 stars: 4 votes
- 5 stars: 15 votes
Frequently Asked Questions
How long do I have access to the course materials?
You can view and review the lecture materials indefinitely, like an on-demand channel.
Can I take my courses with me wherever I go?
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!
You may also like
- Top 10 Language Learning Courses to Learn in November 2024
- Top 10 Video Editing Courses to Learn in November 2024
- Top 10 Music Production Courses to Learn in November 2024
- Top 10 Animation Courses to Learn in November 2024
- Top 10 Digital Illustration Courses to Learn in November 2024
- Top 10 Renewable Energy Courses to Learn in November 2024
- Top 10 Sustainable Living Courses to Learn in November 2024
- Top 10 Ethical AI Courses to Learn in November 2024
- Top 10 Cybersecurity Fundamentals Courses to Learn in November 2024
- Top 10 Smart Home Technology Courses to Learn in November 2024
- Top 10 Holistic Health Courses to Learn in November 2024
- Top 10 Nutrition And Diet Planning Courses to Learn in November 2024
- Top 10 Yoga Instruction Courses to Learn in November 2024
- Top 10 Stress Management Courses to Learn in November 2024
- Top 10 Mindfulness Meditation Courses to Learn in November 2024
- Top 10 Life Coaching Courses to Learn in November 2024
- Top 10 Career Development Courses to Learn in November 2024
- Top 10 Relationship Building Courses to Learn in November 2024
- Top 10 Parenting Skills Courses to Learn in November 2024
- Top 10 Home Improvement Courses to Learn in November 2024