Are you prepared to try all benefits of Magento PWA Studio?

Right now we are standing on the verge of big changes in eCommerce. And these changes will influence both the customer experience and the approach to developing web platforms as well.

At the end of this year, we are waiting for Magento 2.3 release. In 2017 Magento team announced that they are developing a set of tools for building online marketplaces as PWAs (Progressive Web Applications). Magento has called this set of tools the Magento PWA Studio. To be more precise, PWA means that your Magento shop is written in the web platform but behaves like an application.

What will happen if you decide to use the collection of tools to make your Magento 2 store a Complex Progressive Web Application? Your online store will become much faster. As a result, you will stand out among your competition and provide the customer with a much better user experience.

What do you need to start experiencing the benefits of Magento PWA Studio:

  • check whether your store is running on PHP 7.1 minimum.
  • GraphQL (a query language for API) but it will become available with the release of Magento 2.3

Scroll down to see a step by step guide to start your Magento PWA studio:

  • Prerequisites
  • Installed composer (Composer version 1.6.5)
  • Nodejs v10.5.0
  • Npm v6.1.0
  • Docker v18.03
  • Docker-compose v1.21.1
  • git

Download project runtime configuration from git repo: there are: docker-compose.yml, nginx configurations, example of Dockerfile for the base development image.


Obtaining the Magento 2.3 dev source:


Download Magento2 PWA-Studio, we will use this code later:

  Start the machine. It will bring up all required services and generate self-signed SSL certificate. Add root cert to a system chain as a trusted SSL cert. For MacOS users there is a command.  

And now let’s install Magento:


Login to a docker container:

Add sample data using composer:

  It will ask API keys from Magento:

Install Magento with security options:


Create symlinks inside the container from for PWA module and theme files:

    Logout from docker container, don’t worry you will not let it alone. You will be back.

Let’s setup PWA studio, it’s in alpha stage and will require some tricks.

    Let’s edit files Update path to client.js file it should be:    

Let’s build a theme and back to the project root:

    I advise to update src/app/etc/env.php update magento config to enable redis cache    

Hey, don’t miss, we’re back! Login into docker container.

    Enable module:   Run update command:  

Don’t trust development mode, push it. Deploy theme with a force key.

  Clear cache:  

If you did everything right you will get a page with a text – CMS Page Stub

  What is working now:   Category pages   Product pages  

That’s it. If you have any additional questions concerning PWA development, feel free to contact me directly.

Leave a Reply

Your email address will not be published. Required fields are marked *