7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
FREELessons: 7Length: 53 minutes

Next lesson playing in 5 seconds

  • Overview
  • Transcript

1.2 Setting Up Your Environment

In this lesson, I’ll show you the tools I use in this course. I’ll also show you how to install the starter project so that you can be up and running in no time.

Related Links

1.2 Setting Up Your Environment

Before we get started using JavaScript to make and work with HTTP requests, we need to go over things that you need. Not just for this course, but for doing any type of development, as far as JavaScript and HTTP is concerned because, you can't just open up a file, off of the file system in the browser and expect it to work. Now your JavaScript might execute, but when it comes to making HTTP requests, it won't work, the files have to actually be served from an HTTP server. So that means that you need a server installed on your computer or you at least need a server running. Now there's many different options that we can go with, but the easiest solution is going to be Node. Because I have created a little project, that you can just download and install, there's no configuration, and you will be good to go as far as what you will need to follow along with this course. So Node is just a platform for running JavaScript, it's a JavaScript runtime, and you can write any type of application that you want. A desktop application, console, even a web application with JavaScript and that's what I have done. The application is a web application, done so in JavaScript, so there are two versions that you can choose from. There's the LTS and then the Current, you typically always want to go with the LTS, it stands for long term support, and yeah, LTS. The Current version has more features, but that's also where those features are implemented and hardened. So I'm not going to say that it's unstable but it's not as stable as the LTS. Because the LTS has well been in development for awhile and it is stable, so just go with the LTS. Download the installer, take all of the defaults and you will be good to go. So the second thing that you'll need is a code editor, and I use Visual Studio Code. It is by Microsoft, but it is a fantastic tool, if you have any bias towards Microsoft, then it's time to get rid of that bias, because it is not the company that it was 20 years ago. And when it comes to JavaScript editing, nothing can beat Visio Studio Code, I'm sorry nothing can this is the best tool. So since we're going to be working with JavaScript it makes sense to use the best tool. Now if you have your own code editor, if you're using Sublime Text or Atom or anything like that then feel free to use that, I'm just pointing out that this is what I'm going to be using. And it's worth also pointing out that I mentioned that Node can run desktop applications well, Visual Studio Code is one of those types of applications so, there you go. So those are the two things that you need to install on your system, Node.js and then a code editor. Now when you have Node installed, what you are going to do then is go to the repository for this course and you will want to find a folder called start, because that is the starting place. And you can take that folder and rename it, put it anywhere that you want. In my computer it's called HTTP just because that's how I've organized my particular projects. But what you will want to do then, is once you have those files, you will want to go to the command line and CD into that folder and then run the command npm install. And that is going to install everything that's needed in order to run this application, everything else is already there for you. There is no configuration, whatsoever, you can see that the installation didn't take very long at all because, there's not a whole lot of dependencies being used. So, once it is installed, then you can say, node init, now, well first of all, let me file up the code editor. We're not going to really spend any time looking at the application, because that's just beyond the scope of this course. But in order to run it, you'll say node init, init is the file name inside of this folder. And Node is going to look at that file and then execute it and that's going to run the application. You're going to see that it is listening on port, or listening at HTTP local host at port 8000. So whenever you see that you can see that the application is running. And then you can just fire up your browser, so let's do that and we will see the index page. So that whenever we start making HTTP requests, we are going to actually dynamically add content to this page. And let's go ahead and look at that content so that you have an idea of what you are going to be doing. So let's close all of those files, and the project itself is broken up really into two sections. There's the source which is for the server application if you want to take a peek at that code then feel free to. We're not going to really look at that, but what I want to point out is this guitar-data. Because the data that we are going to be working with is really just a JavaScript array, but this is the data that we are going to be making queries for, and things like that. So, you might want to get familiar with the schema that we have, and go from there. Because we're going to be making queries based upon the properties of these objects in a couple of lessons. So then there's this public folder, the public folder is everything that's going to be served to the browser. So, if we go back to the browser we see just simple HTML page, if we view the source there's not a whole lot of stuff here. Well the files that are being served are inside of the public folder, so what we see in the browser is actually index.html. There is search.html for whenever we perform our query, and there's also going to be other files in here that just haven't been added onscreen yet. So all of the work that we are going to be doing is going to be inside of public, because that is where all of our files are going to be served from. And that's basically it, as far as this application, and the things that you need for this course. So that in the next lesson, we can get started looking at a nice little HTTP library, I guess you can call it, called Axios.

Back to the top