WEBVTT

1
00:00:00.380 --> 00:00:03.050
Now you have
the Heroku Toolbelt installed,

2
00:00:03.050 --> 00:00:06.210
it's now time to deploy our application.

3
00:00:06.210 --> 00:00:08.940
Let me show you what the application is.

4
00:00:11.100 --> 00:00:13.260
It's a simple HTTP server, but

5
00:00:13.260 --> 00:00:16.948
just says Hello World no
matter where you navigate to.

6
00:00:20.929 --> 00:00:24.170
Heroku users get to deploy applications.

7
00:00:24.170 --> 00:00:27.647
So if you haven't got your
application checked since the git,

8
00:00:27.647 --> 00:00:30.409
which you should have by now,
you need to do that.

9
00:00:30.409 --> 00:00:32.969
My application is already committed.

10
00:00:37.048 --> 00:00:42.430
Just committing your application to
git is not enough to deploy to Heroku.

11
00:00:42.430 --> 00:00:47.640
There's a couple of things you need to
do to prepare your app for deployment.

12
00:00:47.640 --> 00:00:50.580
Make sure you have a package.json file.

13
00:00:50.580 --> 00:00:54.610
Because Heroku doesn't know which version
of Node you've been developing for,

14
00:00:54.610 --> 00:00:59.740
you need to specify what version of
Node.js that Heroku will install and

15
00:00:59.740 --> 00:01:01.600
use for your application.

16
00:01:01.600 --> 00:01:05.370
You need to have a special file
at the root of your application

17
00:01:05.370 --> 00:01:09.020
that will let Heroku know
how to run your application.

18
00:01:09.020 --> 00:01:12.440
I'll go into more detail
about this file shortly.

19
00:01:12.440 --> 00:01:16.320
Then create the application on
Heroku using the Heroku Toolbelt.

20
00:01:16.320 --> 00:01:21.470
This will link your Heroku application
as a remote git repository too.

21
00:01:21.470 --> 00:01:26.460
Each Heroku application is stored in
virtual machine containers called dinos.

22
00:01:26.460 --> 00:01:29.050
Each dino has its own
configuration settings, for

23
00:01:29.050 --> 00:01:32.950
example, the port number that
it routes web traffic to.

24
00:01:32.950 --> 00:01:35.630
There's a way you can
programmatically access this, and

25
00:01:35.630 --> 00:01:37.430
I'll show you that in a minute.

26
00:01:37.430 --> 00:01:40.808
Let's first create a package.json file.

27
00:01:40.808 --> 00:01:45.948
We do this by using npm init.

28
00:01:45.948 --> 00:01:50.025
A package.json file helps manage
dependencies for your project,

29
00:01:50.025 --> 00:01:53.109
whether if it's an application or
an npm package.

30
00:02:02.509 --> 00:02:05.610
Now there's no dependencies for
this application.

31
00:02:05.610 --> 00:02:09.704
But there is one dependency that you don't
normally see in a package.json file,

32
00:02:09.704 --> 00:02:12.868
unless you're deploying it to Heroku,
and that's engines.

33
00:02:24.808 --> 00:02:29.292
The engines key is to tell Heroku
which version of node.js to use when

34
00:02:29.292 --> 00:02:31.730
running our application.

35
00:02:31.730 --> 00:02:36.163
As of this recording,
the latest long term support version of

36
00:02:36.163 --> 00:02:39.499
node.js is 4.2.4, so let's use that.

37
00:02:51.058 --> 00:02:55.219
Next we need to tell Heroku how
we need to run our application.

38
00:02:55.219 --> 00:02:58.799
We run our application with node app.js.

39
00:03:01.398 --> 00:03:05.598
Heroku uses a special file called
a procfile or a process file.

40
00:03:08.899 --> 00:03:12.050
A process is a running application.

41
00:03:12.050 --> 00:03:14.900
You can tell Heroku any
number of processes.

42
00:03:14.900 --> 00:03:19.560
In this case, you'll need at least one for
the web server.

43
00:03:19.560 --> 00:03:24.826
You first start with the name of
your process followed by a colon,

44
00:03:24.826 --> 00:03:28.479
then the command you
want the process to run.

45
00:03:32.438 --> 00:03:34.578
Let's commit our changes.

46
00:03:48.769 --> 00:03:52.995
Next, let's create
the application on Heroku.

47
00:03:52.995 --> 00:03:57.528
You'll need to log into Heroku if you
haven't already with Heroku log in.

48
00:04:01.589 --> 00:04:05.510
If you haven't used it before,
you may see a screen like this.

49
00:04:05.510 --> 00:04:06.519
Don't worry.

50
00:04:06.519 --> 00:04:09.258
Fill in your credentials,
and you should be logged in.

51
00:04:16.999 --> 00:04:21.140
Heroku Toolbelt is a command line
utility to help you manage your

52
00:04:21.140 --> 00:04:23.880
applications using commands.

53
00:04:23.880 --> 00:04:30.898
Type heroku help to see
a list of command topics.

54
00:04:34.158 --> 00:04:38.643
See, there's an apps topic,
used to manage applications, create and

55
00:04:38.643 --> 00:04:40.880
destroy them, for example.

56
00:04:40.880 --> 00:04:47.640
To see a list of commands in that
topic area, type heroku help apps.

57
00:04:47.640 --> 00:04:54.330
The first command is Heroku apps:create,
with an optional application name.

58
00:04:56.980 --> 00:05:00.750
If you don't include a name,
they'll generate one for you.

59
00:05:00.750 --> 00:05:05.860
The application name translates to a
subdomain to access your replication app.

60
00:05:05.860 --> 00:05:09.068
If you don't want something random,
choose something yourself.

61
00:05:13.629 --> 00:05:20.460
I choose helloworld-treehouse.

62
00:05:20.460 --> 00:05:23.060
Since I picked this name, no one else can.

63
00:05:23.060 --> 00:05:25.660
During the application creation process,

64
00:05:25.660 --> 00:05:31.630
Heroku adds a new remote repository to
your git repository on your local machine.

65
00:05:31.630 --> 00:05:36.140
An example of another remote
repository is a GitHub repository.

66
00:05:36.140 --> 00:05:38.490
This is typically called origin.

67
00:05:38.490 --> 00:05:44.680
When you do git push origin master,
it pushes everything from

68
00:05:44.680 --> 00:05:50.840
your master branch on your local machine
to the master branch on GitHub the origin.

69
00:05:50.840 --> 00:05:54.327
With Heroku,
it creates a remote called heroku.

70
00:05:54.327 --> 00:06:02.020
So to deploy to Heroku,
you can simply do git push, heroku master.

71
00:06:02.020 --> 00:06:07.038
But what you want to do before deploying
to Heroku is test that it runs locally.

72
00:06:11.778 --> 00:06:15.738
To do this,
you use the heroku local command.

73
00:06:19.698 --> 00:06:22.490
If you notice,
it says it's running on port 5000.

74
00:06:22.490 --> 00:06:26.960
However, our application
runs on port 1337.

75
00:06:26.960 --> 00:06:27.920
There is a disconnect.

76
00:06:30.390 --> 00:06:36.040
If you try and visit 5000,
it's not there, but 1337 is.

77
00:06:38.420 --> 00:06:42.160
Heroku expects that your application
coding will handle an environmental

78
00:06:42.160 --> 00:06:44.330
variable called port.

79
00:06:44.330 --> 00:06:49.320
An environment variable is a variable that
can be accessed by the process and used.

80
00:06:49.320 --> 00:06:52.504
Heroku local sets up the port
environment variable

81
00:06:52.504 --> 00:06:56.068
just like it does in the Heroku
live hosted environment.

82
00:06:59.367 --> 00:07:04.142
Just simply put process.env.port

83
00:07:04.142 --> 00:07:08.146
followed by the or operator and

84
00:07:08.146 --> 00:07:14.210
then the default port of your choosing.

85
00:07:14.210 --> 00:07:19.360
What this code does is it sets the port
to whatever the environment variable is.

86
00:07:20.650 --> 00:07:25.400
If there isn't one,
it will set it to 1337.

87
00:07:25.400 --> 00:07:30.180
If we terminate the process with Ctrl+C,
when we do heroku

88
00:07:31.420 --> 00:07:37.650
local now, it correctly runs at port 5000.

89
00:07:37.650 --> 00:07:41.640
If we kill this process
again with Ctrl+C and

90
00:07:41.640 --> 00:07:47.360
directly run the app with node app.js,
it will run

91
00:07:47.360 --> 00:07:53.850
on port 1337, since we're not running it
in an environment where the port is set.

92
00:07:53.850 --> 00:07:56.648
Finally, we can commit our changes.

93
00:08:09.587 --> 00:08:15.588
We can push them using
git push heroku master.

94
00:08:21.168 --> 00:08:23.980
It's now deployed on Heroku.

95
00:08:23.980 --> 00:08:25.510
If your code is on GitHub,

96
00:08:25.510 --> 00:08:28.490
you probably want to deal with
git push origin master right now.

97
00:08:29.560 --> 00:08:34.894
We can now visit our
applicationname.herokuapp.com or

98
00:08:34.894 --> 00:08:39.150
type heroku open to open
it up in a web browser.

99
00:08:41.210 --> 00:08:41.870
No!

100
00:08:41.870 --> 00:08:46.040
There is an error with our application,
and this is a common gotcha.

101
00:08:46.040 --> 00:08:50.977
It may work on your local environment,
but it may not work on Heroku.

102
00:08:50.977 --> 00:08:52.718
And the reason is this.

103
00:08:52.718 --> 00:08:55.321
Now, the reason it doesn't work on Heroku,
but

104
00:08:55.321 --> 00:08:59.510
it does on our local machine is
because we're using a hostname here.

105
00:08:59.510 --> 00:09:04.497
So let's just remove these because
hostname is actually optional, so

106
00:09:04.497 --> 00:09:10.243
it will still work on our local machine,
and in theory, it should work on Heroku.

107
00:09:10.243 --> 00:09:12.320
So let's save our file.

108
00:09:14.130 --> 00:09:20.840
And do git status, and
we've only modified our app so

109
00:09:20.840 --> 00:09:26.357
let's do git add, git commit -m "Removed

110
00:09:26.357 --> 00:09:31.300
hostname", git push heroku master.

111
00:09:37.519 --> 00:09:40.700
When we do heroku open now, it works.

112
00:09:40.700 --> 00:09:41.630
Cool.

113
00:09:41.630 --> 00:09:42.610
And that's it.

114
00:09:42.610 --> 00:09:43.380
For further reading,

115
00:09:43.380 --> 00:09:47.160
check out Getting Started with
Node.js on Heroku's Dev Center.