> For the complete documentation index, see [llms.txt](https://tropykus.gitbook.io/tropykus-widget/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tropykus.gitbook.io/tropykus-widget/instalacion.md).

# Instalación

### Introducción

El widget de Tropykus le permite a un usuario acceder a los servicios de ahorro y crédito de Tropykus Finance desde un widget embebido en un sitio web de un tercero, facilitando el acceso de sus clientes a los servicios de Tropykus&#x20;

### Requerimientos del proyecto

Este widget fue construido utilizando ReactJS v18.2, y puede ser instalado en un sitio web con un procedimiento muy simple. Se recomienda el uso de NodeJS v20&#x20;

### Instalación del widget

Inserte el script dentro de su template de HTML para ejecutar el paquete:

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Tropykus Widget</title>

    <!-- Your code -->
  </head>
  <body>
    <!-- ... Your code ...  -->
      <!-- You can add custom styles for the container-->
    <style>
      .widget-container {
        border: 1px solid #ccc;
        padding: 10px;
        margin-bottom: 20px;
      }
    </style>
    <div class="widget-container">
      <div id="root"></div>
      <!-- The widget will mount here -->
      <script type="module" src="https://unpkg.com/tropykus-widget"></script>
    </div>
    <!-- ... Your code ...  -->
  </body>
</html>
```

### Instalación como un componente en React o NextJS

Instalar el widget usando NPM

```bash
npm install tropykus-widget
```

En el app de destino, importar el widget como componente y renderizarlo:

```javascript
import TropykusWidget from 'tropykus-widget'

function App() {

  return (
    <>
      {/*  Rest of your code ... */}
      <TropykusWidget />
      {/*  ... Rest of your code */}
```

### Configuración

Para solicitar una configuración personalizada, por favor contactar al equipo de Tropykus al correo <contact@tropykus.com>
