Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Object-Oriented JavaScript: Challenge Introducing 'Four in a Row' Planning the Classes

Mike Ciniello
Mike Ciniello
4,862 Points

Is there an advantage to running code on a localhost as opposed to simply double clicking on the HTML file?

I have previously used 'express-generator' to set up the scaffolding for my simple apps. It also allows me to use package.json file to set up my localhost by simply calling 'npm start'. I more or less understand the logic here, but my main question is this: It seems I can simply click on an HTML file (say, index.html) and the app will display in my browser, so why go through all of the trouble of setting up a localhost?

3 Answers

Eric M
Eric M
11,545 Points

Hi Mike,

This is a good question. Let's break it down.

  • Node is a server runtime for JavaScript.
  • npm is the package manager for Node
  • Express is a web application framework for Node that simplifies many aspects of creating a web app.
  • A browser is a tool for rendering and interacting with the front end of web pages and web applications.

If your entire application is contained within a HTML file that references css and scripts that run in the user's browser, there's no need to set up the scaffolding for the serverside portions of a web application.

As your projects become more complex, you will want to do things that make a server more attractive (or other backend like AWS Lambda, API Gateway, & Dynamo DB, or Azure Functions & that stack, or the GCP stack, etc.)

Mostly, you will want certain types of application logic out of the browser and into the server. You (or your customers) will want this for a number of reasons (depending on application):

  • Certain parts of the application will need to communicate with a centralised database, this will take varying amounts of time per request if this code is running in everyone's browser and being sent to a remote database - instead we will want to move this logic closer to the database to reduce the time of these requests
  • In the above scenario, how does the application authenticate itself with the database? Either anyone can access any part of the database or access needs to be controlled via credentials. If all of your application is in the browser, those credentials are in the browser - this is equivalent to everyone having access.
  • In a similar vein users (and competitors) should not be able to see everything the application is doing - some of it may be the source of competitive advantage or restricted by licensing terms
  • Similar to the above if different user accounts are to see different things, you don't want to store all that in a place all users have access to
  • Your application may need to do some heavy processing that is slow in the browser but fast on a server
  • Recording stats on the way your users interact with your site require you to have somewhere to record them, and if your app works entirely in the browser it's possible to fully download it and then people can run it without a connection to your server (you won't get any stats)

The list goes on and I could probably sit here dreaming up specific cases for hours, so I'm going to leave it there and suggest you check out the MVC (Model View Controller) pattern when you get to the point where you want to start separating some of your logic out of the client.

In the mean-time, go ahead and double click that HTML file.

Cheers,

Eric

Eric M
Eric M
11,545 Points

I didn't explicitly mention this, but if you want people who aren't you to interact with a web app that does have everything in html/css/js files that are user accessible, you still need to get it to them somehow and this usually involves hosting these files on a web server. You don't necessarily need something like node and express for this though, sometimes it's worth doing things cheap and simple.

For instance if you just need a static site with some client side js (maybe for animations or a lightbox) then hosting on S3 or Azure blob will be much cheaper than setting up the same infrastructure a MVC webapp would use.

Mike Ciniello
Mike Ciniello
4,862 Points

That's an excellent answer! Thanks so much, this is very helpful.

That said, are there any particular courses you would recommend on treehouse that would help me better understand this sort of backend work? I am currently working my way through the Full Stack Javascript track. I am a Data Scientist, and while I love learning about the front end capabilities of JS, my main goal is to understand the data engineering side of things (node.js, AWS Lambda, serverless, etc).

Eric M
Eric M
11,545 Points

Full Stack JavaScript is a good course and will cover backend programming. It doesn't teach the architecture of applications or setting up a lambda using serverless however. Treehouse is more focused on programming itself rather than the infrastructure on which programs run (although there's a little of it obviously).

Once you have a familiarity with building simple JavaScript programs from finishing the Full Stack JS course you could grab a free tier AWS account and use their guides to setup a lambda. There are also lots of youtube videos and other sites like Treehouse but more cloud infrastructure focused that will help you here.

More Data Engineering is done with Python and R (and to some extent C) so you might want to check out the Python course here after learning JS instead of or in complement to the infra stuff.

Ian Ostrom
seal-mask
.a{fill-rule:evenodd;}techdegree
Ian Ostrom
Full Stack JavaScript Techdegree Student 10,331 Points

If you use VS Studio Code, there is a plugin that lets you run a repository on a local server by pressing the "go live" button. This saves the hassle of setting it up manually and gains the benefit of not having to refresh the page to see changes.

Murilo de Melo
Murilo de Melo
14,456 Points

"It doesn't teach the architecture of applications or setting up a lambda using serverless however." It should be the next step for Teamtreehouse in order to be consistent with the "independent learner", so we can indeed be indepedent in all senses. But I love all courses at Treehouse. And a great discussion by the way.

tnx