# Docusaurus

#### Key Do’s and Don’ts

✅ Install the JavaScript code below in the **Documentation.**

✅ Insert the JavaScript in the root index.html page of your documentation webpages.

❌ Do Not install the Reo.Dev tracking code more than once on a single page.

### **Install JavaScript code in your documentation webpages**

1. Copy the above JavaScript code snippets (provided below)
2. Go to the root **index.html** page of documentation webpages
3. Paste the javascript code snippet before the closing tag in the HTML code of your webpage
4. In case, there are multiple index.html pages that house child routes, include the code once on each page

{% hint style="warning" %}
**Please note:**

* Do not install the Reo.Dev tracking code more than once on a single page.
* Please make sure the correct JavaScript code is copied for Docs pages.
  {% endhint %}

### **Javascript Code Snippet for Docs**

Create a custom js file and place the reo initiation script in it. Make sure to place the newly created file in `scripts` or `js` folder inside of `static` folder

{% code overflow="wrap" fullWidth="false" %}

```javascript
!function(){var e,t,n;e="XXXXXX",t=function(){Reo.init({clientID:"XXXXXX"})},(n=document.createElement("script")).src="https://static.reo.dev/"+e+"/reo.js",n.async=!0,n.onload=t,document.head.appendChild(n)}();
```

{% endcode %}

Next, we can leverage the object format in scripts attribute in docusaurus.config.js and include the path to newly created js

```javascript
module.exports = {
scripts: [
// Object format.
{
src: "/scripts/custom-reo.js", // it references from static folder
},
],
};
```

### **Verify successful installation of Javascript on documentation webpages**

1. Open a page on your documenation and right-click anywhere on the page.
2. In the dropdown menu, select Inspect.

![](https://usercontent.us.prod.clueso.io/d06f019c-da0b-4d5b-9fdd-9630e7fd5d0f/28b46112-4645-47eb-9938-6f009252da8d/a0b02360-0994-4149-8ace-5dc05278d57c/images/002e90a5-421e-42fd-bcdb-4162f488af09.png)

3. In the elements tab, Use the  Ctrl + F or Cmd + F  and search for “reo.dev”

![](https://usercontent.us.prod.clueso.io/d06f019c-da0b-4d5b-9fdd-9630e7fd5d0f/28b46112-4645-47eb-9938-6f009252da8d/a0b02360-0994-4149-8ace-5dc05278d57c/images/71626542-e7e0-40e8-a1d0-cc21c844ef3f.png)

If the tracking code appears, verify that the code matches.

### FAQs

<details>

<summary>Does the JavaScript code introduce any vulnerabilities or risks to the documentation?</summary>

The JavaScript code has been tested thoroughly to ensure that it does not introduce any vulnerabilities or risks to the website. Data sent by the JavaScript code is encrypted using the HTTPS protocol to ensure secure transmission and prevent unauthorized access.

</details>

<details>

<summary>Does the JavaScript code use external dependencies or third-party libraries?</summary>

The JavaScript code uses secure third-party libraries that have been thoroughly checked for vulnerabilities and risks.

</details>

<details>

<summary>How does JavaScript handle user privacy? Is there a potential risk of collecting personally identifiable information (PII) without proper consent?</summary>

It is designed to collect anonymous data such as browser information, page views, copy and click events without collecting any PII.

</details>

<details>

<summary>What impact will including this JavaScript have on the page load times of my documentation?</summary>

The code has been optimized to minimize any negative impact on page load time and performance. This code uses asynchronous loading technology so it can load independently without blocking the rendering of the page content.

</details>

<details>

<summary>Has the JavaScript been tested on different browsers and devices to ensure cross-platform compatibility and consistent behaviour?</summary>

The JavaScript code is thoroughly tested on multiple browsers (Chrome, Firefox, Safari, Edge, Brave) and devices (desktop, mobile) to ensure compatibility and consistent behaviour.

</details>

<details>

<summary>Will the inclusion of this JavaScript affect the overall user experience of the documentation, for example, slow down UI interactions or cause unexpected behaviour?</summary>

It doesn't affect the overall user experience. It will not slow down, or introduce any intrusive elements that have an impact on the experience.

</details>

<details>

<summary>Do you have a user consent mechanism in place to notify visitors of tracking activity and give them the opportunity to opt-out?</summary>

We do not collect personally identifiable information from our users, so an opt-out option is not required. This JavaScript is fully compliant with your web privacy policy.

</details>

<details>

<summary>Are there any fail-safe mechanisms in place to prevent scripts from disrupting critical functionality in the event of an error?</summary>

We have implemented fail-safe mechanisms in the JavaScript to prevent scripts from interrupting the website's critical functionality in the event of an error, thus ensuring a smooth user experience.

</details>

<details>

<summary>Will the JavaScript code continue to perform optimally as the website traffic and user base increase over time?</summary>

The code is optimized for scalability. The JavaScript code is designed to scale as your online traffic and user base grow. It will continue to work best even as traffic to your site increases. There are no significant limitations or performance bottlenecks associated with the tracking mechanism.

</details>

<details>

<summary>Is your JavaScript compliant with relevant industry standards and best practices such as GDPR and CCPA for data protection and user consent?</summary>

The JavaScript code adheres to relevant industry standards and best practices, such as GDPR and CCPA, regarding data privacy and user consent.

</details>

### Error Scenarios

* **Script initiation**

  Script initiation has been modified to rely on code initiation only on successful callback post download from CDN. So it will only initiate if successfully downloaded. In case the download fails, the docJS won’t get enabled but this eliminates the likelihood of an error scenario of page breaking.
* **API failure on token delete**

  On deletion of **all** Reo tokens, the most recent event tracking data will likely fail, but subsequent API calls will work fine.
* **Any inadvertent code failure on JavaScript**

  This should not be an issue since the code is wrapped in a try-catch block, the console may throw errors, which won’t be visible even on the console since logger would be disabled on the script.

If you need assistance with the implementation, contact your **Customer Success Manager** via the Slack channel or email us at [**support@reo.dev**](mailto:support@reo.dev)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.reo.dev/integrations/developer-docs/docusaurus.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
