# Integrating kibana dashboard into react App

**URL:** https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227
**Category:** Kibana
**Created:** [January 24, 2022, 12:44pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227 "2022-01-24T12:44:55Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![Fillipe\_Developer](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/fillipe_developer/32/83575_2.png) [@Fillipe\_Developer](https://discuss.elastic.co/u/Fillipe_Developer)
#### Post date: [January 24, 2022, 12:44pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227/1 "2022-01-24T12:44:55Z")

</div>

Hi guys,

I want to know if it is possible to integrate Kibana into a react app, using its graphs and data? If there is already this possibility, please let me know what documentation?

---

<div class="post-metadata">

### Author: ![flash1293](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/flash1293/32/41227_2.png) [@flash1293](https://discuss.elastic.co/u/flash1293)
#### Post date: [January 24, 2022, 3:52pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227/2 "2022-01-24T15:52:01Z")

</div>

The commonly used approach is to use an iframe in your application. Would this fit your use case?

---

<div class="post-metadata">

### Author: ![Fillipe\_Developer](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/fillipe_developer/32/83575_2.png) [@Fillipe\_Developer](https://discuss.elastic.co/u/Fillipe_Developer)
#### Post date: [January 25, 2022, 1:35pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227/3 "2022-01-25T13:35:03Z")

</div>

Thanks for responding @flash1293, yes it fits, please send me a step by step tutorial on how I can develop using IFrames, to make it dynamic for each user on the system.

---

<div class="post-metadata">

### Author: ![flash1293](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/flash1293/32/41227_2.png) [@flash1293](https://discuss.elastic.co/u/flash1293)
#### Post date: [January 25, 2022, 2:21pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227/4 "2022-01-25T14:21:27Z")

</div>

There's not really many steps to go through - on the dashboard there's a "share" button - [Dashboard and visualizations | Kibana Guide [7.16] | Elastic](https://www.elastic.co/guide/en/kibana/current/dashboard.html#share-the-dashboard)

If you click it you can get an HTML snippet for the iframe you can use to get started. Take a look of the URL of the iframe, it contains various things like the dashboard id, current filter/timerange and so on. If that's necessary for your use case you can programmatically create the parts of the URL that are dynamic per user. The URL uses [rison](https://github.com/Nanonid/rison) to encode data.

---

<div class="post-metadata">

### Author: ![Fillipe\_Developer](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/fillipe_developer/32/83575_2.png) [@Fillipe\_Developer](https://discuss.elastic.co/u/Fillipe_Developer)
#### Post date: [January 25, 2022, 2:30pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227/5 "2022-01-25T14:30:51Z")

</div>

Thank you so much, may God bless you !

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)
#### Post date: [February 22, 2022, 2:31pm UTC](https://discuss.elastic.co/t/integrating-kibana-dashboard-into-react-app/295227/6 "2022-02-22T14:31:39Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
