Skip to content

Commit

Permalink
Update readme file
Browse files Browse the repository at this point in the history
  • Loading branch information
rojasTob committed May 20, 2020
1 parent 542b43f commit 1bcd8ab
Showing 1 changed file with 60 additions and 24 deletions.
84 changes: 60 additions & 24 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,25 @@

> We are currently in the process of updating this sample template. If you are encountering any issues with the sample, please open an issue at [github.com/twilio-labs/code-exchange/issues](https://github.com/twilio-labs/code-exchange/issues) and we'll try to help you.
This application should give you a ready-made starting point for writing your
own voice apps with Twilio Client. Before we begin, we need to collect
all the config values we need to run the application:
## About

This application should give you a ready-made starting point for writing your own voice apps with Twilio Client. This application is built in Node.

Implementations in other languages:

| .NET | Java | Python | PHP | Ruby |
| :--- | :--- | :----- | :-- | :--- |
| [Done](https://github.com/TwilioDevEd/client-quickstart-csharp) | [Done](https://github.com/TwilioDevEd/client-quickstart-java) | [Done](https://github.com/TwilioDevEd/client-quickstart-python) | [Done](https://github.com/TwilioDevEd/client-quickstart-php) | [Done](https://github.com/TwilioDevEd/client-quickstart-ruby) |

## Set Up

### Requirements

- [Nodejs](https://nodejs.org/) v10 or v12

### Twilio Account Settings

Before we begin, we need to collect all the config values we need to run the application.

| Config Value | Description |
| :------------- |:------------- |
Expand All @@ -18,51 +34,46 @@ all the config values we need to run the application:
`TWILIO_CALLER_ID` | A Twilio phone number in [E.164 format](https://en.wikipedia.org/wiki/E.164) - you can [get one here](https://www.twilio.com/console/phone-numbers/incoming)
`TWILIO_API_KEY` / `TWILIO_API_SECRET` | Your REST API Key information needed to create an [Access Token](https://www.twilio.com/docs/iam/access-tokens) - create [one here](https://www.twilio.com/console/project/api-keys).

## Setting Up The Node.js Application
### Local development

1. First clone this repository and cd into it:
```bash
git clone https://github.com/TwilioDevEd/client-quickstart-node.git
cd client-quickstart-node
```

1. Create a configuration file for your application:
2. Create a configuration file for your application and edit the `.env` file.

```bash
cp .env.example .env
```

1. Edit `.env` with the five configuration parameters we gathered from above.
See [Twilio Account Settings](#twilio-account-settings) to locate the necessary environment variables.

1. Next, we need to install our dependencies from npm:
3. Install the dependencies.

```bash
npm install
```

1. Now we should be all set! Run the application using `npm`.
4. Launch local development web server.

```bash
npm start
```

Your application should now be running at http://localhost:3000.
Leave the server running and continue on in another command window.

1. [Download and install ngrok](https://ngrok.com/download)
6. Navigate to [http://localhost:3000](http://localhost:3000)

1. Run ngrok:
7. Expose your application to the wider internet using [ngrok](https://ngrok.com/download). You can click [here](https://www.twilio.com/blog/2015/09/6-awesome-reasons-to-use-ngrok-when-testing-webhooks.html) for more details. This step **is important** because the application won't work as expected if you run it through localhost.

```bash
ngrok http 3000
```

1. When ngrok starts up, it will assign a unique URL to your tunnel.
8. When ngrok starts up, it will assign a unique URL to your tunnel.
It might be something like `https://asdf456.ngrok.io`. Take note of this.

> [Learn 6 awesome reasons why to use ngrok](https://www.twilio.com/blog/2015/09/6-awesome-reasons-to-use-ngrok-when-testing-webhooks.html).
1. [Configure your TwiML app](https://www.twilio.com/console/voice/twiml/apps)'s
9. [Configure your TwiML app](https://www.twilio.com/console/voice/twiml/apps)'s
Voice "REQUEST URL" to be your ngrok URL plus `/voice`. For example:

![screenshot of twiml app](https://s3.amazonaws.com/com.twilio.prod.twilio-docs/images/TwilioClientRequestUrl.original.png)
Expand All @@ -72,20 +83,45 @@ Voice "REQUEST URL" to be your ngrok URL plus `/voice`. For example:
WebRTC enabled browsers, so Edge and Internet Explorer will not work for
testing. We'd recommend Google Chrome or Mozilla Firefox instead.

> **Note:** You **must** use the https URL, otherwise some browsers will block
> **Note:** You **must** use the https URL, otherwise some browsers will block
microphone access.

![screenshot of chat app](https://s3.amazonaws.com/com.twilio.prod.twilio-docs/images/TwilioClientQuickstart.original.png)

### Run tests
That's it!

### Tests

To execute tests, run the following command in the project directory:

```bash
npm test
```

## Meta
### Cloud deployment

Additionally to trying out this application locally, you can deploy it to a variety of host services. Here is a small selection of them.

Please be aware that some of these might charge you for the usage or might make the source code for this application visible to the public. When in doubt research the respective hosting service first.

| Service | |
| :-------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Heroku](https://www.heroku.com/) | [![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy) |

## Resources

- The CodeExchange repository can be found [here](https://github.com/twilio-labs/code-exchange/).

## Contributing

This template is open source and welcomes contributions. All contributions are subject to our [Code of Conduct](https://github.com/twilio-labs/.github/blob/master/CODE_OF_CONDUCT.md).

## License

[MIT](http://www.opensource.org/licenses/mit-license.html)

## Disclaimer

No warranty expressed or implied. Software is as is.

* No warranty expressed or implied. Software is as is. Diggity.
* The CodeExchange repository can be found [here](https://github.com/twilio-labs/code-exchange/).
* [MIT License](http://www.opensource.org/licenses/mit-license.html)
* Lovingly crafted by Twilio Developer Education.
[twilio]: https://www.twilio.com

0 comments on commit 1bcd8ab

Please sign in to comment.