3

Can any guide me how to integrate pwa for already existing magento 2 project without collapsing previous theme

2

3 Answers 3

2

Now clone pwa-studio repository

git clone https://github.com/magento-research/pwa-studio.git

You have to clone this repository in magento root directory ex: /var/www/html/magento

You will see the pwa-studio directory in /var/www/html/magento. Enter into this directoy:

cd pwa-studio/

Specify the Magento backend server in .env file. you can see the .env.dist file in /var/www/html/magento/pwa-studio/packages/venia-concept/ direcoty. If you are not able see, enable show hidden files. Now create .env file from this env.dist

cp packages/venia-concept/.env.dist packages/venia-concept/.env

Open this .env file and find MAGENTO_BACKEND_URL. Here configure your local Magento 2 instance, my case it is:

MAGENTO_BACKEND_URL="https://magento2-pwa.com/"

Find the deployVeniaSampleData.sh file in /var/www/html/mage0/pwa-studio/packages/venia-concept/ directory. and copy this file in your Magento root directory. Now it must look like /var/www/html/magento/deployVeniaSampleData.sh Now run:

bash deployVeniaSampleData.sh

After successful installation run:

bin/magento setup:upgrade
bin/magento indexer:reindex
bin/magento cache:flush

Reference: https://webkul.com/blog/magento2-3-pwa-studio-setup/

I hope this will help

2

Nothing will hapen to your existing magento as PWA only needs API's from your Magento store.

Follow all steps mentioned here: https://magento-research.github.io/pwa-studio/venia-pwa-concept/setup/

only provide backend URL as your magento link and all data's will be fetched from this link.

1
  • It will change existing frontend theme. I don't want change
    – Subu
    Jul 16, 2019 at 11:50
1
  1. Choose PWA Solution: Select a PWA solution like Magento PWA Studio, Vue Storefront, or Deity Falcon.

  2. Development Environment:** Set up a separate environment for PWA development.

  3. Install PWA: Install the chosen PWA solution and configure it to connect with your Magento backend.

  4. Customize Theme: Modify the PWA theme to match your existing Magento theme's design.

  5. Extension Integration:** Integrate third-party extensions with the PWA if needed.

  6. Data Migration: Ensure customer data and orders are synchronized between the existing site and PWA.

  7. Testing: Thoroughly test the PWA for compatibility, responsiveness, and performance.

  8. Progressive Enhancement: Add advanced features to the PWA gradually.

  9. Launch and Monitor: Launch the PWA to a limited audience, monitor performance, then roll it out to all users.

  10. Expert Assistance: Consider working with experienced developers for a successful integration.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.