Создание Agile Poker с помощью пакета SDK для Live Share

Пакет SDK Live Share позволяет создавать приложения для совместной работы и находить дополнительные способы совместной работы и подключения через Teams. Вы можете создавать приложения для предоставления общего доступа к содержимому, например просмотра фильмов, игр в реальном времени и т. д., в teams one-on-oneзвонках, групповых звонках, планировании собраний и собраний сейчас.

Это пошаговое руководство поможет вам создать пример приложения Agile Poker с помощью live Share SDK. Вы увидите следующие выходные данные:

Предварительные условия

Осталось 5 мин

Вы устанавливаете следующие средства и настраиваете среду разработки:

	Установка	Для использования...
	Microsoft Teams	Microsoft Teams позволяет взаимодействовать со всеми пользователями, с которыми вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
	Visual Studio 2022	Вы можете установить корпоративную версию в Visual Studio 2022, а также рабочие нагрузки ASP.NET и веб-разработки. Используйте последнюю версию.
	Node.js и NPM	Серверной среды выполнения JavaScript. Дополнительные сведения см . вNode.js таблице совместимости версий для типа проекта.
	Туннель разработки	Функции приложений Teams (диалоговые боты, расширения сообщений и входящие веб-перехватчики) требуют входящих подключений. Туннель соединяет систему разработки с Teams. Туннель разработки — это мощный инструмент для безопасного открытия локального узла в Интернете и контроля доступа. Туннель разработки доступен в Visual Studio 2022 версии 17.7.0 или более поздней. или вы также можете использовать ngrok в качестве туннеля для подключения системы разработки к Teams. Он не требуется для приложений, которые содержат только вкладки. Этот пакет устанавливается в каталоге проекта (с помощью npm `devDependencies`).

Примечание.

После скачивания ngrok зарегистрируйтесь и установите authtoken.

Создание и запуск примера приложения Agile Poker

Осталось 4 мин

Перейдите к примеру приложения Agile Poker .
Клонируйте репозиторий Live Share SDK для тестирования примера приложения:
```
  git clone https://github.com/microsoft/live-share-sdk.git
```
Откройте окно терминала.
Выполните следующую команду, чтобы перейти в папку примера приложения Agile Poker:
```
cd live-share-sdk\samples\javascript\22.react-agile-poker
```
Выполните следующую команду, чтобы установить пакет зависимостей:
```
npm install
```
Выполните указанную ниже команду, чтобы запустить клиент и локальный сервер:
```
npm run start
```
Откроется новая вкладка браузера и http://localhost:3000 откроется игра Agile Poker.
Откройте новое окно терминала ngrok, чтобы создать туннель и развернуть приложение локально.
Выполните следующую команду, чтобы создать туннель. Пример приложения использует порт 3000:
```
ngrok http 3000--host-header=localhost
```
Создается туннель ngrok.

Настройка файла манифеста и отправка приложения

Осталось 3 мин

Необходимо настроить файл манифеста и отправить пакет manifest.zip в Teams.

Откройте файл manifest.json и обновите следующие сведения.
- Задайте значение "ID"Идентификатор приложения Майкрософт.
- Замените все вхождения <<BASE_URI_DOMAIN>> на полное доменное имя ngrok или devtunnel.
Create файл .zip со следующими файлами, которые находятся в папке Manifest:
- manifest.json
- outline.png
- color.png
Create собрание в Teams с несколькими выступающими и участниками.
Присоединитесь к собранию.
После начала собрания выберите Приложения.
Во всплывающем окне выберите Управление приложениями.
Выберите Отправить приложение.
Выберите файл .zip, созданный в папке Манифест , и нажмите кнопку Открыть.
Нажмите Добавить.
Назад на страницу сведений о собрании и выберите ПриложениеAgile Poker.>
Выберите Сохранить.

Приложение Agile Poker добавляется на боковую панель собраний Teams.