1
00:00:00,000 --> 00:00:04,376
[MUSIC]

2
00:00:04,376 --> 00:00:07,440
Hello, and welcome to Express Basics.

3
00:00:07,440 --> 00:00:12,397
I'm Andrew, a Treehouse teacher, lifelong
learner, and JavaScript developer, and

4
00:00:12,397 --> 00:00:17,180
I'm so excited to share with you
the power and simplicity of Express.

5
00:00:17,180 --> 00:00:20,355
Express is a web application framework for

6
00:00:20,355 --> 00:00:25,570
Node.js that allows you to rapidly
build dynamic web applications.

7
00:00:25,570 --> 00:00:28,930
Web applications have a lot of
commonalities between them.

8
00:00:28,930 --> 00:00:32,550
Commonalities in software
are called patterns.

9
00:00:32,550 --> 00:00:37,120
A web framework provides lots of
solutions for making web applications.

10
00:00:37,120 --> 00:00:39,880
The solutions can differ
from framework to framework.

11
00:00:39,880 --> 00:00:44,130
But the most common ones include,
templating for dynamic layouts and

12
00:00:44,130 --> 00:00:47,200
content, mapping URL's to content.

13
00:00:47,200 --> 00:00:50,480
URL mapping is often
referred to as routing.

14
00:00:50,480 --> 00:00:56,090
Processing input provided by users and
serving appropriate responses.

15
00:00:56,090 --> 00:01:00,877
Using a web framework allows you to
build your application quicker since you

16
00:01:00,877 --> 00:01:05,530
are not focusing on the mundane details
of developing a web application.

17
00:01:05,530 --> 00:01:09,127
Using a framework, allows you to
focus on the code that make sure your

18
00:01:09,127 --> 00:01:11,770
application is different
from someone else's.

19
00:01:11,770 --> 00:01:13,890
The difference between
your application and

20
00:01:13,890 --> 00:01:17,910
someone else's is often
called business logic.

21
00:01:17,910 --> 00:01:22,666
Knowing a web framework allows you
to jump into other codebases using

22
00:01:22,666 --> 00:01:26,200
the same framework and
get up and running quickly.

23
00:01:26,200 --> 00:01:30,010
The same goes for other developers
collaborating on your project.

24
00:01:30,010 --> 00:01:33,184
If they're already familiar
with the web framework,

25
00:01:33,184 --> 00:01:35,740
they can get to
the business logic quicker.

26
00:01:35,740 --> 00:01:40,171
The principles you will learn here
are transferable to other languages and

27
00:01:40,171 --> 00:01:41,020
frameworks.

28
00:01:41,020 --> 00:01:44,313
Python based Flask, Java based Spark, and

29
00:01:44,313 --> 00:01:48,770
Ruby based Sinatra all
have similar conventions.

30
00:01:48,770 --> 00:01:52,953
If you understand one of these frameworks,
you'll be able to get up and

31
00:01:52,953 --> 00:01:54,850
running with another quickly.

32
00:01:54,850 --> 00:01:58,910
You can learn all of these on Treehouse,
check the teacher's notes for links.

33
00:02:00,630 --> 00:02:06,650
In this course, we'll use Express to build
a personalized flash card application.

34
00:02:06,650 --> 00:02:12,030
The app accepts the name of the user and
it greets them.

35
00:02:12,030 --> 00:02:16,396
From the homepage you can launch
a flash card study session,

36
00:02:16,396 --> 00:02:20,890
the app will give you flash
cards in a random order.

37
00:02:20,890 --> 00:02:24,000
You can flip them front to back and
back again.

38
00:02:25,550 --> 00:02:28,700
Clicking Next shows the next card.

39
00:02:28,700 --> 00:02:32,190
Finally, a user can clear
their name from the site.

40
00:02:33,420 --> 00:02:36,730
While building this flash card app,
you'll learn the nuts and

41
00:02:36,730 --> 00:02:38,930
bolts to building any web application.

42
00:02:40,170 --> 00:02:43,495
This course will cover how
to install Express, and

43
00:02:43,495 --> 00:02:46,520
get a basic Hello World
application running.

44
00:02:46,520 --> 00:02:50,108
You'll learn to render HTML for
our application,

45
00:02:50,108 --> 00:02:52,700
we'll use the Pug template engine.

46
00:02:52,700 --> 00:02:56,408
Template engines let you
inject variables into HTML,

47
00:02:56,408 --> 00:03:00,500
use conditionals and
make your HTML more flexible.

48
00:03:00,500 --> 00:03:05,035
The principles you'll learn in Pug
are universal across over templates and

49
00:03:05,035 --> 00:03:06,200
engines.

50
00:03:06,200 --> 00:03:11,760
You'll also learn about routing, one of
the co-components of the web framework.

51
00:03:11,760 --> 00:03:18,010
Routing is how you specify what content is
to be returned based on the URL requested.

52
00:03:18,010 --> 00:03:22,266
The Express Static Server is how
Express loads styles, scripts,

53
00:03:22,266 --> 00:03:25,930
images and
other static files to the browser.

54
00:03:25,930 --> 00:03:29,830
Later on in this course,
we'll get this static server set up and

55
00:03:29,830 --> 00:03:32,700
when we do,
our app will look a lot better.

56
00:03:33,740 --> 00:03:37,460
Middleware is the other
core component of Express.

57
00:03:37,460 --> 00:03:41,787
If routing provides the pathways
through our app, middleware functions,

58
00:03:41,787 --> 00:03:46,830
our work is that craft the responses
to user requests on the way through.

59
00:03:46,830 --> 00:03:51,500
Finally, you'll use what you've learned
to finish building the flash card app.

60
00:03:51,500 --> 00:03:52,984
By the end of this course,

61
00:03:52,984 --> 00:03:56,761
you'll not only have a solid
understanding of how Express works,

62
00:03:56,761 --> 00:04:01,500
you'll also have a study aid reinforcing
your JavaScript and Express knowledge.

63
00:04:02,600 --> 00:04:05,400
We've got a lot of ground to cover so
let's get started.