file and open with live server, this should open up in your browser, and you should be good to go. So if I were to make a change here, just console.log hello, you'll see it update here. Let's take a look at how we can define or declare our strings. So there are three common ways to do that. So let's make three variables here, say const firstName, and for this one we'll use single quotes. So I'll put my name here. For the second one, let's say lastName, and you can also use double quotes. Okay, put my lastName in here.

For the second one, let's say lastName, and you can also use double quotes. Okay, put my lastName in here. And for the third one, let's name that variable jobTitle, and for this one we'll make use of backticks, which is the key next to the 1 on your keyboard, and this is also known as template strings or template literals, so let's go ahead and change this, and these are all valid ways to define strings. So if you were to console.log all of these, say firstName, and you can even pass multiple params to console.log, so we'll print out everything here. jobTitle on one line, save that, and you can see that is being updated, and I have to update my jobTitle to webDeveloper.

jobTitle on one line, save that, and you can see that is being updated, and I have to update my jobTitle to webDeveloper. Okay, now the single quotes and double quotes pretty much work the same way, so one case where you might want to use one over the other is when you actually need that character within your string. So for example, if I were to make another variable here, say const storeName equals, and we'll use single quotes, say André, or André's cookies, you'll see that there's a red squiggly within VS Code, but even if I didn't add that, let's try the console.log storeName here, and let's see what we get. And we get unexpected identifier on line 5, so right here.

storeName here, and let's see what we get. And we get unexpected identifier on line 5, so right here. So the problem here is it thinks the string is ending right here, and it doesn't understand what the rest of this means. So in cases like these, you can just wrap the string in the other quote, so in this case the double quote, change this to a double quote, and this one as well, and now this should work. So if I save this, we get the correct output, and the same goes for the other way as well. However, you can run into cases where you have to use both, so say for example, I wanted to have a word with quotes around them within the string, so say specialCookies, now we

However, you can run into cases where you have to use both, so say for example, I wanted to have a word with quotes around them within the string, so say specialCookies, now we have the same issue. So if I save this, we get that same error. So in cases like these, what we want to do is escape certain characters, so to do that, we can add the backslash before the special character. So in this case, we want the backslash here, and also here, and now this should work. Now if we wanted to actually use that slash in the string, say for example, slash treats, let's try that out, you'll see that it's not rendering, so we actually have to do it twice for the backslash.

let's try that out, you'll see that it's not rendering, so we actually have to do it twice for the backslash. There it is. And if you were to use template strings here, you can avoid most of these problems, so let's make another variable here called storeName2, let's use backticks, and we no longer need to escape the double quotes, we only have to escape the slash here. So let's console.log storeName2, and that still works. Now let's take a look at string concatenation, which allows us to combine our strings that are stored in variables. So say for example, we wanted another variable named fullName, so const fullName.

are stored in variables. So say for example, we wanted another variable named fullName, so const fullName. Now we already have myFirstName and myLastName stored in variables, so we can make use of those and concatenate them, or combine them. So to do that, we can say firstName, we can use the plus operator, and then concatenate the other string, so lastName. Let's try that out, let's console.log fullName, and we do get myName, but there's no space in between myFirstName and myLastName. So what we can do is add an empty space in between myFirstName and myLastName, like this, so plus, an empty space.

So what we can do is add an empty space in between myFirstName and myLastName, like this, so plus, an empty space. Again, you can use single quotes or double quotes, or even backticks if you like. You have to combine this other string, so one more plus here, and let's save that. And now there's a space in between myFirst and LastName. So let's do one more example here, let's say const, let's name the variable about, and let's start off with a label named name, put a colon, we'll say plus myFirstName and myLastName, and we'll also add myJobTitle, so plus, let's say, title, or job, put a colon, and again, plus myJobTitle. And let's console.log that.

again, plus my job title. And let's console.log that. And that does work, but you'll often find that you tend to forget spaces and punctuation. So in this case, if we have a space here, I want a space after myLastName, so let's put one before job here, and maybe a space after the colon here. Save that. Actually, let's make it a comma. Okay. So as you have more strings and variables to concatenate, you can see this is getting quite messy.

So as you have more strings and variables to concatenate, you can see this is getting quite messy. Let's do one more example here. Say we wanted some HTML as a string, which you'll often do when working with DOM manipulation and vanilla JavaScript, which we'll take a look at later on. So let's make a new variable here, say const html equals, and say we wanted a multi-line string. Let's see if we can do that. And let's say div, an opening div, and then some content, so say hi there, and then a closing div.

And let's say div, an opening div, and then some content, so say hi there, and then a closing div. You can see that we already have some issues here. So if we try to console.log this HTML, you see we get some errors here. And to have an actual multi-line string, we have to add backslashes at the end of each line. So we have to add one here, here, here, and here. Now we can have this multi-line string, which you can see here, but it's actually not multi-line when we console.log it. So if I save that, you'll see that does work, but the lines are not preserved here.

when we console.log it. So if I save that, you'll see that does work, but the lines are not preserved here. You can see it's just spaces. And to preserve the new lines, we have to use \n, and we have to do some additional string concatenation here. So we have to add one here, then we have to add a + here, and then we have to make this a string, add an \n here, and the same for the other lines. And you can see this is quite cumbersome. And one more here for the last line, so +, let's make this a string, and it's add \n here.

And one more here for the last line, so plus, let's make this a string, and it's add \n here. And I guess we can just close it here, so let's do this, and let's save that. And I forgot the last quote here, save that again. And now the new lines are preserved. And as I've been saying, template strings are the better way to accomplish all of this. So let's start with the full name here. Let's make a new variable called fullname2, so const fullname2 =, and we'll use the backticks. And again, we want to make use of these variables that we already have.

backticks. And again, we want to make use of these variables that we already have. So we want firstName, and then a space, and then lastName. So to actually make use of variables or JavaScript expressions within a template string, then we can use the dollar sign curly brace syntax. So we'll wrap this around our variables. So firstName, like this, and same with lastName. And in my opinion, this is much cleaner. It's going to preserve the space in between these two variables, and inject the value of these variables within here.

It's going to preserve the space in between these two variables, and inject the value of these variables within here. So if I were to console.log(fullname2), that should work fine. Let's do the same for about. So we'll grab this, paste this in, but now we'll use template strings. So let's change this to a template string. We no longer need all of this concatenation. So let's say name, we'll use $firstName, and then lastName, like we have above. Actually, we can just make use of the fullname2 variable. So let's do that instead.

Actually, we can just make use of the fullname2 variable. So let's do that instead. fullname2, okay, we can put a comma here, let's say job. And then we can inject the jobTitle variable, jobTitle, and that should work fine. Let's console.log about. Let's save that. And we have to make sure to use a different variable name, so about2, same with this. And we get the same result. But again, I think this is much cleaner. And it even preserves new lines, so we don't have to go through this mess here.

But again, I think this is much cleaner. And it even preserves new lines, so we don't have to go through this mess here. So let's rewrite this using template strings. So const html2 equals, let's open up the template string. We can have multiple lines here, no problem. And we can say div, let's say hi there, let's even inject a variable here, let's say fullname2. And then we can close the div here. Let's console.log html2. And let's see if it preserves the new lines, and it should. It does, cool.

use within JavaScript do have built-in methods you can use, so you can manipulate that certain thing. So in this case, these methods allow us to manipulate our strings. So the first one is the length property. So let's make use of the firstname variable I have up here. And the length property will allow us to count the number of characters in that string. So in this case, my name has five characters, so there should be five. You can even grab a certain character using the array square bracket syntax. So let me just scroll this up. Let's duplicate this.

So let me just scroll this up. Let's duplicate this. And we can say firstname square brackets. And again, we haven't taken a look at arrays yet, but the first character is zero. So this should be an uppercase A. Okay, we can do something similar with the charAt method. So instead of using square bracket syntax, we can say firstname.charAt, so character at. And let's get the second character, so that would be a 1, and that should be an n. Okay, we can uppercase the entire string using the toUpperCase method.

And let's get the second character, so that would be a one, and that should be an n. Okay, we can uppercase the entire string using the toUpperCase method. So toUpperCase. Okay. We can do the same for lowercase, toLowerCase. Okay. We can get a part of the string using the substring method. So firstName, substring. So you start at a certain point. So in this case, we'll start from the beginning, so 0.

So you start at a certain point. So in this case, we'll start from the beginning, so zero. And then we'll stop at the second character. So this should result in an. Okay. And for the last one, let's try using the includes method. So includes. So this checks if there's a certain string within the string. So in this case, we're checking if the string Andre includes, in this case, a and d, and this should result in a boolean.