Install Tapita for Magento PWA Studio

Install Tapita for Magento PWA Studio

Integrate PWA Studio frontend

Clone Tapita PWA Studio repo

Scenario 1: If you use @magento/create-pwa package
From the root directory of your PWA Studio project, clone the repository:
  1. git clone https://github.com/Simicart/pagebuilder-module-pwa-studio @simicart/pagebuilder-module-pwa-studio/
Modify these lines in package.json file at the root folder as below:
  1. "dependencies": {
  2.   ...
  3.   "@simicart/pagebuilder-module-pwa-studio": "link:./@simicart/pagebuilder-module-pwa-studio"
  4. },
  5. "devDependencies": {
  6.     "simi-pagebuilder-react": "^1.3.4",
  7.     ...
  8. },
Scenario 2: If you clone Magento PWA Studio from GitHub (https://github.com/magento/pwa-studio)
Go to packages/venia-concept, then clone the repository:
  1. git clone https://github.com/Simicart/pagebuilder-module-pwa-studio @simicart/pagebuilder-module-pwa-studio/
Modify these lines in packages/venia-concept/package.json file as below:
  1. "dependencies": {
  2.   ...
  3.   "@simicart/pagebuilder-module-pwa-studio": "link:./@simicart/pagebuilder-module-pwa-studio"
  4. },
  5. "devDependencies": {
  6.     "simi-pagebuilder-react": "^1.3.4",
  7.     ...
  8. },

Install and start project

  1. yarn install && yarn run watch

Synchronize Magento 2 backend

In your Magento backend, go to System Extensions Integrations.
Click Add New Integration.

Enter a unique name for the integration in the Name field. Then enter your admin password in the Your Password field. Leave all other fields blank.

Click the API tab. Select the Magento resources the integration can access. You can select all resources, or select a custom list with at least those items (and children) selected: Catalog, Marketing, Stores



Click Save to save your changes and return to the Integrations page.
Click the Activate link in the grid that corresponds to the newly-created integration.
Click Allow. A dialog similar to the following displays:



Copy the Access Token. Go to your Tapita Dashboard > Synchronization.

  1. URL: the base URL of your Magento website
  2. Token: the Access Token that you can get in the previous step
Go to Integration tab and click Generate Token. Then, copy the generated Integration Token to use in the next steps.

alt text

Open the file src/override/magentoRoute.js and change the value at this line to the Integration Token you got in previous step.
  1. const integrationToken = 'xxxxxxxxxxxxxxxxxxxxxx';
Then, run this command
  1. yarn run watch
Done!
    • Related Articles

    • Install Tapita for ScandiPWA

      Download Tapita Page Builder extension for ScandiPWA v5:  https://marketplace.scandipwa.com/tapita-page-builder-scandipwa-v5.html Then follow these steps to install: ...
    • Install Tapita for Vue Storefront

      From your Vue project folder, install vuera to use ReactJS in Vue yarn add vuera Install Tapita Page Builder module npm install --save simi-pagebuilder-react Install React npm install --save react react-dom Then run this command yarn install Now we ...
    • Install PWA Connector (free version)

      PWA only works on HTTPS sites. Download PWA Connector from GitHub: https://github.com/Simicart/pwacommerceformagento2 Extract the downloaded package Use an FTP client (such as FileZilla) to upload the extracted files to Magento root folder on your ...
    • Install Tapita for Shopify Hydrogen

      Integrate Hydrogen frontend Requirements: Node v14+ Yarn Create Shopify private app to get Storefront access token Step 1: Log in to your Shopify store and navigate to the Apps section. Step 2: Take yourself to the bottom of the page and click on ...
    • Configuration guide for Magento 2

      In your Magento backend, go to Stores > Configuration > Tapita PageBuilder Frontend to enable the extension and configure the fields: Enable: Yes Override your URL: decides what will happen if there are pages on Magento backend and Tapita builder ...