# React Meeting Integration

**URL:** <https://community.hubspot.com/t/react-meeting-integration/24465>\
**Category:** CMS Development\
**Tags:** site-setup, javascript\
**Created:** [August 21, 2020, 9:04am UTC](https://community.hubspot.com/t/react-meeting-integration/24465 "2020-08-21T09:04:51Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![John89](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/john89/32/30597_2.png) [@John89](https://community.hubspot.com/u/John89)\
**Post date:** [August 21, 2020, 9:04am UTC](https://community.hubspot.com/t/react-meeting-integration/24465/1 "2020-08-21T09:04:51Z")

</div>

Hello,

I’m trying to integrate the Meeting module inside a React component, but without luck.

I receive the following warning: “Did not expect server HTML to contain a \<iframe\> in \<div\>.”

 ![30534iE6A2D81F6F84073E.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/3/5/354c1bb25c317210504b3b7ec4608bb799a9f51f.png)

The component:

 ![30535i7217F0359186D5FD.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/e/c/ec8da57e1fa290efc5cb744202cbabcd63b8ba1a.png)

Thanks guys!

---

<div class="post-metadata">

**Author:** ![cathalhopper](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/cathalhopper/32/5479_2.png) [@cathalhopper](https://community.hubspot.com/u/cathalhopper)\
**Post date:** [August 24, 2020, 2:32pm UTC](https://community.hubspot.com/t/react-meeting-integration/24465/2 "2020-08-24T14:32:51Z")

</div>

Hi @John89 , I hope all is good with you 🙂

The error message you are seeing here is specific to React and not related to HubSpot based on some external resources I’ve seen.  
I’m not overly familiar with React so I can’t pinpoint the issue and help from there, but there are a number of external resources where this has come up where it looks like resolutions have been found that you may find helpful!

> <https://stackoverflow.com/questions/45350360/react-16-warning-warning-js36-warning-did-not-expect-server-html-to-contain-a>

[https://github.com/facebook/react/issues/10879](https://github.com/facebook/react/issues/10879)

> <https://github.com/vercel/next.js/issues/8773>
>
> old issue

Specifically it seems to point to hydrate with React: [https://reactjs.org/docs/react-dom.html#hydrate](https://reactjs.org/docs/react-dom.html#hydrate)

Hopefully that points you in the right direction!

Best,

Cathal 🙂

---

<div class="post-metadata">

**Author:** ![MassR](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/massr/32/38114_2.png) [@MassR](https://community.hubspot.com/u/MassR)\
**Post date:** [October 15, 2021, 1:23pm UTC](https://community.hubspot.com/t/react-meeting-integration/24465/3 "2021-10-15T13:23:56Z")

</div>

Just wrap the script with [react-helmet](https://github.com/nfl/react-helmet)

---

<div class="post-metadata">

**Author:** ![CVanPutten](https://avatars.discourse-cdn.com/v4/letter/c/50afbb/32.png) [@CVanPutten](https://community.hubspot.com/u/CVanPutten)\
**Post date:** [October 9, 2023, 6:30pm UTC](https://community.hubspot.com/t/react-meeting-integration/24465/4 "2023-10-09T18:30:53Z")

</div>

This React snippet works in case others need the code:

```lia-code-sample
<div className='scheduling-widget-wrapper'>
 <Helmet>
 <script
 type="text/javascript"
 src="https://static.hsappstatic.net/MeetingsEmbed/ex/MeetingsEmbedCode.js"
 ></script>
 </Helmet>
 <div
 className="meetings-iframe-container"
 data-src="https://meetings.hubspot.com/[your-meeting-id]?embed=true"
 ></div>
 </div>

```

---

<div class="post-metadata">

**Author:** ![JOttenlips](https://avatars.discourse-cdn.com/v4/letter/j/ea5d25/32.png) [@JOttenlips](https://community.hubspot.com/u/JOttenlips)\
**Post date:** [March 29, 2022, 2:35pm UTC](https://community.hubspot.com/t/react-meeting-integration/24465/5 "2022-03-29T14:35:53Z")

</div>

The script wasn’t working for me either in React, so i just added my own iframe. No React Helmet needed. Cheers!  
```

\<iframe

title={‘hubspot’}

style={{

width: ‘100%’,

height: ‘500px’

}}

src={‘[https://meetings.hubspot.com/youruser/demo?embed=true](https://meetings.hubspot.com/youruser/demo?embed=true)’}

/\>  
```