メニュー

Expand
Rate this page:

Thanks for rating this page!

We are always striving to improve our documentation quality, and your feedback is valuable to us. How could this documentation serve you better?

Set up your Node.js and Express Development Environment

In this guide we’ll cover how to set up your Node.js development environment for an Express project. We’ll also walk through some helpful tools that we recommend for all Node.js applications that use Twilio: ngrok and the Twilio Node.js SDK

Node.jsをインストールする

ご使用のオペレーティングシステムによって、Node.jsのインストール方法は異なります。

OperatingSystem Instructions
OS X OS X上でNode.jsをインストールするもっとも簡単な方法は、nodejs.orgの公式インストーラーを使用する方法です。 もしお望みの場合は、Homebrewも使用できます。
Windows Windows上でNode.jsをインストールする最も簡単な方法は、nodejs.orgの公式インストーラーを使用する方法です。 もしお望みの場合は、Chocolateyも使用できます。
Linux Node.jsをインストールするための正確な手順は、ディストリビューションによって異なります。 お使いのディストリビューションでの手順をこちらでご確認ください

Install a Text Editor or IDE

Before we can start our Node.js project we’ll need a place to write our code.

If you already have a code writing tool of choice, you can stick with it for developing your Node.js application. If you're looking for something new, we recommend trying out a few options:

  • Sublime Text is a text editor popular for its ease of use and extensibility. Start here if you’re eager to get coding and don’t think you’ll want a lot of frills in your development environment.
  • Visual Studio CodeはJavaScriptの記述に便利な統合開発環境 (IDE = Integrated Development Environment) です。 セットアップに多少時間はかかりますが、すでにインストール済みの便利なツールが比較的多く含まれています。
  • Node.js Tools for Visual Studioは、すでにVisual Studioユーザーのあなたには最適な選択肢です。
  • Vimは上級ユーザーの間で不動の人気を誇るテキスト・エディターです。

If you’re new to programming, we recommend giving Sublime Text and Visual Studio Code each a try before you settle on your favorite. Many developers here at Twilio are using either - or both!

Start a New Node.js Project with "npm init"

新規Node.jsプロジェクトを始めるには、まず npm init を実行してプロジェクト用に新規の package.json ファイルを作成する必要があります。

開発環境に新しい空のディレクトリーを作成して、 npm init を実行します。 プロジェクトについての基本的な質問にいくつか回答し、それが済めばnpmによって新規の package.json ファイルが作成されます。

01057-abaker:myproject abaker$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install <pkg> --save` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
name: (myproject)
version: (1.0.0)
description: A sample Express + Twilio project
entry point: (index.js)
test command:
git repository: defunkt/myproject
keywords:
author: Jane Doe
license: (ISC)
About to write to /Users/jdoe/myproject/package.json:

{
  "name": "myproject",
  "version": "1.0.0",
  "description": "A sample Express + Twilio project",
  "main": "index.js",
  "dependencies": {},
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/defunkt/myproject.git"
  },
  "author": "Jane Doe",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/defunkt/myproject/issues"
  },
  "homepage": "https://github.com/defunkt/myproject#readme"
}


Is this ok? (yes)

これで、Node.jsの依存関係をインストールする準備ができました。

Install Express.js and the Twilio Node.js SDK

We’re almost ready to start writing our Express web application, but first we need to install the Express package using npm.

# Use npm to install the express and twilio packages
$ npm install --save express twilio
myproject@1.0.0 /Users/abaker/myproject
├── express@4.14.0
└── twilio@3.0.0

Node.jsはnpmを使用して依存関係を管理します。 開発環境にExpressとTwilio SDKを組み込むために必要なコマンドは npm install --save express twilio です。

--save フラグは、npmにExpressとTwilioのパッケージをプロジェクトのpackage.jsonファイル内の dependencies オブジェクトに追加するよう指示するものです。 将来、これら同一のパッケージを再度インストールしたい場合(たとえば本番サーバーなどで)は、 npm install を実行するだけで済みます。

Create a Simple Express.js Application

シンプルなExpressアプリケーションを作成することで、開発環境が正しく構成されているか確認できます。 Expressのドキュメントから10行からなるコード例をコピーし、index.jsという名前の新規ファイルにペーストします。

var express = require('express');
var app = express();

app.get('/', function (req, res) {
  res.send('Hello World!');
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

続いて、 node index.js コマンドによって新しいExpressアプリケーションの実行を試します。 http://localhost:3000をブラウザーで開くと、“Hello World!” のレスポンスが表示されるはずです。

ご注意: 開発環境でVagrantのような仮想マシンをご使用の場合、localhostのホスト名でExpressアプリケーションが表示されない可能性があります。 下記のngrokの節で、簡単にこれを解決する方法を見ていきましょう。

Install ngrok for Local Development

サンプルExpressアプリケーションの "Hello World!" メッセージがご覧いただけたなら、開発環境の準備は完了です。 しかし、大部分のTwilioプロジェクトにはもうひとつ、ngrokという便利ツールをインストールする必要があります。

Most Twilio services use webhooks to communicate with your application. When Twilio receives an incoming phone call, for example, it reaches out to a URL in your application for instructions on how to handle the call.

ご自身の開発環境でExpressアプリケーションに取り組む際、アプリケーションは同一のコンピューター上の他のプログラム以外からアクセスできないため、Twilioと通信することができません。

Ngrok is our favorite tool for solving this problem. Once started, it provides a unique URL on the ngrok.io domain which will forward incoming requests to your local development environment.

まずは、ngrokのダウンロード・ページにアクセスして、お使いのオペレーティング・システム向けのバイナリーをダウンロードしましょう。 https://ngrok.com/download

Once downloaded, make sure your Express application is running and then start ngrok using this command: "./ngrok http 3000". You should see output similar to this:

ngrokの画面

Look at the “Forwarding” line to see your unique Ngrok domain name (ours is "aaf29606.ngrok.io") and then point your browser at that domain name.

すべて問題がなければ、新しいngrokのURLから表示されたExpressアプリケーションの "Hello World!" メッセージがご覧いただけるはずです。

Twilioアプリケーション上で作業していて、WebhookのURLが必要になったときはいつでも、ngrokを使用してこのようなパブリックにアクセスできるURLを取得してください。

Andrew Baker Jose Oliveros Agustin Camino David Prothero Samuel Mendes Paul Kamp Kevin Whinnery Kat King
Rate this page:

ヘルプが必要ですか?

誰しもが一度は考える「コーディングって難しい」。そんな時は、お問い合わせフォームから質問してください。 または、Stack Overflow でTwilioタグのついた情報から欲しいものを探してみましょう。