Ionic Hub — собираем и публикуем приложение в сторы без знаний программирования

Хочу рассказать про софт, который будет полезен в работе как разработчикам, так и основателям проектов, которые планируют заказать приложение. Ionic Hub позволяет собирать мобильные и веб-приложения написанные на Ionic.Framework. В этой статье я расскажу, чем так хорош Ionic, и как он может помочь вам.

Мы в Bright Mobile используем Ionic в первую очередь ради UI компонентов. Если говорить проще — можно собрать интерфейс вполне приемлемого вида без участия дизайнера, а как следствие и верстальщика, сэкономив на этом до 30% бюджета. Посмотреть на заготовки можно разделе UI Components, где размещено множество типов компонентов.

Точно так же можно собрать и всё остальное: поля ввода, табличные формы, например, для календарей, а также любые другие инструменты интерфейса. Всё легко встраивается на один из кроссплатформенных языков: Angular, JS, React, Vue и малораспространённом Stencil. Одним нажатием кнопки «copy» можно скопировать нужный код: даже выделять ничего не нужно.

Затем, когда программист всё это дело вставит в продукт и запргораммирует логику, готовое приложение нужно будет собрать в веб-версию или мобильное приложение. Нередко при прямом обращении в студию программист собирает всё самостоятельно: берёт исходники, загружает их и делает apk для Android. А у iOS ещё и нюанс: его можно собрать только на самом айосе, и если на своём Маке я могу это делать без проблем, то на ПК с виндой, как ни тресни, iOS не собрать и не залить в AppStore.

Именно в такие моменты на помощь приходит Ionic Hub: он позволяет делать приложения на iOS разработчикам, которые пользуются Windows, а также даёт возможность основателям в любой момент времени собрать рабочее приложение даже при отсутствии навыков программирования.

Сделаю краткий обзор сервиса и расскажу, какие его инструменты используем в работе мы.

У меня всегда очень много сборок: только для теста за последний месяц я собрал порядка 25 штук. А чтобы собрать iOS нужно потратить целый час ожидания: понятно, что компьютер стоит и делает сборку в фоне, позволяя программисту заниматься другими делами, но даже в этом случае требуется куча ручных операций, которые отвлекают от более важных дел и заставляют тратить время зря.

Преимущество Ionic Hub в том, что он позволяет автоматизировать подобные мелочи: один раз подключившись к гиту, можно собирать процесс просто по кнопке. Это может делать менеджер проекта, если речь идёт о студии, может делать и сам владелец: пересобрать приложение или сделать его веб-версию, чтобы проверить работу программиста в любой момент времени, хоть ночью.

Теперь пройдём по ключевым разделам сервиса.

Apps

В этом разделе показываются добавленные нами приложения.

Для каждого приложения есть несколько подразделов.

Settings – общие настройки проекта (General), подключение к GIT (можно подключить 4 сервиса). Проект, выложенный на Git, автоматически подтягивает коммиты на сборщик. Получается, что можно целиком автоматизировать всю сборку и при апдейте проекта, т.е. при заливе в указанную ветку очередного коммита вы будете получать уже полностью собранное приложение.

Автоматизировать процесс можно вплоть до того, что даже не потребуется нажимать кнопку: нужно будет только зайти через полчаса и скачать сборку мобильного приложения для тестирования.

Web Preview – новая классная фича, которая появилась недавно: с её помощью можно смотреть, как выглядит приложение с мобильного устройства через веб эмулятор.

Вот так, например, выглядит одно из приложений, которое сейчас у нас в разработке. Причём, ссылку можно расшарить и демонстрировать заказчику. Это особенно удобно в случае iOS — не нужно подклчать все UDID в Devices аккаунта разработчика и делать AdHoc провижен.

Commits

При добавлении проектов мы подключаем GIT, сюда подтягиваются все коммиты. При нажатии на них происходит переход Bitbucket (или другой выбранный GIT). Каждый коммит доступен для просмотра изменений и апдейтов.

Build

Раздел, которым пользуются при ручной сборке. Так что если нужна какая-то индивидуальная сборка, жмите «new build», выберите коммит, который хотите собирать и на чём собираете: разные версии XCode iOS, Андроид или Веб. Затем, в зависимости от того, что вы выбрали, определите тип билда.

Например, для айоса это либо уже отправка в App Store, либо Ad Hoc для тестирования продукта на своём устройстве, либо dev-сборка. Нужно так же выбрать связку ключей.

В случае iOS это Provision и сертификат p12. Соответственно, заносится и пароль от него, чтобы автоматически подписывать мобильное приложение.

При выборе Android только 2 подпункта: debug и релизная версии. Для второй точно так же требуется связка ключей для подписи приложения.

Certificates

В этом разделе создаются профили для подписей: вносится имя, тип (production/development), добавляются связку ключей – сразу и на Android, и на iOS. Для них добавляются ключи подписей: на Андроид – Alias и Keystore, с паролями для iOS и сертификат для Provision.

Automations

Вот этот пункт мне нужен довольно часто: здесь я активирую создание автоматических сборок. Причём, можно сразу так же автоматически отправить приложение в стор, занеся данные developer-аккаунта.

Ну и теперь ложка дёгтя. Сервис достаточно дорогое удовольствие. Два профиля стоят $120 в мес. Окупается в экономии на часах программиста, если делаете более 10 сборок в месяц под одной учёткой. Выгодно будет студиям, типа нашей, которые используют стек ionic + JS-фреймворк, либо основателям на этапе тестирования и внедрения очередной версии продукта.

Больше обзоров можно увидеть на моём YouTube.