Vue Storefront 1.9-rc— new release cycle, Hybris and Prismic integrations

Published in

The Vue Storefront Journal

7 min readMar 7, 2019

Version 1.9 is a huge milestone in Vue Storefront history. It’s not only a new release. It’s our promise to the community that Vue Storefront is mature enough to be a trustworthy enterprise solution that can keep its position as a leader in eCommerce Storefronts.

New release cycle

Since the product is mature enough to fulfill most of the needs we want to focus on polishing it by eliminating bugs, enriching APIs, making the product more stable and future-proof, providing better tooling with cli and dedicated snippets/dev tools.

From version 1.9 each Vue Storefront release will be divided into two steps (approx. 1 month each):

The release candidate (1.x-rc)— is a rough version with the newest features. It’s not production-ready but developers are able to test and play with newest additions to the core. During this milestone, we are mostly focusing on widening our APIs and adding new features.
Stable version (1.x) — Once all features and API additions are in the core we are working next month on polishing these new APIs, improving performance/stability and writing tests. After this milestone, we are publishing the production-ready and well-tested version of Vue Storefront.

You can read more about the new release cycle here.

Important note: The most recent stable version is 1.8.3. If you wish to upgrade to the latest codebase or make a new shop this is the right one to grab. We made tons of improvements in terms of stability during this release.

Product roadmap

Even though Vue Storefront is fully mature and ready to use the product we want to make it even better and our plans for its future are really exciting! We plan to incorporate many DX improvements with dedicated tooling and lower the entry level with each version. We also have four main long-term business goals;

Goal #1: to keep the Magento PWA leader status, support all ongoing and future implementations, maintain stability and backward compatibility at the highest level. We set the “implementations” work stream for that.
Goal #2: to improve our developer’s framework, improve the test coverage and code quality. We set the “improvements” work stream for this purpose.
Goal #3: to extend the number of supported backends in the ”integrations” workstream
Goal #4: to add new business features — in the “features” workstream.

Here you can read the details in Piotr Karwatka’s post.

SAP Hybris integration

Recently Rauf and Timofey from epam wrote a post on Hybrismart about Vue Storefront integration with SAP Hybris. They even recorded a demo!

Magento 1 integration open sourced!

Recently thanks to Piotr’s efforts we published full Magento 1 integration. It’s a perfect choice for Magento 1 -> Magento 2 migration.
Of course, it’s open source and MIT licensed!

Below you can find the bridge and data indexer:

Magento 2 native indexer open sourced!

Mage2vuestorefront indexer is soon to be replaced by native Magento 2 module! It will speed up the indexing process and makes it easier to jump in by Magento 2 developers thanks to the same technology stack.

The native indexer is available on GitHub to test and after we’re sure that it’s efficient and stable it’s gonna replace the current one.

Here you can find the repo.

Prismic integration by Agency Dn’D

Agency Dn’D just released a Prismic connector for Vue Storefront.
Prismic is a headless CMS that you can now use to manage content in your Vue Storefront store.

Vue Storefront Hackathon #6 in Amsterdam

Last month just before Vue.js Amsterdam our core partner Get_Noticed organized 6th Vue Storefront hackathon. As always it started with free training from the core team member and for the first time, it was Patryk Tomczyk!

Here you can read the recap of this awesome event!

Vue Storefront Hackathon #7 in Stockholm

30th of March Vue Storefront hackathon is taking place in Stockholm! The event will be hosted by joined forces of AW Academy, Dahl and Digitalent. Everyone around (or remotely) — feel invited :)

As always it’s a great chance to attend free training and learn Vue Storefront from core team members.

Here you can sign up for the hackathon.

SEO-friendly URL’s beta

We published a beta version of highly requested feature — SEO friendly URLs created by Piotr Karwatka. Now you can customize every URL exactly in a way you want!

You can read the details and a long discussion about this feature here.

Payment Request API alpha

Another big feature in this release is support for Payment Request API as an alternative to traditional checkout.

It’s a game-changer in terms of mobile checkout conversion and something we wanted in Vue Storefront for a very long time. Currently, it’s lacking only payment providers integration but our friends from Develo Design (authors of PayPal and Stripe modules) are already on it. You can expect a fully working version in the next release.

What else?

Added

Payment Request API integration — @qiqqq (#2306)
The Url Dispatcher feature added for friendly URLs. When config.seo.useUrlDispatcher set to true the product.url_path and category.url_path fields are used as absolute URL addresses (no /cand /p prefixes anymore). Check the latest mage2vuestorefront snapshot and reimport Your products to properly set url_path fields - #2010 - @pkarw
Unit tests of cart module written in jest — @lukeromanowicz (#2305)
New reactive helper to check online state. Usage: import { onlineHelper } from '@vue-storefront/core/helpers' and then onlineHelper.isOnline - @patzick (#2510)
Cart count config, allows you to display the item count instead of a sum of the item quantities — @pauluse (#2483)
Video support in Product Gallery component. — @rain2o (#2433)

Fixed

Gallery low-quality image in offline mode when high quality already cached — @patzick (#2557)
Problem with placing a second order (unbinding payment methods after first order) — @patzick (#2195, #2503)
Remaking order on user orders page — @patzick (#2480)
Images blinking on category page — @pkarw (#2523)
state.ts not bound in the module-template — @pkarw (#2496)
Validation in the Myprofile section for postcode field — @pkarw (#1317)
Non-integer qty of product added to the cart — @pkarw (#2517)

Changed / Improved

The core/helpers parsing URL methods exchanged to query-string package - @pkarw (#2446)
Unit tests in Karma are now removed in favor of jest — @lukeromanowicz (#2305)
Material Icons are loaded asynchronously — @JKrupinski, @filrak (#2060)
Update to babel 7 — @lukeromanowicz (#2554)
Fixed an issue where the correct image for a product configuration wasn’t set on the product page image carousel. Also added the fix on the productcarousel in the zoom component — @DaanKouters(#2419)
The way of creating VS Modules was changed to use the factory method instead of explicit object creation. — @filrak (#2434)
Added clear filters button on the desktop also and only show if filters are applied — @DaanKouters (#2342)
Improved docs at contributing.md and configuration.md (spelling etc.) — @ruthgeridema (#2421, #2422, #2423, #2425, #2426)
Fixed design issue of Country label on Edge 17 & Firefox — @ananth-iyer (#2390, #2399)
Wishlist and compare items are loaded from local cache only once, instead of every time when module component is rendered — @patzick (#2431)
Country field is filled by first country from the list in cart in payment section — @RakowskiPrzemyslaw(#2428)
Improved product quantity change component in product and cart — @patzick (#2398, #2437)
Updated to Vue 2.6.6 — @filrak (#2456)
Null sidebar menu data on static page fixed — @filrak (#2449, #2441)
Fix cannot edit previous steps in checkout — @filrak, @patzick (#2438)
Fixed route guard ssr problem — @vue-kacper (#2364)
Fix links in the footer to static pages bug — @filrak (#2452)
Fix links at docs, Basics/Configuration file explained — @daksamit (#2490)
Improve images loading on the category page, corrected alt view and blinking problem — @patzick (#2465)
Improve tsconfig for better IDE paths support — @patzick, @filrak (#2474)
fix breadcrumbs changing too early — @filrak, @pkarw (#2469, #2529)
improved product gallery load view, shows correct image on reload — @patzick (#2481, #2482, #2488, #2501)
Fix an issue where the index.html template within a theme is ignored — @EnthrallRecords (#2489)
Added async sidebar component with async off-screen components error handling and fetch retrying after coming back online — @filrak (#2408, #2451)
Inconsistent filters behavior — clear filters on page load — @patzick (#2435)
fix price is never below 0 and user can’t add 0 or below 0 products to cart — @RakowskiPrzemyslaw(#2437)
Check for placing single order in case of error in any payment module — @patzick (#2409)
Display prices in products added in offline mode. — @patzick (#2450)
Updated cypress dependency for e2e tests — @lukeromanowicz (#2518)
Improved styles on recommendation filters, product tile and numeric input — @patzick (#2458)

Deprecated / Removed

@vue-storefront/store package deprecated - @filrak