An in-depth look at building a web application using Vue and Vuex created by Ivan Dorić.
Watch and Learn is back again with another October CMS tutorial for building applications with Vue. If you missed his previous series on October check out the OB-18 article, Watch and Learn video series.
Building a Vue, Vuex and October CMS App
This series follows step by step in creating a functional website using October CMS. You'll learn about themes, plugins, components and more.
Part 01 - Setup October CMS Setup
In this first episode of Creating Rent-a-Car we are going to setup #OctoberCMS side of things.
Part 02 - Vue Setup
In this episode we are going to setup Vue side of things for our rent-a-car applictaion.
Part 03 - Tailwind CSS
In this episode we are going to add Tailwind CSS to our project and show how this is a great framework for creating single page applications with frameworks like Vue or React.js.
Part 04 - Vuex
In this episode we are going to take a look at Vuex, a state management library for Vue.js
Part 05 - Homepage UI
In this episode we are finally going to start building our October CMS and Vue.js application, and of course we are starting with the homepage.
Part 06 - Locations API
In this episode we are going to use OctoberCMS to create our locations API so that we can consume it with our Vue.js app.
Part 07 - Connecting Locations and Vehicles
In this episode we are going to connect our locations and our vehicles using October CMS and some Laravel PHP code and relations API.
Part 08 - Filtering by Location
In this episode we are going to leverage the data we created in the last episode, to filter our vehicles by location using Vue.
Part 09 - Filtering On API
In this episode we are again going to filter our vehicles by location, but this time using OctoberCMS and some Laravel php methods.
Part 10 - Vehicle UI
In this episode we are going to add an image and price fields to our vehicles on our October CMS backend and then display them in our Vue app.
Part 11 - Availability
In this episode we are going to create a new field in October CMS and then display it in our Vue application.
Part 12 - Router
In this episode we are going to take a look at Vue Router and make detail page for our vehicles using Vue.js
Part 13 - Dates Backend
In this episode we are going to start creating our dates functionality using October CMS.
Part 14 - Dates Frontend
In this video we are continuing with our dates API, and now we are going to use Vue to create our frontend and functionality.
Part 15 - Luxon
In this episode we are going to be using Luxon plugin to format and calculate our dates in our Vue app.
Part 16 - Persisting dates
In this episode we are going to persist our dates using localStorage and Vue.
Part 17 - Login and Register (with JWT)
In this episode we are going to learn how to register and login users using Vue, October CMS and JWT.
Part 18 - Persisting State
In this episode we are going to continue the checkout process and learn how to automatically persist state in Vue and Vuex.
Part 19 - Making Reservation
In this episode we are going to finish the checkout process and and make reservation in our October CMS, Vue and Vuex application.
Part 20 - Fixing JWT
In this episode we are going to fix the problems that we had with JWT in the previous episode in our Vue and October CMS app.
Part 21 - Login Errors
In this episode I'm going to show you how to handle login errors in our October CMS, Vue and Vuex application.
Part 22 - Logout
In this episode I'm quickly going to show you how to logout out of your October CMS, Vue and Vuex application.