Jovo Web Starter Aplicaciones Voz y Chat para Navegador
Jovo Web Starter Aplicaciones Voz y Chat para Navegador

Jovo Web: Aplicaciones de Voz y Chat para el Navegador

Jovo para Web te permite crear aplicaciones de chat y voz totalmente personalizables que funcionan en el navegador. E incluso viene con 4 plantillas de código abierto.

Construido con Jovo FrameworkVue.js, and Tailwind CSS.

Demostración: jovo.tech/demos/starter-web-standalone.

Demo de Jovo Web
Demo de Jovo Web

Empezando

  • Descargar starter

Utiliza la CLI de Jovo para crear un nuevo proyecto basado en este iniciador/starter:

#Instale la última versión de la CLI de Jovo
$ npm i -g jovo-cli
#Esto descargará la plantilla e instalará las dependencias.
$ jovo new my-voice-app --template starter-web-standalone
$ cd my-voice-app

Alternativamente, puedes clonar este repositorio y ejecutar npm install.

  • Iniciar cliente (Vue.js)
$ cd client
#Iniciar frontend Vue
$ npm run serve
  • Iniciar aplicación (Jovo) En una nueva pestaña:
$ cd app
Inicia el servidor de desarrollo Jovo
$ jovo run

La primera vez, jovo run compilará el código TypeScript. Después de hacer cambios, asegúrate de compilar con npm run tsc y luego inicia el servidor de desarrollo Jovo nuevamente.

  • Abre el iniciador en tu navegador:
http://localhost:8080

Nota: Para propósitos de demostración y la facilidad de comenzar rápidamente, la plantilla usa la API Web Speech  como un ASR, que solo funciona en Google Chrome. Para utilizar la integración web en otros navegadores, puede integrar una de nuestras integraciones de varios cloud ASRs.

Cómo funciona

Cómo funciona Jovo Web
Cómo funciona Jovo Web

Este repositorio contiene:

Personalización

El Iniciador se creó para que usted tenga un ejemplo funcional, así como un punto de entrada para comenzar con la integración de Jovo Web.

La siguiente documentación te ayudará a comprender cómo está estructurado el Iniciador y qué componentes se encargan de qué tareas.

Cliente

El cliente es un proyecto de Vue.js que consta de un solo componente “RecordButton” que está diseñado en Tailwind CSS.

Componente: RecordButton

El componente RecordButton maneja el registro de múltiples oyentes de eventos, a saber, ClientEvent.RequestClientEvent.Response, and ClientEvent.Action.

Además de eso, implementa la lógica para cambiar del modo oscuro al claro como una función de demostración, que hace uso de las variantes personalizadas de Tailwind.

App

La aplicación Jovo, la nueva integración de la plataforma web Jovo así como NLP.js como su NLU.

Modelo de lenguaje

El modelo de lenguaje consta de un único intent, SwitchThemeIntent, que se utiliza para cambiar el tema del sitio web a modo oscuro o claro.

app.ts

El archivo app.ts contiene la inicialización de la aplicación y sus complementos, así como la lógica básica para el SwitchThemeIntent. Hace uso de las acciones personalizadas de integraciones web para enviar una acción de establecer un tema que contiene la entrada del usuario (ya sea dark o light). La acción activará el oyente ClientEvent.Action que mencionamos anteriormente.

Sobre Jovo

Jovo es el marco de desarrollo de voz más popular, incluidas plataformas como Alexa, Google Assistant y la web.

Dark Mode

jovo-framework (este enlace se abre en una nueva ventana) por jovotech (este enlace se abre en una nueva ventana)

🔈 The React for Voice and Chat: Build Apps for Alexa, Messenger, Instagram, the Web, and more

Mi Carro Close (×)

Tu carrito está vacío
Ver tienda