PrestaShop PWA

A modern PWA application for your PrestaShop website based on Vue.Js Technology

prestashop pwa
Join Vue Storefront Discord.

What is Vue Storefront?

Vue Storefront is the world number one front technology based on Vue.Js. We can get power of Vue Storefront to build any front application for our websites. We did it for PrestaShop websites.

If you want to know more about the Vue Storefront and to know about its architecture check out this documentation.

Integration with PrestaShop

This integration is a PrestaShop website showcase, which you can check Vue Storefront features, and see how your shop will look like when you use Vue Storefront as your front-end technology. See how you can smoothly navigate across your shop just like mobile app and create any user experience you want without PrestaShop limitations. We are working on the main repository to make it complete.

Binshops REST API is at the heart of your website which exposes your shop endpoints. The Vue Storefront front application uses these API to build up the front application.

CSR PWA vs SSR PWA

If you search for PrestaShop PWA, you will see some PWA modules. But all of them are CSR rendered (Client-side rendering) solutions. It's highly recommended not to use CSR rendered front-ends for shopping websites. Why? It's all about SEO and performance issues, which CSR rendering will kill your website SEO rank.

The Vue Storefront approach is different. It uses SSR rendering (Server-side rendering) which fits shopping needs. You can get benefit from a smooth PWA which is great from SEO perspective.

Binshops REST API is at the heart of your website which exposes your shop endpoints. The Vue Storefront front application uses these API to build up the front application.

Installation Instructions

  1. Get Binshops REST API from Github

    https://github.com/binshops/prestashop-rest

  2. Install the module just like any other PrestaShop module. There is no need for any configuration, after installation your endpoints are ready.
  3. Clone the PrestaShop integration from for Vue Storefront Binshops Repository:

    https://github.com/vuestorefront/prestashop

  4. Make sure you have Node 10+ and Yarn 1 installed.
  5. Install dependencies. In root directory run:

    yarn install

  6. In the following file, replace the https://rest.binshops.com with your shop's base URL:

    packages/theme/middleware.config.js

  7. Build the project, at the root directory run:

    yarn build

  8. Run in dev:

    yarn dev

For more information about Vue Storefront integrations you can check this link: Vue Storefront Integrations

Code and Contribution

You can also contribute to the source code on Github. Join Vue Storefront Discord.