Building Laravel and Vue.js 2 Web Apps
2h 48mIntermediate2019-02-21
Authors
Michael Sullivan
Microsoft Certified Professional and Senior Web Developer
Course details
Vue.js ships with Laravel, the hugely popular PHP web framework. But using this front-end framework along with Laravel to build full-stack web applications comes with its own set of challenges. In this project-based course, instructor Michael Sullivan steps through how to work with Vue.js and Laravel to create elegant, real-world apps. As he shows how to build a content management tool for a restaurant menu, Michael demonstrates how to scaffold an authentication system, build an embedded SPA with Vue Router, manage state complexity using Vuex, and more.
Learning objectives
Configuring a virtual machine
Using webpack and Laravel Mix
Managing file uploads
Protecting routes and models with policies
Building an API with Laravel Passport
Building an embedded SPA with Vue Router
Protecting admin pages with gates
Displaying model validation errors
Managing state complexity using Vuex
Learning objectives
Configuring a virtual machine
Using webpack and Laravel Mix
Managing file uploads
Protecting routes and models with policies
Building an API with Laravel Passport
Building an embedded SPA with Vue Router
Protecting admin pages with gates
Displaying model validation errors
Managing state complexity using Vuex
Skills covered
Vue.jsLaravelPHPJavaScript FrameworksBack-End Web DevelopmentFull-Stack Web DevelopmentProjectWeb DevelopmentOpen Source
Concepts
0. Introduction
- 01 - Laravel and Vue.js - Achieving full-stack elegance
- 02 - What you should know
- 03 - Demo project overview
1. Installation and Configuration
- 04 - Installing Homestead
- 05 - Configuring and booting the virtual machine
- 06 - Scaffolding an authentication system
- 07 - Enabling forgotten password and email verification
- 08 - Using webpack with Laravel Mix
- 09 - Cache busting and Browsersync
2. MV Architectures
- 10 - Integrating a layout
- 11 - Creating a model and seeding the database
- 12 - Building views with Blade templates
- 13 - Injecting props in Vue components
- 14 - Building a CRUD component
- 15 - Managing scrolling and focus
- 16 - Protecting routes and models with policies
- 17 - Building an API with Laravel Passport
- 18 - Calling an API from Vue
3. Building an Embedded SPA
- 19 - Protecting admin pages with gates
- 20 - Installing and configuring Vue Router
- 21 - Using props and router-link
- 22 - Enabling Vue Router history mode
- 23 - Validating form submissions
- 24 - Displaying model validation errors
- 25 - Managing file uploads
- 26 - Working with related models
- 27 - Building a list view with detail links
- 28 - Reusing form components
- 29 - Using Laravel form requests
- 30 - Using Vue Router navigation guards
4. Managing State Complexity
- 31 - Understanding Vuex and Flux architecture
- 32 - Installing Vuex and managing the store
- 33 - Handling form input with Vuex
- 34 - Dispatching Vuex actions
- 35 - Using the mapState helper
- 36 - Rendering the menu
Conclusion
- 37 - Next steps