Watch and Learn - Vue, Vuex and October CMS App

Tutorial 23

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.

comments powered by Disqus