To allow VueFront access to your CMS data, you need to install a CMS Connect App (WordPress, Magento, OpenCart, PrestaShop). The installation is the same as installing any other extension. Once installed, it will give you a CMS Connect URL.
CMS Connect URL
The CMS Connect App is developed for each CMS indivitually. It’s purpose is to implement a GraphQL API to grant the Web App access to your data.
Blog vs Ecommerce
VueFront supports both Blogs with Stores (WordPress) and Stores with Blogs (Magento, OpenCart, PrestaShop). So if you have WordPress with WooCommerce, VueFront will automatically support it.
2.
Install VueFront Web App
To create your new Frontend, you will need to install VueFront Web App. You should have NodeJS and Yarn (or just use npm) preinstalled. When installing the Web App, you will be asked to provide the CMS connect URL, provided by the Connect App.
Frontend Web App
VueFront is a Frontend Web Application. It is a Single Page App and also a Prograssive Web App. It uses a GraphQL API to pull in the data and VueJS on Nuxt to display it.
NodeJS and Yarn
VueFront is built on NodeJS. To use it you will need to have it preinstalled. You can use NPM or Yarn to install VueFront. We recommend Yarn. Learn how to install NodeJS and Yarn.
3.
Install a Theme
Choose a theme from our Theme Store. To install a theme, follow the theme installation guide before building the Web App. Learn how to modify a theme here. Don’t see a theme you like? Build your own theme.
Premium themes
When choosing a Theme, you will see free and premium themes. When buying a theme license, you get 1 year of free updates. One license allows one installation per domain. For development purposes, you can have a stage subdomain with the multiple instances of the installed theme.
Customize a theme
VueFront is customizible, allowing you to add your changes without limiting future update. This is accomplished via parent/child inheritance. Learn how to modify your theme in our theme documentation.
4.
Deploy VueFront Web App
You can built your VueFront Web App in Development mode to see immediatly how it looks and works. Once finishing in development, you can deploy the web app to your current production site by dropping the files in your root folder. For more advanced cases follow our deployment guide.
Current hosting provider
VueFront can be used on an old-fashioned hosting provider when generated as a SPA web app (static website). This is perfect for small static websites and business pages. Learn more.
Server Side Rendering
For E-commerce with a lot of dynamic pages it is best to use SSR (server-side rendering). VueFront supports SSR when built as a Universal App. Learn more.