VueFront

Vue powered CMS agnostic frontend framework for your old-fashioned Blog and Ecommerce site.

Version Version License Chat

Show your :heart: - give us a :star:
Help us grow this project to be the best it can be!

Demo

VueFront on Wordpress

VueFront on OpenCart

VueFront on Magento

VueFront on PrestaShop

What can I do with VueFront?

Easily turn your Wordpress, OpenCart, Magento, PrestaShop, Shopify or any other blog/store CMS into an SPA and PWA with Vue.js in less then 5 minutes.

VueFront Tech-stack:

  • SPA
  • PWA
  • AMP
  • GraphQL + Apollo
  • VueJS + Nuxt
  • Atomic Design
  • JAMstack

Who can use VueFront?

You or your clients with a site on an old-fashiond CMS. If you want to try new technology, outrun your competition and just provide a better user experience, but not ready to invest thousands of dollars, VueFront is for you.

  • It uses the latest tech stack.
  • It's free.
  • It's easy to setup, test and run.

It works out-of-the-box:

  • You get a shiny new Web APP.
  • You get to keep your current CMS admin panel.
  • You can always switch back to your old site.

Give it a try, what do you have to lose?

How do I get started? (development)

  1. Install VueFront CMS Connect App on your site and copy the CMS Connect URL.
  2. Install VueFront app. (requires node.js >= 8, git, and yarn)
# Create VueFront app. replace <project-name> with vuefront
yarn create vuefront-app <project-name>
# OR npx create-vuefront-app <project-name>

yarn dev

Switch to production

  1. build your App

    # build the app
    yarn build
  2. Copy the contents of your app from /dist to your root folder of your CMS where it is hosted.

  3. Configure your hosting to load index.html first. This can be a bit tricky.

For OpenCart CMS you can use this:

  • Apache
# for VueFront to work you need to load index.html before any other index file
DirectoryIndex index.html index.php
  • Nginx
    # for VueFront to work you need to load index.html before any other index file
    index index.html index.php;
    

when visiting any other url, it should forward to the root index.html file

location / { try_files $uri $uri/ /index.html; }

Vuefront

VueFront Core. Turn your old-fashioned CMS website in to a SPA & PWA in 5 minutes

Vuefront Info

⭐ Stars 286
🔗 Homepage vuefront.com
🔗 Source Code github.com
🕒 Last Update 6 months ago
🕒 Created 2 years ago
🐞 Open Issues 20
➗ Star-Issue Ratio 14
😎 Author vuefront