JavaScript Basics Pt. 2 - Variables & the console


English (Auto-generated)

Want to Javascript Basics, this is part two. My name is Michael and in this lesson we're going to get acquainted with our first bit of code. The tool will use to write that code, Javascript variables and the console. Let's go ahead and get started. So where are we going to write our code? So for that you want to head to republic dot com or you can type at rebel dot I T rep li is a great tool to use for learning. This is where we'll get familiar with javascript for now. Uh it's a great internet based development environment, perfect for learning some of these basic concepts we're going to go over. However, when you get more into development and start to create bigger absent projects, you want to use a dedicated i D E or development environment like V s code, but we'll get into that later on. So first thing you want to do when you head over to replica is sorry, let me pull that up is you want to create an account, You can either create an account directly on replica dot com or you can head to get hub and make an account or if you already have a get up account, you can sign into that here. If you don't have get hub yet. Uh it is something you'll find very, very useful for many reasons later on. It's a great code repository to store your code. It's also great for sharing your code. Um, but it's also great for creating accounts for places that are very code or developer centric. So that way you can just use your gift of account to make an account and log in like one replica dot com or here on code casts. So for now you'll want to go and create your account whichever way you want to do it. And then once you get back to this home page, we are going to create our little project. So for this, you want to go under, create head to html. CSS and javascript. Go and create that. Click on it and you can knead this whatever you want. But I'm going to name my little development environment variables and then you'll click create rebel. All right. And then this is where we're going to rent our first with code before we do that. Let's talk a little bit more about variables. Essentially variables are containers that can store values. They allow computers to store and manipulate data by applying a label to it. So this way, if you need to call upon a piece of data later by labeling it in a variable or declaring it, which is a common term. You can simply call upon the label used to declare you the label used to declare that variable. So that way you can use that data later. So this is great if you're staring storing a bigger piece of data, you can simply use one word as your variable to declare it and just call upon that single word later to use it. Now. How are variables declared? There are a few ways you'll see them declared the first one. I'm going to go over. It's an older, more traditional way called var which is just V A R short of course for variables. So we will declare our very first available and to assign something to that variable. You'll use the assignment operator, A k A, the equal sign. So that is what Eagles you'll use to to declare a piece of data to it. But for now we'll just go ahead and declare our very first variable. All right. For that. You want to just ignore these html and the CSS files over and replicate. You'll just head into the script dot Js file. So here, that's right. A very fresh variable. So again, we want to declare it with var and then you can name it whatever you want. Let's just name this code. So there you are. We have now declared our very first job script variable. But as you can see it's not storing anything. It's not really doing much. We've only declared it. So let's head back over and talk more about that. Yeah. So one thing you want to note to about declaring your variable is that javascript is case sensitive. So whenever you want to name a variable. Typically you want to use camel case in javascript. So camel case is what you see here, where if you have multiple words in the name, there's gonna be no space. The first letter of the first word will be lower case. Second letter in the name or 2nd, 1st, 1st letter of the second word will be upper case and so on. So let's go over that here. So if we want to name this variable, our first code, you don't want to do this, You don't want to have spaces, you don't want to have spaced out, you'll want to use camel case. So camel case for our first code will look like this are first come there you are and that is camel case. It makes it it's a popular convention that's used in javascript and it makes it easy to read now because job script is case sensitive, different capitalization of the same words will mean that they are different variables. So for example, we head back over and let's collect some more variables. So from the type of art, our first code. Hello? I'll see it even even creeks because it knows that that is wrong. But I want it that way. And let's have another our first code. So even though these are all the same letters, because the casing is different, that means that these are all different variables. So you don't want to do that. And even though the capitalization is different and it makes them different variables. You do not want to use that to differentiate your variables. Absolutely do not do that. You'll just want to simply name the variables, different things. That is best practice. So now that we know about camel casing and we know how to declare a variable. What do you put inside variables? Well, variables can store many different data types. The very first data type, we will get acquainted with our strengths. So strings are any number of characters including done, So even zero characters in case in a single or double quotes. So you can put letters, numbers or full sentences inside of strings. So let's go ahead and the sinus string to our variable. So here we have of our our first code. Well, once he's an assignment operator, it's a he's single question and that question mark, equal side to write this out and then we'll type out double quotes. One thing you'll notice a lot of development environments when you type out, when you hit the quote key, once it will type up to and I'll just let you write your message very easily inside, which is pretty nice help speed things along. And the first message we're going to do is a very popular beginners message, which is just going to be Hello World. So there we are, we have our very first variable declared and inside of it it is storing a string that says Hello world, but how do we see that? Well for that, let's head back over and let's talk about next the console. So the console is many, many things uh for one it is where messages will be sent, including error messages. It's also so that makes a good place to check for errors and it's great for very basic testing purposes. Now, later on, you may hear people talking about writing tests for their code. Typically if they're talking about writing tests, that is a much more involved process for larger pieces of logic for complicated code. Um So that is something different than this, but console is great for doing basic tests. So to work with the console, if we want to write a message to it, we're going to be our very first method, which is console logs, so it's console dot log with two parentheses and whatever message you want to send to the console will be in case in these two parentheses. So that allows you to read a message to the console. And again, it's useful for basic tests. So let's go ahead and look at our message in the console. So underneath will write up console dot log and just like with the quotes when you type one part of the parentheses, it fills it out and sticks your uh cursor right in the center again, which makes typing up the code very easy, helps speed things along. And so for this, we can write up our first coat because that is the name of our variable, that's how we declared it and councils down here on the right. So let's go ahead scoot that over because we don't really need to see we don't really don't have a a web page to look at. We're just gonna look at the console and then from here to go to the top and click run. So there we go we see our message. Hello world. So this is a way to see what you have certain side variables. There are gonna be different data types will go over in the next lesson and you can also use council like to look at dose um with console log though you don't have to, if you want to write a message to the console, you don't have to store that message inside of a variable first you can simply put a string directly inside. So let's type out new message. Hello constable run again. There you go. There is that second message directly to the console insight. Perfect. So that was our first introduction to where we were going to write a lot of our code for now, javascript variables and the console. So that is it for this lesson. I will see you in the next lesson where we will learn more about the more common ways that variables are declared now different data types and different things you can do with those data types. All right, thank you guys and see you in the next lesson
227 Views 0 Likes 0 Comments

Writing our first code, JavaScript Variables, and the console

Leave a comment (supports markdown format)