Vue.js 3 + Laravel 9 SPA: CRUD with Auth

Category: API Resource with Relationship and Debugging Session

Lesson 08/31 · 6:06 min

Autoplay

Commit for this lesson: https://github.com/LaravelDaily/Laravel-Vue3-CRUD-Course-2022/commit/e5215acfbe3fccab6e39973bdbe4a60900ce82be

Previous: Pagination with External Package

Michal

1 year ago

Eager Loading Specific Columns

https://laravel.com/docs/10.x/eloquent-relationships#eager-loading-specific-columns

When using this feature, you should always include the id column and any relevant foreign key columns in the list of columns you wish to retrieve.

👍 2

Vue.js 3 + Laravel 9 SPA: CRUD with Auth

Category: API Resource with Relationship and Debugging Session

What's Inside The Course

Install Laravel + Vue: Load First Vue.js Component

npm run watch: Re-Compiling JS and Tailwind

Load Table Data from API: v-for and axios.get()

Load Table Data with Vue.js 3 Composition API

Eloquent API Resources to Transform Some Fields

Pagination with External Package

Category: API Resource with Relationship and Debugging Session

Dropdown of Categories: Second Composable

Category Dropdown: Filtering Data

Ordering Data by Clicking Column Titles

Routing: Navigation Links and Posts Create Page

Laravel Routing Fix: "Catch" All Vue.js Routes

Vue.js Routing: Route Names and Separate File

Vue.js Routes: Meta Title in Global Layout

Post Create Form with Categories Dropdown

Form Submit: Storing the Data

Validation Errors: Catching and Showing Them

Processing the Form: Loading Indicator

File Upload Example

Post Edit Form: Route with Parameter

Post Update: Form Submit with Debugging

SweetAlert for Screen Alert Notifications

Delete Post with Confirmation Modal

Extra Table Filters: Column and Global Filters

Two Layouts: Authenticated and Guest

Login Form and First Authentication

Login Cleanup and Laravel Sanctum Protection

Show User Data and Logout

Permissions, Roles and Gates: Securing the Back-End

Permissions Front-end: Vue CASL and v-if for Links