# integrate react into a WebOS application 

**URL:** <https://forum.webostv.developer.lge.com/t/integrate-react-into-a-webos-application/7422>\
**Category:** Web App Development\
**Created:** [May 31, 2024, 6:31am UTC](https://forum.webostv.developer.lge.com/t/integrate-react-into-a-webos-application/7422 "2024-05-31T06:31:21Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![DevIntech](https://avatars.discourse-cdn.com/v4/letter/d/ba9def/32.png) [@DevIntech](https://forum.webostv.developer.lge.com/u/DevIntech)\
**Post date:** [May 31, 2024, 6:31am UTC](https://forum.webostv.developer.lge.com/t/integrate-react-into-a-webos-application/7422/1 "2024-05-31T06:31:21Z")

</div>

Good morning,  
I wanted to know if there was a tutorial or boilerplate that allows me to integrate react into a WebOS application (ares-generate -t basic ./sampleApp), in a single code so that I can also call up WebOs methods and services in the React part.

Thank you

---

<div class="post-metadata">

**Author:** ![narae0.kim](https://avatars.discourse-cdn.com/v4/letter/n/87869e/32.png) [@narae0.kim](https://forum.webostv.developer.lge.com/u/narae0.kim)\
**Post date:** [May 31, 2024, 6:32am UTC](https://forum.webostv.developer.lge.com/t/integrate-react-into-a-webos-application/7422/2 "2024-05-31T06:32:39Z")

</div>

If your app is a packaged web app, please try again as a [hosted web app](https://webostv.developer.lge.com/develop/getting-started/web-app-types#hosted-web-app). Thank you.

---

<div class="post-metadata">

**Author:** ![DevIntech](https://avatars.discourse-cdn.com/v4/letter/d/ba9def/32.png) [@DevIntech](https://forum.webostv.developer.lge.com/u/DevIntech)\
**Post date:** [June 3, 2024, 9:55am UTC](https://forum.webostv.developer.lge.com/t/integrate-react-into-a-webos-application/7422/3 "2024-06-03T09:55:40Z")

</div>

Thank you for your reply.  
I tried creating a Hosted web app by connecting it to a react app, and everything works for me, both on the simulator and the emulator.  
But how do I integrate the webOS API into my code?  
I tried integrating it with npm ( @procot/webostv ) in the react app.  
But in the emulator it doesn’t detect the methods I put in it.  
How can I do this?

```auto
import logo from './logo.svg';
import './App.css';
import webOS from '@procot/webostv';
import { useEffect, useState } from 'react';

function App() {

  const [deviceInfo, setdeviceInfo] = useState('Non ha caricato nulla');
  const [platform, setplatform] = useState('Non ha caricato nulla');

  useEffect(() => {

      webOS?.platform?.tv ?
        setplatform( `OK ${JSON.stringify(webOS.platform.tv)}`)
        : setplatform('ERROR platform');

        webOS?.deviceInfo ?
          webOS.deviceInfo( (device) => {setdeviceInfo(`OK ${JSON.stringify(device)}`)})
          : setdeviceInfo('ERROR deviceInfo');

  }, [])
  

  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <pre> { platform }</pre>
        <pre> { deviceInfo }</pre>
      </header>
    </div>
  );
}

export default App;

```

Thanks

---

<div class="post-metadata">

**Author:** ![narae0.kim](https://avatars.discourse-cdn.com/v4/letter/n/87869e/32.png) [@narae0.kim](https://forum.webostv.developer.lge.com/u/narae0.kim)\
**Post date:** [June 4, 2024, 4:42am UTC](https://forum.webostv.developer.lge.com/t/integrate-react-into-a-webos-application/7422/4 "2024-06-04T04:42:09Z")

</div>

For questions about the procot/webostv package, please contact procot. And if you want to use LG API, please refer to [References](https://webostv.developer.lge.com/develop/references). Thank you.