Vue Storefront takes away the hassle of building PWAs for eCommerce. By providing a stable platform, tools on top of that, and knowledge, we empower our community to build amazing solutions.

1. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
Innovating with PWA

2. ● Open Source, with a thriving community
5k Github stars, 2100 Slack members, 30+ modules by community, contributions from 6 continents.
● Connected to 10+ eCommerce backends
Magento 1&2, Shopware, Odoo, Prestashop, Django Oscar, BigCommerce, Episerver, Websphere.
● Many more integrations
Adyen, Prismic, Algolia, Stripe, Advanced Layered Navigation, Storyblock, Contentful, Nosto.
● 50+ official partners
In 25 countries around the world.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

3. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
40+ live implementations

4. Our goal is to make PWA a
commodity
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

5. By providing a stable platform.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

6. By providing a stable platform.
Powerful tools on top of that.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

7. By providing a stable platform.
Powerful tools on top of that.
And the knowledge to excel.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

8. Merchants Agencies Technology Providers
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

9. The platform.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

10. Getting the basics right
PWA as a standard
Develop mobile & web
apps all at once with the
PWA technology
Platform agnostic
Push your project to
production fast keeping it
scalable and flexible.
Top-notch technologies
Build lightning-fast
frontends based on service
oriented architecture
Headless architecture
Connect via API and
change backend anytime
without changing
frontend
Modern JS Stack
Explore Vue.js, the most
flexible framework to
make faster stores in less
time
Ready-to-use
Use all standard
eCommerce features out
of the box
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

11. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
Platform Agnostic PWA frontend

12. Platform Agnostic
● Works with any backend
● Learnings from different platforms
● Using best practices
● Integrate directly into the back office
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

13. 1
2
3
4
5
1
2
3
4
5

14. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
Vue Storefront App
Other sources
Aggregate data and add caching
Use Middleware as glue
Magento Backend
Middleware
Indexed Storage
Static Cache
Direct API calls

15. Benefits
● Extensibility
● Less load on underlying systems
● Faster Time to Market
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

16. The tools.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

17. ● Easy to implement branding & styling
● Reusable components
● Extensive eCommerce UX research
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

19. About
StorefrontUI
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

20. About
StorefrontUI
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
https://storefrontui.io

21. ● Platform as a Service
● ZERO DevOps
● Optimized Kubernetes clusters
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

22. About
StorefrontCloud
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
https://storefrontcloud.io

23. The knowledge.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

24. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
PWA and Vue Storefront events

25. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
MeetPWA events
● Expert Speakers
● Learn more about PWA
● Deep Dive into Mobile conversion

26. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
Research into Best Practices

27. Magento 1
Migrations
Unique Use Cases Mobile UX/UI
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

28. Visual
search
You can take a picture of
the barcode, QR code, or
the products themselves.
Find the same, or similar,
products in the catalog.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

29. Basic understanding
of mobile ergonomics
Users usually hold the phone
one-handed (49%).
The span of possible gestures
is very narrow.
The Steven Hoober study
“How Do Users Really Hold Mobile Devices”
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

30. Navigation
and content
Make interaction a pleasure
Guide the user through a signup process
with simple gestures.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

31. Prioritizing
content
The home page is a great place for a navigation.
Especially the center of the screen.
The typical hero slider doesn’t
work very well on mobile.
Don’t worry about being “above the fold”.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

32. Home Screen
Tells a story
with
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

33. Optimize
product pages and
listings for mobile
More app-like approach.
We shouldn’t copy desktop UI to mobile.
With a PWA, scrolling feels fluent and
intuitive
Try Swiping.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

34. Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io
Through Ebooks

35. The
PWA Book
Research
Use cases
Best Practices
Interesting case studies
http://bit.ly/pwa-book
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

36. Microservices
For eCommerce
Benefits
Drawbacks
Use cases
Deepdive into architectures
http://bit.ly/ecom-microservice
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

37. More than a Product.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

38. More than a Product.
Be part of an Ecosystem.
Vue Storefront - Innovating with PWA @sandermangelsander@vuestorefront.io

39. Sander Mangel
CTO Vue Storefront
sander@vuestorefront.io
@sandermangel
Sander Mangel
www.vuestorefront.io
bit.ly/awesome-vue-storefront
PWA - Practical Application for Buckaroo @sandermangelsander@vuestorefront.io