With the styling for the theme setup and ready to go we can set up the routing for the WordPress theme. In a normal WordPress build, this is the section where you will setup the permalinks for your Wo...
For the styling of this project, we'll simply be going to use a CSS framework like Bulma to speed things up. Bulma is a CSS framework that uses SASS and flexbox to make things very easy to customise....
In the previous tutorial, we created a new VueJS project using the vue-cli command, in this tutorial we're going to investigate what this has done and look into how we now use this project to create o...
In this series, we're going to use VueJS to create a WordPress theme using the WordPress REST API to display your WordPress content. I'll try to go through all the steps of creating a WordPress theme...
VueJS Slots is a way of injecting content into your rendered Vue components. This allows the component to become more flexible and reusable. In this tutorial, we're going to investigate how Vue slots...
In this tutorial we're going to build a component we can use to display the weather of a location in VueJS. This component will be created with a location search textbox, this will then search a free...
When you're defining new components in VueJS you can use the method Vue.component like we've used in a previous tutorial about Vue. <script> Vue.component('todo-item', { props: ['to...
Mixins are a way of reusing functionality from within your Vue Components. A mixing will use the same properties as a component such as created, methods and when a component uses this mixin the functi...
VueJS provides an inbuilt way of providing transitions when making changes to the DOM, these can be applied when inserting items, updating items or deleting items from the DOM. Transition Classes The...
You can add additional information to a specific route by giving it route meta data, this meta data can then be picked up by the router on the beforeEach() function so you can add additional code when...
In the previous examples of using the Vue Router we learnt how to build routes and how we can navigate around the application to view the previous examples please see them here. VueJS Router This info...
Looking at some of the examples we have of the Vue router you'll notice that the browser is automatically add a hash to the end of the URL. This is the default behaviour for Vue router and it does thi...
Like any other website if the router can not find the URL you're navigating to then you need to display a 404 page to your user for them to know this page doesn't exist anymore. You can redirect any u...
Sometimes while you're developing you find situations where you need to redirect to a different page or go back to the last page. For example you could have a form that allows you to delete a record a...
In a real world example you'll be creating an application that has a few nested URLs for example a user account will have URLs such as /account /account/security /account/notifications /account/bill...