Adam Hughes
Adam Hughes

Reputation: 16309

Difference between deploying `index.html` vs. `npm start` for local Node project?

I'm completely new to web programming and have a very basic Angular.js app in JetBrains Webstorm IDE.

In Webstorm I can right-click on index.html file and choose Run/Debug and it will launch the app in Chrome with the debugger attached (I have chrome LiveEdit Jetbrains extension). This created a generic JavaScript Debug configuration. This is nice because it launches a chrome browser running my app automatically.

ich

However, I was also able to run the app using npm start via JetBrains npm template. while I haven't explored it further, can probably also run the app using a Node.js template.

My question is that what is the difference between these launch methods? How would I choose one rather than the other?*

It's nice that, for example, running index.html directly opens a chrome tab automatically. But what is the difference in doing this way over another? For local development, which one is better?

Upvotes: 1

Views: 2062

Answers (1)

ng-hobby
ng-hobby

Reputation: 2199

The application development landscape has been changing continuously over the past few years, both on the client side (frontend) as well as on the server side (backend). On the client side, we have plenty of awesome new and updated JavaScript [and other scripting] frameworks; and on the server side, we have new architectural approaches such as single page applications(SPA), microservices, and serverless architectures.

The index.html is the main root file in your front-end & index.js is the main starting point of your backend. When you install Node on machine there is an npm which is node package manager which can install the project libraries and packages using 'npm install' based on the information on the package.json file. If you look into this file there is script part such as this:

  "scripts": {
    "start": "node ./index.js",
  },

The project command starting with npm such as npm run start or npm run build ... can be found and define here.

When you start with your backed it initiated your project and load required templates. When you using IDE such as Webstorm, Visual Studio, or ... they build and run your entire project. So, by initiating and serving the index.html just you can see a part of front-end application and this running that you can see is what 'IDE's provide for you. For better understanding this process you can open project in a simple text editor such as Sublime text editor to understand the differences. So there are actually no difference in your context.

This was an general explanation that I hope could help but there are many other rooms to discuss.

Upvotes: 3

Related Questions