By 
Background
Twilio offers a wide range of phone related features. Among them, Answering Machine Detection or “AMD” allows you to identify the incoming caller and adjust the call flow accordingly. With AMD, you can determine whether an outgoing call issued from a voice API was answered by a human, an answering machine, or a fax machine. Based on this information, you can update the call and trigger different actions after the call ends.
This tutorial will show you not only the basic features of AMD, but also how to create a delivery reminder system with it.
Goal
By the end of this tutorial, you will learn the basic features of AMD and have a delivery reminder system built using Node.js. This system plays a reminder message if a human answers the call, but if the call is answered by an answering machine it also sends an SMS message like so: …
背景
Twilioは電話に関する機能を多岐にわたって提供しています。留守番電話検出機能(Answer Machine Detection、以下「AMD」)もその 1つです。AMDは、着信側を特定し、それに合わせて通話フローを調整できる機能です。AMDを使えば、音声APIからの着信を人間、留守番電話、ファックスのどちらが対応したかを判断できます。この情報に基づいた通話の更新処理や通話終了後の処理の分岐を実装できます。
このチュートリアルでは、AMDの基本機能や設定方法だけでなく、AMDを使った配達リマインドシステムの作成方法までを紹介します。
目標
このチュートリアルを最後まで進めると、AMDの基本機能、設定方法を実践的に学べるとともに、Node.jsを使った配達リマインドシステムを作成できます。この配達リマインドシステムでは、着信者が電話に出た場合は音声リマインドを、留守電だった場合は留守電メッセージを残したうえで以下のようなSMSメッセージを送信します。
以下の処理フローを実装します。
想定される技術知識
本稿では以下の知識を想定しています。
- JavaScriptの基礎知識
- Node.jsの基礎知識
必要なツール
- 安定バージョンのNode.jsとnpm。
- Twilioアカウント。アカウント作成方法はHelp Centerの「Twilioアカウントの作成方法」を参照してください。
- 電話とSMSが発信できるTwilioの電話番号。電話番号の取得方法はTwilio Docsの「最初のTwilio電話番号を取得」を参照してください。
- インストール、アカウント登録、A …
Background
Twilio Conversations is an API that creates a virtual space for users to communicate across multiple channels. Twilio Conversations supports multiple chat platforms for cross and multi-channel communication. For example, a chat started via SMS can be continued via MMS, WhatsApp or web chat. Using the API, you can create conversations, add users, and monitor events during conversations via webhooks, making it possible to implement a communication method tailored to your needs.
In this tutorial, I will show you how to create a simple web chat app with Twilio Conversations and Vue.js.
This tutorial is divided into 2 parts: part 1 covers the project setup and back end development, while part 2 covers the front end development and testing of the app.
Part 2: Creating a web chat app with Twilio Conversations and Vue.js (Part 2)
Goal
By the end of this tutorial, you will be able to learn …
This tutorial is divided into 2 parts: part 1 covers the project setup and back end development, while part 2 covers the front end development and testing of the app.
Part 1: Creating a web chat app with Twilio Conversations and Vue.js (Part 1)
In part 1, we set up the project and built the back end of the below chat app. Let’s continue and build the front end.
Building the front end
The front end of the chat app is built using Vue components. The components used in this chat app with a .vue file extension are called single file components. Single file components combine HTML templates, JavaScript logic, and CSS styling into a single file.
Let’s create single file components for the chat app. Open a new window in the terminal.
Delete the HelloWorld.vue component that the Vue CLI created by default, and create files named Chat.vue …
本稿は前編と後編に分かれており、前編ではプロジェクトのセットアップからバックエンドの構築までを、後編ではフロントエンド側の構築とアプリケーションの動作検証についてご紹介いたします。
フロントエンドを構築する
フロントエンド側はVueコンポーネントを使って構築します。このチャットアプリケーションで使用するコンポーネントはシングルファイルコンポーネント(Single file component)と呼ばれる、.vue拡張子のコンポーネントです。シングルファイルコンポーネントを使うと、HTMLテンプレート、JavaScriptのロジック、CSSのスタイリングを一つのファイルにまとめることができます。
まずはVue CLIがデフォルトで作成するHelloWorld.vueコンポーネントを削除し、Chat.vueとConversation.vueコンポーネントを作成します。ターミナルで新しいウィンドウを開き、プロジェクトのルートディレクトリから以下のコマンドを実行してください。
cd src/components
rm HelloWorld.vue
touch Chat.vue Conversation.vue
Chat.vueを作成する
まずは、チャット画面全体を構成するコンポーネントとなるChat.vueを構築します。
シングルファイルコンポーネントは<template>、<script>、< …
背景
Twilio Conversationsは仮想空間を作成し複数のチャネルでユーザー間のコミュニケーションを実現できる機能です。Twilio Conversationsは複数のチャットプラットフォームに対応しており、クロス、マルチチャネルでのコミュニケーションをサポートします。たとえば、SMSで始めたチャットをMMS、WhatsAppやウェブチャットで続行することができます。また、APIを使って会話の作成やユーザーの追加をしたり、Webhookによる会話中のさまざまなイベントのモニタリングをすることで、あなたのニーズに合わせたコミュニケーション方法を実装できます。
このチュートリアルでは、Twilio ConversationsとVue.jsでシンプルなウェブチャットアプリケーションを作る方法をご紹介します。
本稿は前編と後編に分かれており、前編ではプロジェクトのセットアップからバックエンドの構築までを、後編ではフロントエンド側の構築と動作検証についてご紹介いたします。
目標
このチュートリアルを最後まで進めると、Twilio ConversationsとTwilio Conversations JavaScriptクライアントライブラリの使い方を実践的に学べるとともに、以下のようなVue.jsを使ったシンプルなウェブチャットアプリケーションを作成できます。
想定される技術知識
本稿では以下の知識を想定しています。
- JavaSc …
Ahoy! I’m very excited to be joining Developer Voices at Twilio.
Have you ever tried learning a second language? Most of us have, perhaps in the form of a mandatory subject at school or out of pure passion. Growing up in a bicultural Australian-Japanese household and having lived in both countries, I have observed both the joy and many headaches of learning languages.
Becoming fluent in both languages is hard enough. But you’re not done there. There are many aspects of learning languages that you need to take in, and lifelong learning is essential. Keeping both Japanese and English skills sharp, understanding and embracing cultural differences, forming your identity across starkly different cultures and traditions, and the list goes on.
On moving to Australia from Japan, at first it was overwhelming to be completely immersed in another language. Thanks to my family, friends and teachers who were incredibly patient and …
英語版はこちらでご覧いただけます。
Introducing JavaScript Developer of Technical Content, Stephenie Minami Nakajima
Ahoy! はじめまして、TwilioのDeveloper VoicesチームにDeveloper of Technical Contentとして入社した中嶋ステファニーみなみです。
突然ですが、あなたは第二言語を学んだことはありますか?多くの人は学校の必修科目として、あるいは純粋な興味から勉強したことがあるのではないでしょうか。私個人としては、オーストラリアと日本の2つの文化を持つ家庭で育ち、両国に住んだ経験から、言語を学ぶことの楽しさと難しさの両方を実感してきました。
二つの言語を話せるようになるまでは簡単な道のりではありません。 いざ話せるようになっても、それで終わりではありません。語学学習には様々な側面があり、生涯学習が欠かせません。 両方の言語のスキルを磨き続けること、文化の違いを理解して受け入れること、文化や伝統が大きく異なる中で自分のアイデンティティを形成することなど、直面するハードルは数えればきりがありません。
私自身も日本からオーストラリアに移住したころ、最初は完全に別の言語に浸る環境に圧倒されました。ですが、家族や友人、先生方からの温かいサポートのおかげで会話を楽しみ、人とのつながりを深め、最終的には失敗することへの恐れを克服し、新しい環境と言語に深い絆を築くことができるようになりました。
このようなチャレンジは様々な形で、そしてしばしば思いがけない形で報われ …