Learn to Code Special! | 30% off ALL ACCESS to One Month ๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰


What is JavaScript?

Getting Started ยท Lesson 3 ยท

- Is a reality where you sign up
for a one-month JavaScript course,
but you actually don't know what JavaScript is,
and that's fine that's why we are here.
Maybe you heard it was cool,
or somebody told you, you should learn it,
or it was just I don't know I'm sale who the hell knows.
One month JavaScript is clearly where we are,
but what is JavaScript?
So in this video let me just walk you through some
context about the language that we're learning,
and I think this will be important to you
even if you are coding JavaScript already,
I just want to contextualize exactly
what we're talking about,
so what does JavaScript?
And why do you, I care?
Okay, programming.
JavaScript is a programming language.
Technically this is where stuff gets way geeky.
Technically it's a scripting language,
but for all intents and purposes like who cares,
Like it's programming let's just call
it a programming language, right.
We just wanna do something with this,
and it's code that we can do,
and it's code that we can use to solve a problem. Right?
That's the important thing.
This is something that I teach
in my one month programming
from non-programmers course is thinking about using code
as a tool to solve problems, yeah.
Cool, so programming the definition is a set
of instructions used to solve a problem,
and I realize that's kind of dry and kind of boring sounding
so just to kind of like apply that to our lives think
about you solve problems all the time in your life.
You have to make coffee, right?
There's a set of instructions where you're like
I want coffee I'm going to press buttons,
and get coffee or buy coffee.
You think I have to get to work,
and then there's a set of steps get
the keys, get in the car, buy a car
if you don't have it, walk if you can
because that's awesome or bike even better,
so there's all different ways that
we can solve problems in our own life,
and that is what we'll be doing week
over week in this course.
I'll be setting these problems up for you.
I'll be like here's a problem
when you wanna get music from the internet,
and play it how do we do that,
and it's really more about conceptual thinking,
and breaking these things down
into things that were used to.
Like I said like making coffee, or going to work,
how do we take things that we're used to in the real world,
and bring them into cyber world
whatever you want to call it.
Okay, and that's where this language
of programming will help us,
and that's why we're using JavaScript,
so how do I communicate an idea to a computer?
That is really what we are doing here.
We have ideas, you have ideas for something you wanna build.
You have an idea for you know something
you wanna do at your company.
Some data you wanna grab,
something you wanna see,
something you wanna share,
and we wanna communicate that with a computer,
and we'll be using JavaScript for that.
Okay, Front-end development,
so JavaScript is part of
the front-end development world, right?
When we talk about front-end development
we were talking about three languages HTML, CSS
and JavaScript only.
There are only three front-end languages.
There's not a fourth there will likely never be a fourth.
This is just the way it works because
this is the way the browser works,
so it's easy to remember that HTML, CSS and JavaScript are
the front-end languages,
and back-end languages are pretty much every other language
you've heard of more or less, okay?
so that's what we're working with here.
That's why knowing some HTML and CSS is helpful coming into
this because as you will see JavaScript
more or less interacts with HTML and CSS
with everything it does so that's coming up,
but this is something that's just an important takeaway
to be aware of because I'll be using these terms.
When we look at each of the languages of the
front-end the front-end being what you see in your browser,
they each have our purpose, right?
So we have HTML which is the structure of the page.
That is it for a second you don't need to overthink that.
CSS is the style and JavaScript is the behavior,
so HTML is the structure meaning is
the things that are on the page,
the text that exists, an image that exists
it exists is HTML.
The style describes it,
so the style is like it is a certain size or color,
and JavaScript is kind of how it moves behavior
if I click it and the actions that happen to it.
Again just let us kind of this lesson pour over your head
you don't need to memorize this right now ,
but that is important to understand because
they all have a certain function.
Now let's get real-world, okay?
Trying to apply this to something that we know,
I made this system where we look at each of them
as being like a noun, an adjective and a verb
because it's really easy to talk about, right?
If we look at HTML as noun, CSS as adjectives,
and JavaScript as verbs
we can have a conversation about real world stuff.
Look at this question here.
Chris can you make the logo bigger?
What, what I get this question a lot,
I get questions like this,
this is what your have (laughs) of me out
of working in agency life.
I used to work it at agencies an agency being you know, a
big company of lots of developers,
and designers where we work on generally
bigger projects, worked with nonprofits for a while and DC
but I also worked up here in New York on making
we worked on the Bacardi, Black Eyed Peas website,
the Toyota website, worked on a bunch of really big websites
and you know there's like 20 developers
all working on a project,
and you get requests from the client,
and the client often doesn't know how to code,
and it's my job to go like oh you know, what do they mean?
What are they saying?
And so we're gonna go through that right
now using HTML, CSS and JavaScript, got it?
You and me let's do this.
Okay, so Chris can you make the logo bigger?
Yeah okay, I know you spent a lot of money on your logo.
Yeah, I wanna make it bigger for you.
We're gonna be a really nice developer.
Yeah, okay I think that would be a good idea.
We'll make that logo (laughs) bigger.
Yeah okay, yeah okay,
so how do we do that?
What I think of when that happens is looking at the logo,
if we say that HTML is the noun, right?
HTML is the thing on the page, we can look at this
and say yeah make the logo bigger.
Making that logo in the page is gonna be coding with HTML,
and making it bigger is the style,
it's like the adjective,
it's the idea of making it bigger, right?
So making a logo on the page,
you could put a logo on the page or HTML,
the sizing of it is best on with CSS,
and that's how we work it.
Let's do one more, okay?
So hey Chris can you make the gray heading fade-in?
Okay, that's sounds reasonable,
so we have a blog I imagine,
and the heading the thing at the top,
the text at the top of the blog post,
the heading we want that to fade-in.
I'm gonna give this over to you here,
what do you do with this?
Which one is the HTML?
Which one's the CSS?
And which was the JavaScript?
If you're looking at it
you will think heading is the noun, right?
so the heading the idea that there's some text
on the page is going to be the HTML.
The gray the idea that it has a color is the adjective
the CSS and the fading in is the JavaScript,
and that's why I'm showing you this example right now
because the JavaScript that we're gonna
be using that's gonna have the interactivity on the page.
It's gonna have the events of clicking on something,
and having something else happen.
It's going to have when things load,
and data loads asynchronously,
and all this kind of stuff that's the JavaScript.
It's the verb,
it's the actions,
it's the behaviors,
it's the really cool sexy stuff going on all over the page
that you're you get really excited about, right?
so that's the JavaScript part,
and they all work together is really the purpose of this.
Alright, so that is JavaScript.
That's how it works together with HTML,
and CSS and it is all part of
the front-end development languages.
Yeah, so that's what we're gonna be doing.
Onto the next video.