Embedding the Beamer script in your React application can be done differently based on whether you’re using a vanilla React setup or a Vite + React setup or Nextjs. This guide will help you integrate Beamer with your Vanilla React setup.
For a Vanilla React setup, you need to embed the Beamer script in the public/index.html
file. This file serves as the main HTML template for your React application.
public/index.html
file:public
folder.index.html
file.Add the following script tags inside the <head>
section of the index.html
file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Your App Title</title>
<!-- Beamer Script -->
<script>var beamer_config = {product_id: 'your_product_id',filter: 'example-filter' };</script>
<script type="text/javascript" src="https://app.getbeamer.com/js/beamer-embed.js" defer="defer"></script>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
index.html
file.npm start
or yarn start.
Click Here to know about How to Inject User Data into Beamer script in React.
Help us help you more
At Beamer, we care about our customers’ data and this is how we protect it.
Data Ownership
Your account and data belongs to you and will not be sold in any case. We can delete your account and data upon your request. Learn more
Encryption
Beamer data is encrypted in transit (advanced TLS protocols and 2,048-bit keys or better) and at rest (using AES 256 encryption with integrity).
Access
Customer data is always backed up and uptime is over 99.9%.
GDPR
Beamer is GDPR Compliant and has the Data Processing Agreements in place. Learn more
Penetration testing
Third party network, application and physical security tests are conducted regularly. Learn more