Maison Futari Courses/Using Vue JS in WordPress : The 7 clean ways to do it

  • 99 $

Using Vue JS in WordPress : The 7 clean ways to do it

Learn how to use Vue JS in WordPress like an expert, with these 3 clean methods.

WordPress + Vue? Is this Really possible?

Yes it is.
Most people do not know how to do it in a clean, and maintenable way.

It's not their fault.
There are so many ways Vue can be used, it can be confusing.

On top of that, WordPress isn't the most modern or frontend-friendly tool.

This is what you're going to learn in this course:
Build clean and maintenable WordPress interfaces with Vue JS.

And this, with the 7 right ways to do it.

I will walk you through this journey with real life examples.
10 step-by-step projects to show you all the possibilites of Vue + WordPress.

Why would should learn that?
-
As a freelancer, you could land new clients who need an admin panel.
- As an employee, you could ship faster content-driven websites/apps

WordPress is also cheap to host compared to other headless CMSs.
Usually, a good shared host is enough even for a website with 1k visits a day.

It's time to get rid of jQuery which is not maintainable, and brings conflicts in WP.

Why should you even use WordPress? It's not sexy!

WordPress is a CMS, so it really speeds up development for content-driven websites or webapps.

It powers more than 25% of the known web. Chances are, you may have to work with it in the future.
You may as well know how to use it properly with a frontend framework you love: Vue JS.

A lot of developers hate WordPress. Actually, I was one of them.

But that was before 2 major discoveries: Elementor + WP REST API.
Let met tell you more about that.

But you need to understand something first.

I used WP a lot from 2011 to 2014 (before I started to hate it).
And I've been using Vue since 2014. (Yup, it was version v0.10.6 back then).

Basically, I hated WP like many people because:
  • It's slow
  • It's wasn't elegant (old PHP)
  • An mainly, doing frontend with it was painful...

With the rise of SPAs, WP was out-of-the race.

It didn't have REST APIs at the time, and most plugins relied on jQuery.

jQuery brought so much conflicts between plugins, it was hell!

But all that changed... Specifically in december 2016!

In WordPres 4.7, they aded a native REST API. This is a game changer.

Other incredible frontend stuff are also more used now: JAMStack, PWAs, SSR, Web Components...

Yes, it is now possible to use WordPRess with a modern and sexy stack.

But you need to do it the right way to get the most out of it.


So what am I going to learn exactly?

Whether you are a student, freelancer or an employee.
Whether you want to build websites, web apps or mobile apps.

Vue + WordPress can be a very good combo.

Your are going to learn 7 clean ways to use Vue with WordPress:
  • How to use Vue instances & components in WP PHP templates
  • How to create fully custom WP admin pages with Vue and Vue router
  • How to use WP's REST API with Vue in 3 ways unique ways!

You are going to learn clear and practical methods.

Theses methods can even be used with ReactAngular or Svelte!

BONUS: You will learn a unique concept about Vue.
A concept that may lead your developer carreer to paths may never have thought of.

Join this course now if you want to master Vue in WordPress.

ATTENTION! This course assume you have basic knowledge of Vue and WordPress.

Table of contents

Introduction
Aperçu
Setup
Aperçu

Vue IN WordPress as Instances & Components (CDN)

Here we are going to use Vue WITHIN WordPress with:
  • Instances
  • Components with inline-templates
  • Components with render functions / renderless
  • Components with string template
1. Reusable Vue instances
2. Vue Instances in WP / PHP loops
3. Vue reusable components with WP / PHP template (1/2)
4. Vue reusable components with WP / PHP template (2/2)
5. Scoped Slots aka Renderless Components with WP / PHP data
6. String-template components with WP / PHP data
7. Using external Vue libs in WP / PHP template

Vue in WordPress with bundlers

8. Using Vue with Vue CLI within WordPress
9. Using Vue with Parcel JS bundler within WordPress
10. Refactoring our instances & components with the bundler
11. Creating & communicating with WP AJAX endpoints
12. Creating & communicating with WP custom REST API endpoints

Creatings SPAs/Web Apps within WordPress and standalone

13. Creating a WP plugin as a Sub-SPA / Sub-site with Vue CLI (works same with any bundler)
[BREAK] Understanding how rendering works for SEO (CSR, SSR...)
14. Creating an SPA with WordPress SSR & REST API
[BREAK] How to make AJAX & API calls properly with Vue
15. Using WordPress API with standalone Vue Apps (SPA, SSR, PWA, JAMStack)

Conclusion

Ressources
Sources of the "Freelance" WP (themes + plugin created in the course)

Interested in Vue or indie hacking?

Drop your email!

Get the best tips & tricks to improve your skills
PS: It's really once in a while, no spamming.

You're signing up to receive emails from Maison Futari Courses

Hello World! 👋

description