Master Laravel With Vue JS

Learn the basics of Laravel from scratch, understand why it is a PHP framework, and explore the MVC structure with models, views (blades), and controllers, plus the Blade templating engine.

Remove public from the url by moving two files from the public folder to the root and updating index.php, then deny access to the .env file to close security gaps.

Customize the sidebar with department and user links, declare routes that name and return views, and connect them to management/departments/index blade and management/users/index blade.

Learn how to create and use controllers in Laravel, assign routes to controller methods like dashboard, and organize code with department and user controllers returning views.

Create a database named task_ms in phpmyadmin on localhost, update the .env with DB_HOST, DB_DATABASE, DB_USERNAME, and DB_PASSWORD, then run php artisan config:cache to refresh and verify the connection.

Learn migration basics, create migrations with PHP artisan make:migration, define table schemas like users and departments, and run migrations with PHP artisan migrate to build database tables.

Create and manage database models in a Laravel project using artisan make:model, explore users and departments models, and apply migrations and CRUD operations to linked tables.

Implement create functionality for departments by building a blade form with CSRF, posting to a store route, saving name and director_id via Department model, then redirecting to index.

Learn how to implement update functionality in a Laravel app by selecting a department by ID, loading its data in an edit view, and saving changes via a dedicated route.

Learn the basics of validation in the Laravel framework by validating form data in the store function. Get hands-on with enforcing required fields and displaying error messages in blade templates.

Learn to use Laravel sessions to store and flash cross-page messages, showing department created, updated, or deleted notifications in the master blade after actions.

Install Laravel Mix in a fresh Laravel project, delete the old webpack config, create webpack.mix.js, and set scripts for development, watch, hot, and production.

Master the basics of package managers, use your package manager for bootstrap, jquery, and proper js, configure sass with webpack.mix.js, and compile with npm run watch.

Fix Bootstrap 5 compatibility in a Laravel with Vue.js project by updating dropdowns, icons, and assets, adjusting template for Bootstrap 5, and correcting logo, images, and webpack mix source maps.

Explore the basics of Vue.js, a progressive JavaScript framework for building web interfaces and one page applications, and learn how it fits into web, desktop, and mobile applications.

Install Vue.js 3 in a Laravel project by adding it as a dev dependency, install the Vue compiler, configure webpack mix, and run npm run dev or watch.

Learn to add Vue.js globally in a Laravel project and mount it to the #app element. Verify Vue.js is loaded using a browser extension and hot reload.

Learn to create and register Vue.js components, import them into the app, and render them in Laravel Blade views to display department data.

Explore how Vue.js enables data binding with a DOM-based template and v-model, binding input fields and selects to data properties in real time.

Demonstrate Vue.js method properties by wiring click events with v-on, defining a create department method, and triggering alerts and a model in a department component.

Understand the Vue.js mounted hook, the primary lifecycle hook run when a component is added to the dom, typically used to fetch data, with a practical console log demo.

Create the department create function with Vue.js and Laravel, sending data via Axios post to the controller, saving to the database, and then clearing inputs and closing the modal.

Learn to fetch department data from a Laravel API using Axios in Vue.js, and render it in a responsive table to implement the read functionality of a CRUD app.

Implement a Vue.js edit workflow for departments: add an edit button, populate a modal with department data, toggle create/update modes, and call Laravel's update route with the department ID.

Implement delete functionality for departments in Vue.js with a delete button, confirm dialog, Axios call, and update the list via a Laravel API route and controller.

Learn to validate Vue.js forms using the Laravel v form package, applying Laravel validation in Vue.js with no page reload via axios.

Understand authentication and its role in security and privacy. Explore Laravel browser-based authentication via Breeze, Fortify, and Jetstream, and API authentication via Passport and Sanctum.

Master Laravel with Vue.js guides building login and register features using Fortify, validating inputs, handling routes, and redirecting to a dashboard with logout and forgot password workflows.

Master Laravel with Vue.js teaches implementing forgot password functionality using Mailtrap SMTP, Fortify setup, and forgot and reset password blades, including token handling and email flow.

Install and configure Laravel Passport to secure API routes and authenticate API requests with tokens, migrate fresh tables, generate keys, configure guards and routes, and apply API middleware.

Explore Vue.js state management and the need for a central store with state, view, and actions. Dispatch actions to commit mutations, mutate state, and render updates in the view component.

Organize your Vuex store by creating a departments module under store/modules, with state, getters, mutations, and actions. Register the module in the store and test its state to verify integration.

Learn to implement a Vuex read operation that fetches departments via axios, dispatches get departments in mounted, and exposes data through a getter for the component.

Master the Vuex update workflow for departments in a Laravel with vue.js course: dispatch update department with data, refresh the department list with get departments, and handle common debugging fixes.

Dispatch the delete department action with the department data and refresh the list via get departments after confirmation. The lecture introduces level authorization using rules and permissions.

Discover the concept of authorization and how it controls access after authentication, using owner and guest permissions; then implement with the Letter Trust package in Laravel.

Install Laratrust for Laravel 9.6, publish config, run setup and migrations, configure role and permission models, add the user trait, and seed initial users.

Learn to implement authorization in Laravel with gates and policies; define gates in the service provider boot, and apply them in blade templates and Vue components using roles and permissions.

Learn to build a role management crud in Laravel, including gates and policies, with routes, a role controller, index/create/edit forms, validation, and delete operations.

Master Laravel with Vue.js by implementing a complete permissions CRUD, including index, create, store, edit, update, and delete routes and controllers, plus a Vue component for permission forms.

Fetches all users via the api and displays them in a nice table with name, email, and department, implementing the read operation and user department relationships.

Implement the update user workflow by wiring the edit button, loading user data with roles and permissions, binding fields, and sending updates through the api with optional password handling.

Implement the delete user feature in a Laravel with Vue.js app by wiring the delete button to a delete action, detaching roles and permissions, and updating the database.

Fixes minor login page bugs in part 2 by centering content with flexbox and bootstrap, hiding the image on mobile, and enabling auto focus across login, register, and forgot password.

Fix a bug by removing permission attachments to roles, run fresh migrations and seeds, install passport keys, and secure all web and API routes with authentication and permission middleware.

Implement user profile management to let users change email, username, and password, building on the prior authorization work. Begin setting up user settings in the next video.

Declare profile index and profile update routes, build a profile controller and blade view, and implement a read/update form with validation and session feedback for the logged-in user.

Build a profile password update form with old password, new password, and password confirmation fields, validate with a match old password rule, hash, save, and display success.

Explore two pagination approaches in this introduction: a level-based method and a Laravel with Vue.js implementation, and preview the next steps to build pagination in Laravel.

Explore hard-coded pagination in Laravel and Vue.js for the users component, with Bootstrap styling, Vuex integration, active page highlighting, and a five-link limit.

This video demonstrates adding dismissible bootstrap five alerts for session flash messages and validation errors in a Laravel Vue.js project, updating main Blade layouts to display and dismiss messages.

Learn to implement SweetAlert2 notifications in a Laravel with Vue JS app, configuring toasts and a top-right confirmation dialog, and applying create, update, and delete feedback for departments and users.

Implement a user-friendly delete workflow with a confirmation dialog for departments and users in a Laravel with Vue JS app, including API-based deletion and toast feedback.

Build a user-friendly delete workflow for roles and permissions in Laravel with a reusable Bootstrap modal blade, passing per-row data and showing a success notification.

Learn to implement live search in Laravel with Vue.js for users and departments by wiring input fields to a data model, debouncing requests, and calling API routes to fetch results.

Develop task tracking in a Laravel and Vue.js app by building an admin panel with task assignment, subtasks, completion, real-time notifications, and a commenting system across roles.

Build a Laravel task model, migration, and controller with one artisan command, creating a tasks table with fields like user_id, parent_id, department_id, performed_by, title, description, start_date, end_date, progress, and status.

Learn to implement many-to-many relationships between tasks and users with a pivot table in Laravel, including task_id and user_id columns and belongs to many model relations.

Carry out the update task flow by wiring the store action update task to the api route with the task id, and get the tasks to refresh the list.

Implement delete task functionality with a sweet alert confirmation, call the delete task API route, detach users, and return a success message.

Learn to save and update task performance in a Laravel with Vue JS app by handling file uploads, progress, and results through a store perform task action and backend updates.

Develop and view task results for both assigner and performer by implementing a shared task information component, updating the model and interface to show performed by, progress, and file attachments.

Explore how to reuse a single component for inbox and completed tasks, display status based on progress, and optimize data updates and pagination in a Laravel and Vue JS app.

Discover how to implement subtasks in Laravel with a hasMany relationship to a parent task, fetch subtasks with inbox tasks, and display them in a Vue-driven Bootstrap accordion.

Implement subtask update functionality by introducing a sub edit mode, showing edit and cancel controls, binding input fields to subtask data, saving changes, and reassigning subtasks to users.

Demonstrates delete subtask functionality with a sweet alert confirm dialog, preventing default anchor navigation, and updating the list while closing the modal after deletion.

Develop a practical Laravel with Vue.js tasks search across tasks, inbox, and completed views by title, priority, dates, and assigned users, with API routes and controllers.

Implement a Laravel comments feature by creating a Comment model, migration, and controller, defining fillable fields (user_id, task_id, comment), and establishing belongsTo and hasMany relationships with users and tasks.

Learn to implement create comments in a Laravel with Vue.js app by setting permissions, building a reusable comments component, and wiring a store comment API with validation.

Implement update functionality for the comments component in a Laravel with Vue JS app by enabling edit mode, enforcing permissions and authenticated user checks, and invoking the update comment API.

Add a trash button and deleteComment function with a sweet alert to delete comments. Hook up the api route, axios call, and controller method to remove them.

Learn to implement a reusable comments feature for inbox and completed tasks by importing components, wiring the comments getter, and ensuring add, update, and delete work across views.

Explore implementing a notifications feature in a Laravel with Vue JS project, sending alerts when tasks are created or completed and when comments are submitted.

Learn to mark a single notification as read and mark all as read using a Laravel API, with id-based and all-notification handling and toast feedback.

Fetch all notifications (read and unread), show them in a modal, and implement a get all notifications workflow with Vuex state, getters, and an API route in Laravel.

Learn to implement a clear all notifications feature in a Laravel and Vue.js app, including a confirm dialog, an API route, and refreshing the notification list.

Implement a comments notification feature in a Laravel with Vue JS project. Notify task creator and assigned users when a new comment is submitted, with logic to exclude the commenter.

Learn to queue email notifications in Laravel by using a jobs table and database queue, run the queue worker, and configure real smtp settings via the env file.