Connect Frontend and Backend in Venia PWA Setup

Question

We have Magento PWA Venia Setup.

Now We installed the Extension downloaded from Commerce Marketplace.

The Extension installed fine and now we can see configuration in backend.

Requirement

Now How we can connect the extension to Frontend , so that we need to display the information in frontend.

Answer 1

Here I have post my answer after talking with you please create these files and add them to the directory

src > components > HomePage > components > FierWork.js

import React from "react";
import HeadTitle from './HeadTitle';

const FireWork = () => {
    return(
        <div class="fw_story_wrapper">
            <HeadTitle title={'Shop By Look'} textAlign={'center'} />
            <script async src='//asset.fwcdn3.com/js/storyblock.js'></script>
            <fw-storyblock branding="false"  channel="glow" playlist="kj43j2" autoplay="true"></fw-storyblock>
            <br/>
            <script async src="//asset.fwcdn3.com/js/embed-feed.js" type="text/javascript" ></script>
            <fw-embed-feed channel="glow" playlist="kj43j2" ui_border_style="hard"></fw-embed-feed>
        </div>
    );
}

export default FireWork;

after that add this code to the homepage.js file after the SpotLight code line no. 17

const FireWork = React.lazy(() => import('./components/FireWork'));

now add this code after the Sportlight code homepage.js file line no. 130

'fierwork': FireWork,

Please follow this way and run the command into the terminal

yarn run build 

If this solution works for you so please accept my solution and give an upvote. Thanks.