Running JavaScript from Files

Using the tools at your disposal to execute JavaScript code from files.

Scroll down...

Content

Resources

Comments

So far, we have looked at executing our JavaScript either directly in the browser’s console or in an online code editor like JS Bin. Sadly, most respectable applications aren't written entirely in the browser console. As our assignments begin to grow in scope and complexity, you will want to start writing code in text editors on your computer. Let's look at how we can execute our code outside of a browser or online editor.

Running Code in a Text Editor

Many modern code editors, like Atom or Sublime Text, allow you to execute code directly in the text editor. If you Sublime Text, you can press Command-B on a Mac or Control-B on a Linux or Windows machine (B for “Build”) to see the output of your code at the bottom of the window.

Running code in Sublime Text

If you are using Atom, you will have to download the Script package and execute your code with Command-I on a Mac or Control-I on a PC (I for… Ichabod).

Running code in Atom

This is great for doing some quick debugging. You can just shotgun some console.logs around to verify that your code is working as expected.

Running Your JavaScript in the Browser (Without Writing it in the Console)

If you want to quickly load some code into the browser, so that perhaps you can debug it in the console or see some output on the screen, then you're going to have to include your script inside of some HTML. It's really easy to make a dummy HTML file that only pulls in your code. Then it's just a matter of opening that HTML file with your browser.

Imagine a folder with your super important fizzBuzz.js file. Simply create and whatever.html file and add a script tag. Here’s what it could look like:

<html>
  <head>
    <script src="fizzBuzz.js"></script>
  </head>
  <body>
    <h1>This Is Unnecessary!</h1>
  </body>
</html>

Now all your code is loaded up in the browser, any calls to console.log should already be piled up in the console. Plus, you can now interact with any functions or objects you created right in the console.

Wrapping Up

So now you know a couple of really simple ways to execute the code you write on your computer. Soon enough, we will be exploring Node.js, which will let us run JavaScript in the terminal. But for now, we have more than enough ways of running code.



Sign up to track your progress for free

There are ( ) additional resources for this lesson. Check them out!

There are no additional resources for this lesson just yet!

Sorry, comments aren't active just yet!

Next Lesson: Constructing Objects