Compilación de Agile Poker con el SDK de Live Share - Teams

El SDK de Live Share le permite crear aplicaciones de colaboración y descubrir más formas de colaborar y conectarse a través de Teams. Puede crear aplicaciones para compartir contenido, como ver películas, jugar juegos en directo, etc., en llamadas uno a uno de Teams, llamadas grupales, programar reuniones y reunirse ahora.

Esta guía paso a paso le ayuda a crear una aplicación de ejemplo de Agile Poker mediante el SDK de Live Share. Verá la siguiente salida:

Requisitos previos

5 minutos restantes

Instale las siguientes herramientas y configure el entorno de desarrollo:

	Instalar	Para usar...
	Microsoft Teams	Microsoft Teams para colaborar con todos los usuarios con los que trabaje a través de aplicaciones para chat, reuniones y llamadas a todos en un solo lugar.
	Visual Studio 2022	Puede instalar la versión empresarial en Visual Studio 2022 e instalar las cargas de trabajo ASP.NET y desarrollo web. Use la versión más reciente.
	Node.js y NPM	Entorno de tiempo de ejecución de JavaScript de back-end. Para obtener más información, vea Node.js tabla de compatibilidad de versiones para el tipo de proyecto.
	Túnel de desarrollo	Las características de aplicaciones de Teams (bots conversacionales, extensiones de mensajes y webhooks entrantes) necesitan conexiones entrantes. Un túnel conecta el sistema de desarrollo a Teams. Dev tunnel es una herramienta eficaz para abrir de forma segura tu host local a Internet y controlar quién tiene acceso. El túnel de desarrollo está disponible en Visual Studio 2022, versión 17.7.0 o posterior. o también puede usar ngrok como túnel para conectar el sistema de desarrollo a Teams. No es necesario para las aplicaciones que solo incluyen pestañas. Este paquete se instala en el directorio del proyecto (mediante npm `devDependencies`).

Nota:

Después de descargar ngrok, regístrese e instale authtoken.

Compilación y ejecución de la aplicación de ejemplo de Agile Poker

4 minutos restantes

Vaya a la aplicación de ejemplo de Agile Poker .
Clone el repositorio del SDK de Live Share para probar la aplicación de ejemplo:
```
  git clone https://github.com/microsoft/live-share-sdk.git
```
Abra una ventana de terminal.
Ejecute el siguiente comando para ir a la carpeta de la aplicación de ejemplo Agile Poker:
```
cd live-share-sdk\samples\javascript\22.react-agile-poker
```
Ejecute el siguiente comando para instalar el paquete de dependencias:
```
npm install
```
Ejecute el comando siguiente para iniciar el cliente y el servidor local:
```
npm run start
```
Una nueva pestaña del explorador abre una http://localhost:3000 ventana y aparece el juego Agile Poker.
Abra una nueva ventana de terminal ngrok para crear un túnel e implementar la aplicación localmente.
Ejecute el siguiente comando para crear un túnel. La aplicación de ejemplo usa el puerto 3000:
```
ngrok http 3000--host-header=localhost
```
Se crea el túnel ngrok.

Configuración del archivo de manifiesto y carga de la aplicación

3 minutos restantes

Debe configurar el archivo de manifiesto y cargar el paquete de manifest.zip en Teams.

Abra el archivo manifest.json y actualice la siguiente información.
- Establézcalo en "ID"Id. de aplicación de Microsoft.
- Reemplace todas las repeticiones de por el nombre de <<BASE_URI_DOMAIN>> dominio ngrok o devtunnel completo.
Cree un archivo .zip con los siguientes archivos presentes en la carpeta Manifiesto :
- manifest.json
- outline.png
- color.png
Cree una reunión en Teams con algunos moderadores y asistentes.
Únase a la reunión.
Una vez iniciada la reunión, seleccione Aplicaciones.
En la ventana emergente, seleccione Administrar aplicaciones.
Seleccione Cargar una aplicación.
Seleccione el archivo .zip que ha creado en la carpeta Manifiesto y seleccione Abrir.
Seleccione Agregar.
Vuelva a la página de detalles de la reunión y seleccione Aplicaciones>Aplicación agile poker .
Haga clic en Guardar.

La aplicación Agile Poker se agrega al panel lateral de la reunión de Teams.