Создание SMS-уведомлений с помощью AngularJS, Firebase и Twilio

Кристоффер Клемминг начинал с программирования кардиостимуляторов, а в итоге стал менеджером по продукту (PMM) в Google. На родине, в Стокгольме, Кристоффер был сосредоточен на написании кода. Когда он переехал через пруд работать в Google, код отошел на второй план. Но он все еще использовал свой программистский образ мышления на работе, не требующей такого интенсивного написания кода. «Программирование — это, по сути, образ мышления, позволяющий разбивать большие проблемы на мелкие части, каждую из которых можно логически решить, а затем собрать их обратно в единое целое», — говорит Кристоффер.

Использование AngularJS и Twilio помогло ему разобрать и собрать заново проблему, хорошо знакомую жителям района залива Сан-Франциско, — стояние в очереди. Простое текстовое сообщение может избавить от хлопот, связанных с необходимостью стоять в очереди в ожидании, когда назовут ваше имя. Компания Кристоффера, Waitwhile, позволяет таким предприятиям, как салоны красоты или рестораны, отправлять SMS ожидающим клиентам, когда они готовы их обслужить.

Это простое и мощное решение надоедливой проблемы. MVC также оказалось для Кристоффера надоедливой проблемой. И он решил ее с помощью AngularJS. «Признаюсь, я не эксперт в MVC-фреймворках, но я потратил много времени заранее на изучение того, какой технологический стек использовать, по сути пытаясь ответить на вопрос: *«какой самый перспективный способ создать приложение в 2015 году?»*.»

Он остановился на комбинации Twilio SMS, AngularJS, Firebase и Ionic. Кристоффер был удивлен тем, как быстро он смог приступить к работе после просмотра руководства на Watch and Code. Теперь он распространяет благую весть об AngularJS, показывая, как создавать SMS-уведомления с помощью AngularJS и Firebase.

Ознакомьтесь с его руководством ниже.

**Waitwhile – Создание SMS-оповещений для людей в очереди**

Waitwhile создан с использованием AngularJS и Firebase для хранения данных и аутентификации, а также полагается на Twilio для двусторонней текстовой переписки. В этом посте мы рассмотрим, как улучшить ваше клиентское приложение с помощью уведомлений в реальном времени, используя Twilio вместе с Zapier и Firebase.

*Примечание: этот пост предполагает, что у вас уже есть работающий экземпляр Firebase. Если нет, вот отличное 5-минутное руководство.*

После настройки приложения Firebase, вот как настроить отправку SMS с помощью Zapier и Twilio за восемь шагов:

**Шаг 1**: Настройте ваше приложение так, чтобы при необходимости отправить SMS оно создавало новый дочерний объект Firebase в новом дочернем узле (например, /sms/). Обязательно укажите номер телефона получателя в качестве атрибута в дочернем объекте SMS:

Вы также можете персонализировать SMS, добавив такие атрибуты, как имя получателя, отправителя или даже ссылки на медиафайлы. Убедитесь, что вы добавили хотя бы один объект Firebase в /sms/, чтобы Zapier смог распознать его позже.

**Шаг 2**: Создайте учетную запись Twilio. Вы получите «бесплатный номер», с которого будут отправляться ваши SMS через Twilio. Если вы хотите иметь возможность отправлять SMS на номера, отличные от вашего собственного, вам потребуется пополнить баланс Twilio. К счастью, каждое SMS стоит всего от $0,0075, и это определенно того стоит.

**Шаг 3**: Создайте бесплатную учетную запись Zapier. Она бесплатна до 100 «запов» (zaps) в месяц. Выберите «Create a new Zap», чтобы начать.

**Шаг 4**: В режиме редактирования Zap выберите Firebase в качестве триггера. Выберите «New item in Queue» в качестве настройки триггера. Это более надежно, чем запуск на основе добавления дочерней записи (Added Child Record), так как снижает риск дублирования записей и дает более детальный контроль.

*Примечание: после отправки дочерний объект SMS будет удален из Firebase, поэтому относитесь к этому пути как к временной очереди сообщений в Firebase. Если вы хотите хранить объект SMS в Firebase, вам также нужно будет записывать его по постоянному пути, например, /smsHistory/).*

**Шаг 5**: Выберите «Send SMS» от Twilio в качестве действия (Action).

**Шаг 6**: Добавьте ваш путь к SMS в Firebase (например, /sms/) в качестве «*Path to Data*». Zapier будет прослушивать этот путь на предмет любых новых событий, а затем мгновенно запускать действие Zap.

**Шаг 7**: Далее персонализируйте ваше SMS. Для полей Phone и Message нажмите *«Insert FB fields»*. Это загрузит ваши данные из Firebase из Шага 1 и позволит вам вставить соответствующие атрибуты. Здесь вы также можете добавить свой собственный текст.

**Шаг 8**: Во время тестирования убедитесь, что вы указали свой собственный номер телефона в поле *«To Number»*. Протестируйте Zap, чтобы убедиться, что вы его получили.

Нажмите *«Turn Zap On»*, и теперь все готово к работе!

Теперь, когда у вас настроены основы, вы можете сделать все интереснее, персонализировав объект SMS. Для Waitwhile я фактически генерирую целый атрибут «SMS text», который полностью персонализирован на основе взаимодействия с приложением.

Затем в Zapier просто вставьте атрибут «text» в качестве всего сообщения (Message). Это имеет дополнительное преимущество: менять текст SMS становится проще в обслуживании, так как вы можете делать это прямо в коде вашего приложения.

В Firebase вам нужно будет настроить правила безопасности, чтобы никто не мог злоупотреблять вашим сервисом для рассылки спама, а также проверить, что номера телефонов соответствуют международному формату (E.164), который требуется Twilio. Например, простой набор правил может выглядеть так:

О, и поскольку все ваши SMS будут отправляться с вашего бесплатного номера Twilio (если вы не обновите тариф), получатели могут попытаться позвонить на него. Чтобы решить эту проблему, вы можете запрограммировать собственную голосовую почту Twilio с помощью Twilio XML, которую синтетический голос зачитает вслух!

Twilio — невероятно гибкая и мощная платформа. Вместе с Zapier, который служит клеем для соединения различных API, вы можете создать продвинутые и надежные интеграции за считанные минуты. Waitwhile успешно отправил тысячи SMS-сообщений, используя Twilio вместе с Firebase и Zapier, и мы только начинаем!

Кристоффер будет рад узнать ваше мнение об этом руководстве. Оставьте комментарий ниже, напишите ему на christoffer@waitwhile.com или свяжитесь с ним в Twitter @waitwhile в любое время.