Laravel | WordPress | VueJs

Have you thought about using WordPress in combination with VueJs and Laravel?

A small example of VueJs and Laravel build with a simple API used to
read and write to the users table. Same principle can be used to build API endpoints
that will serve content to the VueJs front-end.


On top of that there’s an example of using WordPress in combination with Advanced Custom fields
as an API serving content to the same VueJs front-end.

A nifty way you can utilise WordPress as CMS and content delivery system.

What’s the first step?

A good stepping stone to start with would be following one the tutorials found on this page:
Laravel Vue Router

– Usage of Vue-Router
– Utilise Laravel’s API to deliver content to VueJs front-end.
– Utilise Laravel’s api to Create, Read, Update and Delete records.
– Create a simple VueJs front-end
– List records and handle errors
– Handle events and use the Laravel’s endpoints in the Vue front-end.


You can explore the other sections and steps of that tutorial to get a more comprehensive understanding of the implementation.

What’s next?

The second bit of know-how I’ve used to get things running can be located here
wordpress-vue-headless

– Add custom fields group to a post/page
– Create key for the custom fields group
– Create a custom API endpoints
– Simple VueJS front-end driven by content from WP’s custom endpoints created.


Here you can find an implementation that gives you a way of creating custom endpoints using WordPress’ in-built API functionality.
The content in the newly created endpoints is driven with the help of the Advanced Custom fields plugin, which gives you a custom key in the endpoint you can use to call all the different bits of content.