В этой статье:

Итак, вы закончили разработку нового блестящего приложения Zendesk с помощью Next.js и готовы поделиться своими достижениями. Что дальше? Пришло время развернуть и загрузить его в ваш экземпляр Zendesk Support. Это определенно звучит пугающе, но я могу заверить вас, что это не так. Мы находимся в финальной стадии игры, так что давайте приступим к работе.

Если вы еще не разработали свое приложение, не беспокойтесь, вы можете найти пошаговое руководство для части 1 здесь.

Развертывание в Heroku

Существует множество вариантов платформ для размещения вашего приложения. В этом пошаговом руководстве мы будем использовать Heroku. Поскольку Next.js может поддерживать внешний и внутренний интерфейс — независимо от того, является ли ваше приложение серверным или клиентским, Heroku позволяет вам развернуть ваше приложение и запустить серверы, если это необходимо.

Если у вас еще нет учетной записи Heroku, вы можете зарегистрировать ее здесь.

После того, как вы войдете в свою учетную запись, на панели инструментов вы найдете кнопку Создать. Когда вы нажмете на него, появится раскрывающийся список, и вам нужно нажать Новое приложение.

Введите имя для своего приложения › Выберите свой регион › Создать приложение

Затем пришло время настроить развертывание для вашего приложения. В этой части пошагового руководства мы собираемся выбрать Github в качестве метода развертывания. Вам понадобится доступ к вашему Github и репозиторию. Затем у вас будет возможность выполнять автоматическое развертывание из вашего GitHub (это означает, что каждый раз, когда вы сливаетесь с основной веткой, оно будет развертываться) или ручное развертывание.

Затем мы хотим подключить Heroku к Github, а точнее к репозиторию для вашего приложения.

Настройте автоматическое развертывание с помощью Github

Преимущество настройки автоматического развертывания заключается в том, что у вас всегда будут самые последние и лучшие из вашего приложения, размещенные в режиме реального времени. Не нужно обязательно запускать сборку и развертывать ее. Обо всем позаботятся за вас, и все, что вам нужно, это слиться с вашей основной веткой.

К счастью, развертывание Heroku по умолчанию выполняется автоматически с вашим Github. После подключения ваша установка будет автоматически развертываться после каждого слияния с main.

Настройка развертывания вручную

Если вы не хотите, чтобы Heroku автоматически развертывался для вас, есть возможность настроить развертывание вручную. Вам нужно просто щелкнуть Отключить автоматическое развертывание. Затем каждый раз, когда вы были готовы к развертыванию, вы должны были развернуть ветвь в разделе "Развертывание вручную", как показано ниже.

Загрузка вашего приложения в Zendesk

Теперь, когда мы успешно развернули наше приложение, пришло время загрузить его в Zendesk и запустить в работу.

Добавление URL-адреса развернутого приложения

Сначала нам нужно внести одно небольшое изменение в кодовую базу нашего приложения, чтобы загрузить его. Помните, как мы указывали местоположение в нашем манифесте на localhost, как показано ниже?

Однако это было на этапах разработки и тестирования, и теперь мы готовы к производству. Итак, мы собираемся взять наше развернутое приложение (URL-адрес, указанный при просмотре вашего приложения через Heroku) и заменить им URL-адрес localhost. Итак, у вас должно быть что-то вроде этого:

Не забудьте указать местоположение приложения в конце URL-адреса! Heroku не добавит это за вас. Вам нужно будет определить это самостоятельно.

Как только мы это сделаем, мы сможем загрузить наше приложение Zendesk как частное приложение. Если вы заинтересованы в изучении процесса загрузки и утверждения вашего приложения для Marketplace, вы можете узнать больше об этом здесь.

Загрузка частного приложения

На панели навигации вашего экземпляра Zendesk вы собираетесь перейти к Admin › Apps › Manage.

Затем вы нажмете «Загрузить частное приложение», после чего вы попадете на страницу загрузки приложения, как показано ниже.

Как видите, файл приложения можно загрузить только в виде zip-файла. Вам нужно обязательно сжать его заранее. Также обратите внимание, что мы толькозагружаем сам каталог приложений Zendesk, а не ваше приложение Next. Это связано с тем, что мы уже развернули приложение Next и добавили URL-адрес в наш манифест. Наше приложение будет обращаться к развернутому приложению после запуска, чтобы получить доступ к функциям вашего приложения.

После того, как вы предоставили свое приложение, добавили файл и нажали кнопку «Загрузить», вы должны увидеть его в разделах Установленные в данный момент и Частные приложения в разделе Мои приложения. .

Теперь вы сможете успешно запустить свое приложение из назначенного места! Вы не только разработали приложение Zendesk с помощью Next.js, но также успешно развернули и загрузили его в свой экземпляр Zendesk. Поздравляю! 🥳