Questions on NodeJS application - javascript

I have very basic questions on NodeJS apps;
When someone says a NodeJS app, does it refer to a pure server-side written NodeJS app ? I mean nowadays, when projects (say Angular, Ember, etc) use Node to install dependencies, can those client-side apps (which run in browser) be also called NodeJS app ? Or are these just NPM using apps ?
The unit-testing frameworks like Mocha, Jasmine, etc be used for both the types of apps I described above ? Or is it meant only for server-side NodeJS app ?

does it refer to a pure server-side written NodeJS app?
Yes. Specifically it refers to apps that have nodejs backend/server.
can those client-side apps (which run in browser) be also called NodeJS app?
It depends. Certain libraries that depend on browser api (e.g navigator, window, etc) will not work. This is because those browser objects will not exists in nodejs environment. For example, jQuery will not work fully in nodejs as certain functions to do with DOM manipulation depends on the browser api. On the other hand. React can be used in both browser and nodejs because it has APIs which are compatible in both browser and nodejs environment.
Previously, if we want to use a library (e.g jQuery) we'd have to attach a corresponding script tag that points to the source. Now, you can use npm to download the library code into the node_modules folder and use it from there using require or ES6 import. But, you probably have to do some preprocessing first such as bundling your code using Browserify and Gulp. You might want to look a tutorial on how to do that here.
The unit-testing frameworks like Mocha, Jasmine, etc be used for both the types of apps I described above ? Or is it meant only for server-side NodeJS app ?
Mocha, jasmine, chai does not depend on browser or nodejs specific features so they all should work in both platforms. As for the others, you have to check if they depend on browser or nodejs specific features. If they do, the library might work in one platform (e.g browser) but not the other.

"Node.js" is a server-side "JavaScript" platform. That means in a NodeJS app we replaces the typical server side languages like PHP, Ruby, etc.. with the JavaScript. When it comes to frontened we have been using Javascript and its libraries like JQuery for a very long time to add behavior to our apps. But after the recent boom of SPA(Single Page Applications) we can see lots of frameworks like Angular, Ember built on JavaScript to make SPA easier.
NPM is a package manager for JavaScript which itself uses Node to perform its operations. Using NPM we can bring many JavaScript packages (that includes all the client side JS libraries) to our project. But that does not mean your's is Nodejs app if you are using NPM to install AngularJs for your ASP.net application. It is like we need Ruby gems to install SASS preprocessor.
That's the beauty of a pure JavaScript(NodeJS) app. We can use the testing framework in both ends. Moreover that a developer can avoid mental switching between different syntax of the two languages, and even we can reuse some code/logic in both server and client side.

npm is a package manager for javascript. Using npm to import and manage packages for your application does not make it a Node.js app.
There is no such "Node.js apps". Applications refer to the front-end/client side.
You can choose Node.js or whatever on your back-end/server side, independently from your front-end.
I hope I have clarified a bit :-)

Related

What is the role of Node.js in React-Native?

I'm trying to understand the development process of React-Native, so I've found information about Metro, And then I've read/watch this Metro video):
Metro is the development platform for React Native and it does that by
exposing an HTTP server so clients, in this case, emulators can
communicate with it and it also exposes a Websocket server so it can
push updates into the clients.
The docs talk about the "React Native Packager" (now called Metro, according to the video) which runs on port 8081, so that is the HTTP server that starts when we type react-native run-android for example?
Regarding the Websocket I still need to read more.
The documentation says we're running our JavaScript code in two environments, depending if we're in debug mode or not, which I understood. But this article confused me a little bit, says:
No. 4 You Code Does Not Run on Node.JS: The JavaScript runtime you’ve got is ether JavaScriptCore (non-debug) or V8 (debug). Even
though you can use NPM and a node server is running on the background,
your code does not actually run on Node.JS. So you won’t be able to
use of the Node.JS packages. A typical example is jsonwebtoken, which
uses NodeJS’s crypto module.
And, then I've read things like:
React Native uses Node.js, a JavaScript runtime, to build your
JavaScript code.
Node.js is a server-side JavaScript runtime environment. React
Native ships with some tools that are written for Node.js.
Node.js is an open source platform built on Chrome's JavaScript
runtime; it offers a way to easily build fast, scalable
programs. Node.js allows you to run JavaScript in Terminal, and helps
create modules.
In this article, it says:
Download node.js from nodejs.org. This JavaScript runtime gives you
access to npm, which is a convenient tool created by the node.js
project that you can use to manage open source packages. Make sure
that you download the latest LTS (Long Term Support) version of
node.js. Also included with this download is a development server
called the Metro bundler, which provides live updates when debugging.
So:
The role of Node.js in RN is to only access npm and manage the packages? and is Metro is includes in Node.js? Am I missing/confusing something? Thank you.
There are four types of JavaScript you'll write in todays environments:
1) Clientside browser JavaScript:
That's what gets sent to webbrowsers when they visit your webpage, it then gets executed in the browser at the clientside. As you want the JS to load fast and run on all kinds of browsers, you usually use transpilers to turn the modern ESnext you write into a minified version with better support.
2) Clientside native JavaScript:
Most devices do have a native JS runtime, therefore you can ship JS files with your Android / iOS / Desktop application and then start them there. These engines also support adding hooks from JavaScript into your native code, that's how React Native does provide it's APIs.
3) Serverside NodeJS JavaScript:
NodeJS is a runtime you'll use to run servers.
4) Buildscripts running on NodeJS:
You can use JavaScript to generate JavaScript files. That's how you bundle the files for (1) and (2) (maybe also (3)).
Now metro is a serverside buildscript (on NodeJS) that you can use to either a) start a server that serves your JS as a webpage (1 & 3), or b) that bundles your JS in a native App that you can install on your device (2).
The role of Node.js in RN is to only access npm and manage the packages?
No. metro is itself a package that you then run on NodeJS.

Building SPA frontend without node/npm

I'm a back-end java developer (spring boot) and currently I'm interested in building a single page application.
What I like about SPA frameworks (mostly Vue):
Model-binding (saves boilerplate code)
Components and templates (separating code in multiple files is always good, but I don't like single file components as I feel they mix the view and logic)
Routers
However, unless you are using Node there seems to be poor integration
What I don't like:
Node (I develop backend in Java so I don't want to install node just as a prerequisite for NPM)
NPM (I already have dependency management in Maven/Gradle. I actually don't mind it as much, I just don't want to install it and manage it seperately)
I understand why stuff like Node, Npm, Webpack is necessary, it's just that I've already have Java/Spring/Eclipse doing all that for me. I have no desire to have basically two separate build processes.
TLDR: I like the direction and architecture of modern frontend, I just don't want to deal with the tools that are used.
Specific Question: How can I develop a modern SPA using Spring Boot, Gradle/Maven and Vue.js and not have to install Node/Npm/Vue cli etc. What are the best tools if there are any?
Thank you.
You can use maven frontend plugin hosted from here.
It is maven plugin that is leveraging downloading nodejs, webpack, gulp, grunt and running it on your codebase.
You will be able to run maven build and nodejs will be downloaded automatically. It will run your frontend build as well and in resulting jar you will have only necessary minified files.
However, you have to be aware that if you want to debug your frontend application it is a good idea to have those things installed and being able to run the app locally without minification of html and js files.
If you don`t want to download tools you can use helper scripts provided by authors of this plugin to use tools downloaded by this plugin.

Can I use the Node.js packages along with Django?

I think I haven't understood this concept right . If I am using Django as a backend to run server side code , is there a way to include the packages of Node.js also .
Isn't Node.js kind of another environment or language for server side code ?
If I can use Node packages with Django , how to go about it. What does it mean when people say "Node js is a platform and Django is a framework" ?
I would be very greatful if you include some indepth details about these two environments ( new to web development here:))
Can I use the Node.js packages along with Django?
No. Django is a Python framework and thus runs in a Python interpreter. That interpreter cannot run node.js modules because those are Javascript and rely on the node.js Javascript engine.
If you want to compare things:
node.js <==> python (runtime language engines with built-in libraries)
express <==> django (frameworks that run in a given runtime)
This is kind of confusing because Node.js is a server-side javascript platform
Node.js is a Javascript programming environment. It can be used to write servers, but it can also be used as a general purpose scripting environment to do anything you may want to do on your computer, such as implement various build tools.
webPack is one such build tool that is written in Javascript to be run in node.js. Its function happens to be packaging client-side Javascript files, but it could be any type of tool.
There are many tools written in node.js, particularly tools that are often used by node.js developers (since they already have that environment installed).
If you really needed to combine functionality from both node.js and django, then you would have to create two separate programs 1) a python program using django and 2) a node.js program using whatever Javascript libraries you want and then you could communicate between the two programs using whatever IPC mechanism you choose (TCP, stdio, files, etc...).
While you'd need two different environments to use nodejs as a server along with django as a server, node.js has a critical role in managing packages for client Javascript in modern web development.
As an example, tools like Webpack will bundle a series of Javascript modules for a client. One of the more convenient ways to package these modules and their dependencies is using npm, the Node package manager.
So, it would be entirely reasonable to use Node to bundle the Javascript for your client and even to install the modules for bundling. This is especially true if you're using a framework like Angular on the client. So, if you had an Angular application backed by a Django server, your work flow might look like the following:
Create a node project with your Angular App
use npm to install and manage its dependencies
use ng build --prod to call webpack to produce a bundle that could be sent to the client.
All the above would use Node.
Then:
Write your models and business logic for the server in Django
use some Django restful framework to present a REST API that your client application can call.
This is kind of confusing because Node.js is a server-side javascript platform, but it's being used to:
Provide packaging for client modules
provide server-side transformations to prepare the content that your particular site sends to the client.

Why angular 2 need node.js

I don't have experience in front-end but I want to create a simple app using Angular 2.
Why do I need to install Node.js as a prerequisite step? Why does Angular use Node.js?
There are a couple of things that Angular uses Node.js for:
Installing and managing packages. From the Quickstart tutorial:
Angular application developers rely on the npm package manager to install the libraries and packages their apps require. The Angular team recommends the starter-set of packages specified in the dependencies and devDependencies sections.
Compiling the TypeScript used into JavaScript that the browser understands - browsers can't process TypeScript natively and the SystemJS imports used in your code aren't supported in browsers yet:
We strongly recommend transpiling (AKA compiling) to JavaScript during a build phase before running the application for several reasons including:
We see compiler warnings and errors that are hidden from us in the browser.
Precompilation simplifies the module loading process and it's much easier to diagnose problems when this is a separate, external step.
Precompilation means a faster user experience because the browser doesn't waste time compiling.
We iterate development faster because we only recompile changed files. We notice the difference as soon as the app grows beyond a handful of files.
Precompilation fits into a continuous integration process of build, test, deploy.
node.js is required in order to install the library using the node package manager (npm).
It is not required to run an app using angular2, only to build it.
For any modern JS based application, as the complexity grows, the app becomes difficult to manage.
In order to make developing and managing complex applications simpler, there are frameworks such as Angular, React etc. and they provide number of tools for the same.
These tools are linting, scaffolding, running unit test cases, starting web server for local development, minify and creating build for the production use etc.
These tools are based on NodeJS as it is JavaScript only and therefore can be customize as per developers needs.
And that's the reason you need Node.js for Angular2 development.

Use of Node JS for Frontend

I have heard about Node.js being used in the frontend side of the application as opposed to the backend side, but I cannot find any use cases for which it can be used. Can somebody explain the use cases for which Node.js is used in the frontend.
Also for a fairly complex system such as a CMS(Content Management System) for an e-commerce site, would Node.js be the right choice?
Thanks in advance
Node.js is a javascript runtime that uses the Chrome V8 javascript engine. The front-end already uses a javascript engine on the browser (V8 for Chrome, SpiderMonkey for Firefox, Chakra for Edge), so whether Javascript is running in the browser on in Node.js, you can expect very similar environments.
However, you might be interested in using Node.js modules on the front-end. The modules are packaged using a tool called npm. You can use module loaders or bundlers like Browserify, webpack, or Rollup.js to accomplish this.
You'd usually use Node.js and its ecosystem as part of your toolchain when developing frontend applications, but the deployed application will still be regular JavaScript that runs in the user's browser. You can use Node's package manager npm instead of Bower for managing your frontend dependencies, for instance.
And there's Browserify which will let you use npm packages that were designed for Node in your frontend JavaScript application (that runs inside the user's browser).

Categories

Resources