Skip to content
An offline-first SPA using Vue.js, the WordPress REST API and Progressive Web Apps
JavaScript Vue HTML Batchfile CSS
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build update webpack command Apr 26, 2019
src update to node 11 Apr 26, 2019
.babelrc update to node 11 Apr 26, 2019
.deployment speed up deployment with 7za Mar 28, 2017
.editorconfig Server Side Rendering Mar 27, 2017
.eslintignore Server Side Rendering Mar 27, 2017
.eslintrc.js update to node 11 Apr 26, 2019
.gitignore Server Side Rendering Mar 27, 2017
.travis.yml update to node 11 Apr 26, 2019
LICENSE first commit Mar 5, 2017
README.md Update README.md Apr 26, 2019
index-appCache.html Server Side Rendering Mar 27, 2017
index.html Remove CDN, patch offline process Oct 23, 2017
package-lock.json update to node 11 Apr 26, 2019
package.json update to node 11 Apr 26, 2019
renovate.json Add renovate.json Oct 14, 2017
server.js Remove CDN, patch offline process Oct 23, 2017
web.config update to node 11 Apr 26, 2019
wipe-dependencies.js add dependency script Dec 16, 2017

README.md

vue-wordpress-pwa

An offline-first SPA using Vue.js, the WordPress REST API and Progressive Web Apps

Live version: https://www.fullstackweekly.com/

GitHub license Build Status David Lighthouse Accessibility Badge Lighthouse Best Practices Badge Lighthouse Progressive Web App Badge Lighthouse Performance Badge

alt tag

Description

This is the code for the FullStackWeekly website. You can use it as a starter pack for your WordPress site as well.

Since WordPress can expose a REST API, this project uses Vue.js, Vue-router, Vuex, Vue-resource & Progressive Web App techniques to create an offline-first web client.

You can also fork the project and host it on Azure App Services with continuous integration using the deploy.cmd file (included)

Live version: https://www.fullstackweekly.com/

Getting Started

Prerequisites

Make sure that Node v11 is installed.

Features

Instructions

First, install the WordPress plugins to enhance its REST API

  • Better REST API Featured Images
  • REST API Enabler
  • WP REST API - filter fields
  • WP REST API - Pure Taxonomies

Then, clone the repo or create a fork

$ git clone https://github.com/bstavroulakis/vue-wordpress-pwa.git

Then, edit the config:

src/app.config.js

Then, edit the theme, routes and assets:

src/theme/
src/components/routerTypes.js
src/components/router.js
src/assets

Finally, to run the project for development with hot reload:

$ npm install
$ npm run dev

Or, build the project for production:

$ npm run build

Deployment

Setup a new site on Azure App Services https://[fullstackweekly].azurewebsites.net and as the path select your forked Github project.

Your site should be running on the path you created (https://[fullstackweekly].azurewebsites.net)!

It should work offline as well and with every commit it will deploy the changes to Azure. Once the user refreshes the site he will receive the new cached version immediately.

License

MIT

You can’t perform that action at this time.