Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
See an overview of the small JavaScript application you'll build.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
Hey everyone, Dave here.
0:04
Practice is a good thing.
0:06
It helps make one event last longer.
0:08
It also helps you become a faster and
better developer.
0:11
So let's practice some basic JavaScript
to make sure your knowledge sticks.
0:14
This practice session covers JavaScript
variables simple input and output and
0:18
some basic string techniques.
0:22
It's a good follow-up to the second
part of the JavaScript basics course.
0:24
If you haven't taken that yet and
0:28
find this practice session too difficult,
then take that course first.
0:29
I've added a link in the teacher's notes.
0:33
For this practice session I'm going to
ask you to build a small JavaScript
0:36
application.
0:39
Let me show you the goal.
0:41
Your program should open
two prompt dialogues.
0:42
It doesn't really matter
what questions you ask.
0:45
I just asked for a first and a last name.
0:47
After providing two pieces of input,
an alert dialogue appears with a message.
0:52
The string Dave McFarland
is 14 characters long.
0:58
It's pretty simple, but combined
several fundamental programming steps.
1:01
I've attached a work space to this video.
1:05
Which includes some starter files and
instructions.
1:07
Open the work space, or
1:10
download the project files if you
wanna use your own text editor.
1:11
There are two files,
one HTML and one JavaScript.
1:14
Open the Practice.js file and
1:19
you'll see six instructions
listed as JavaScript comments.
1:21
Here's what you should do.
1:25
First attach the JavaScript
file to the index.HTML file.
1:27
Afterall the program wont work at
all unless the webpage loads it.
1:30
Next, use the prompt dialog box
to capture input from the user.
1:34
Store the results in a variable.
1:39
You're gonna do this one more time
to capture a second input and
1:41
create a second variable.
1:45
Now create a third variable that combines
upper case versions of the two variables.
1:47
You'll need to use a string method to get
an uppercase version of each variable and
1:53
string concatenation to combine them.
1:57
I've linked to some videos in the notes
below that cover these topics,
2:00
in case you wanna brush up on them before
trying to program the solution yourself.
2:03
However, I'd recommend just go for it.
2:08
Try it now, and then if you're stuck,
check out those videos.
2:10
For the fifth step, create one more
variable that stores a number.
2:14
The number of characters
in that third variable.
2:18
Now, there's a particular JavaScript
string property to help with this task.
2:20
Finally, add a popup alert dialog,
using the browser's alert method.
2:25
The dialog should display a message
that includes the string you made for
2:30
the third variable and
the total number of characters.
2:34
For example, something like, the string
Sally Forth is 11 characters long.
2:37
If you wanna do some quick study
before tackling this practice session,
2:42
check out the teacher's notes for
links to videos.
2:45
But I think you should try
it before looking at those.
2:48
If you're ready to go, go for it.
2:50
Program your solution, and
I'll show you mine in the next video.
2:52
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up