1

I'm having some trouble finding this specific information about NodeJS, I googled but I can't really find any answers to it. Hopefully you can clear some of my problems.

So, I installed NodeJS by following this guide in Ubuntu. I then used npm to install Sass by following this guide. I was able to get sass working just fine.

But here's where the confusion starts. I'm not entirely sure how to actually use Node. Am I supposed to always start a server by using this?

node myjsfile.js

If I don't do that and in my HTML file I add a script tag like so

<script src="js/myjsfile.js"></script>

Then when I load the page the console will output an error like

Uncaught ReferenceError: require is not defined

But, if I do run

node myjsfile.js

after setting up my files by following this guide, then none of the changes I do to the JS or HTML actually appear on my page, meaning that I have to constantly rerun the node command to see any updates.

I'm sure I'm missing something here but I can't figure out what. I'd really appreciate some help.

lpetrucci
  • 1,285
  • 4
  • 22
  • 40
  • Node is for server side code (create a http server, doing some scripts, create a RestAPI). Node will server your client files. But you need to write client code, which will not use node. It will use browser ECMA 5/6 code. You can transpile your node file to make it usable in browser, but it is advanced/restriceted use, and you should understand the difference between client/server code before going this way. – Baart Oct 19 '18 at 12:24
  • I do understand the differences, what I don't understand is if Node has any use for local client side code. A lot of modules can only be installed by using NPM, so my understanding was that I had to install Node to also use NPM. – lpetrucci Oct 19 '18 at 12:27

3 Answers3

0

Require is not part of JavaScript. What is this Javascript "require"?

You have to transpile your file with a tool like grunt, webpack etc.

Node can interpret more than a browser can. This is why node does not throw an error. Also it is used server-side. If you want to execute your script in the browser, there is no need for node.

Matthi
  • 1,073
  • 8
  • 19
  • Am I wrong in using Node to download via NPM even if I do want to work locally? That does seem much faster than the traditional method. – lpetrucci Oct 19 '18 at 12:24
  • What are you planning to create? If you serve the transpiled file (which won’t have any `require` in it anymore), the browser can interpret it. – Matthi Oct 19 '18 at 12:28
  • The plan was to build code that will be transpiled but through Node as training for when I eventually need to use Node server-side. I needed packages that were easily available on NPM so I supposed I had to use Node to use them. – lpetrucci Oct 19 '18 at 12:32
0

Node is for server side code (create a http server, doing some scripts, create a RestAPI).

Let's say you have created mynodejsfile.js. When you want to install a node package that will be used in this file. You reach the folder of mynodejsfile.js and:

npm install mypackage

This will install the dependency 'mypackage' in a node_modules folder beside 'mynodejsfile.js'.

Then you will be able to

require('mypackage')

in the 'mynodejsfile.js'.

If you want to create HTML content, you will node use your node file directly in the browser, node file are to be used with nodejs interpreter.

When you use html file with script you use a client side code, which will not be understood by your browser. When writing client code (for browser) you will use browser ECMA 5/6 code, and not nodejs code.

You can transpile your node file to make it usable in browser, but it is advanced/restricted use, and you should understand the difference between client/server code before going this way.

Baart
  • 571
  • 1
  • 6
  • 19
  • If I used something like Browserfify, which as far as I understand transpiles code in a way that browsers can read, will i need to transpile it every single time I want to see changes? – lpetrucci Oct 19 '18 at 12:34
  • No. You have to do a “build” of your website (once with every code update) — the build will be the files to deliver via your server. – Matthi Oct 19 '18 at 12:36
  • If I may give you an advice, I would tell you to create a simple client code (html and javascript). A simple server code (host your client code). Then once you have that and understand where is the border between the 2 worlds, you will use browserify and those things, but it would be better for you to understand the difference before mixin node with client code. Regards – Baart Oct 19 '18 at 12:41
  • I actually have a fairly good knowledge of both Server and Client, I write JS the old fashioned way at least at a proficient level. I'm just trying to expand and understand how npm works. – lpetrucci Oct 19 '18 at 12:45
  • I just don't understand how am I supposed to learn if every time I want to see if my code is working I either need to restart NodeJS or run Bowserify to see changes. Isn't there something that automatically listens to changes and transpiles my code automatically? – lpetrucci Oct 19 '18 at 12:48
  • npm is a complete build system. You will find tutorial on how to use it for development (npm run dev). It handle hot reloading with customisable steps. What you want to do is possible, just look for npm build system tutorial. – Baart Oct 19 '18 at 14:46
0

In my feeling you are mixing up behaviour of client side javascript functionality (like including a script file into a webpage) and building a NodeJS server. As Matthi pointed out, Node can interpret way more than the browser.

Regarding the necessity to constantly refresh your server instance I can hardly recommend nodemon to you. By default nodemon restarts your server after each code change, removing the problem of manually restarting the server in the development stage.

Bob West
  • 21
  • 6
  • Currently trying Nodemon. It seems to be pulling an old version of my index.html that is not present in my files anymore and none of the changes I make are reflected in the output. – lpetrucci Oct 19 '18 at 12:47