Allegro.cc - Online Community

Allegro.cc Forums » Off-Topic Ordeals » Need to learn Node.js

This thread is locked; no one can reply to it. rss feed Print
 1   2 
Need to learn Node.js
Doctor Cop
Member #16,833
April 2018
avatar

A few days earlier everything was great. I was doing freelancing in PHP and there was an abundant of freelancing projects in PHP but now suddenly I am unable to find new PHP projects, what I am getting is maintenance or issue resolving jobs on freelancing platforms.

I researched it and found that everyone is switching to Node.js and that could be the reason. Many are saying that PHP is going to die and even clients prefer Node for some reason.

So I decided to learn Node.js and I started from Tutorialspoint and ended up on W3Schools.com, they are good but I need an easier one that can teach me enough that I can make APIs in it.

Please help me and if there is a Node.js person who can give me some tips then it will be great.

Edgar Reynaldo
Member #8,592
May 2007
avatar

bump for update

So you're learning Node.js, how is your plain JavaScript? Are you comfortable working with the DOM?

Simon Parzer
Member #3,330
March 2003
avatar

From what I've seen, Node.js is still under heavy development. The underlying technology is the V8 JavaScript engine, which also powers Google Chrome.

You probably want to learn a framework instead of doing plain Node.js. If you're coming from PHP and want to do "classic" websites, look into Express.js
For Webapps, there is React and AngularJS. These are very popular and backed by Facebook and Google, respectively.
To learn a framework, don't go to w3schools, instead look at the official docs/tutorials.

The big strength of Node.js is the package manager NPM, where you have a huge repository of open-source packages.
For example, let's say you need a date/time picker component, you just look it up, npm install the package and you can use it right away without having to deal with the underlying code.

Doctor Cop
Member #16,833
April 2018
avatar

Hi, Edgar.
My plain JavaScript is good now and I am able to manipulate DOM somewhat but the problem now I have is that I'm having difficulty in front end. I followed tutorials point for Node.js tutorial and I learned Express.js too, although it seems a bit more complicated than Node itself because I don't know where the res and req come from. Everything else is great and I'm able to make APIs now, but I'm having difficulty with front end. I wasted my two days with Bootstrap trying to make sense of it and CSS grid was easier than Bootstrap so I think I should use it instead of Bootstrap but what if I have to use it in some projects? Then it will be bad for me.

If you can tell me some resources on Frontend so I can learn it easily because official docs aren't helpful and tutorialspoint is better than W3schools but not that helpful.

Simon, thanks for the tip but I'm already familiar with them, just not angular and react at this time. If you can tell me some good sources to CSS tips? I know CSS but still I have trouble finding how to do certain things in it.

bamccaig
Member #7,536
July 2006
avatar

There's not really an easy button for front-end unfortunately. I've been doing Web development for about 12 years now, and I am still pretty terrible at frontend too. :(

I recommend you just do tutorial after tutorial of Web page layout and fancy effects and things until you develop a passion for it and a strong toolbox to work from...

Doctor Cop
Member #16,833
April 2018
avatar

Only if there was a way to position elements using pixels only like we do in allegro, but I doubt that they will ever give us that power (the browser standards).

Edgar Reynaldo
Member #8,592
May 2007
avatar

It's called

position:absolute;

and

position:fixed;

.

Do yourself a favor and learn CSS. It's what everything else is based off of, along with DOM manipulation.

bamccaig
Member #7,536
July 2006
avatar

The problem with pixel-perfect layouts is that they only work on devices they were designed for. And they often don't work optimally unless the device was built specifically to match the software.

Games typically have multiple resolutions that they support, and they generally need to have multiple versions assets in different sizes and ratios to match (or it can be scaled at runtime, but might hurt quality doing so).

The Web is designed to be documents first (text, images, and style/layout instructions). Ideally, a document should be able to be rendered on any device, and still be readable/usable. It is up to the browser to figure out how to render the content on a given device given its limitations. HTML and CSS give us the ability to give instructions to render the contents either statically-sized, or dynamically-sized based on the size and ratio of the browser window/screen. The latter is best because users with large screens get to take advantage of it, but users with smaller screens aren't prevented from accessing the content.

Yes, it's very difficult to really understand how to lay things out in HTML/CSS in a nonstandard way. Anything is possible, as has been demonstrated by Web design gods, but there are often hacks/workarounds that you need to memorize to achieve it because the straightforward way doesn't always work for various reasons.

Doctor Cop
Member #16,833
April 2018
avatar

Thanks bamccaig for the advice, I know now that it is very important for web documents to scale so they have to be that way but even in games how to find what the screen size is?

Edgar Reynaldo
Member #8,592
May 2007
avatar

You should keep working on CSS and the DOM.

The document element of any web page in a browser will tell you the exact dimensions of the browser's viewport.

Listening to onresize events will let you know when it changes.

Polybios
Member #12,293
October 2010

Node itself is not about the DOM at all, it's basically Google's Javascript engine plus I/O.

You want "responsive" design, no one listens to resize events. :P

By the way, I wonder whether my job's information security department knows what an npm i does. ;D

dthompson
Member #5,749
April 2005
avatar

JavaScript is my day job for all intents and purposes, so I'm going to weigh in here. ;)

I think we need to separate some concerns here. JavaScript is just a language; its culture is what so often positions it as a web-first (or worse, web-only) language. This is largely because of its origin as Brendan Eich's weekend project, and thus (at first) being the only means of accessing web APIs on the client side. Incidentally, server-side JavaScript - like Node - was around as early as 1995, and this disgusting relic of the past confirms that!

Anyway, Node itself has a lot of pretty good APIs for more general scripting and server-side development. I'd therefore encourage learning it, but not without some warnings:

  • Whilst I wouldn't say Node.js is still "under heavy development" at all - at least not on the LTS branch, which you should be using (currently version 10) - the ubiquity of JavaScript libraries and frameworks can be confusing to newcomers (which leads me onto...)

  • npm's hypermodularity is a both a blessing and a total fucking pain in the ass. Try and find modules without too many dependencies if you're building anything where you need to manage security.

  • You'll soon come across Babel - sorry in advance.

One more thing and then I'll shut up:

Polybios said:

You want "responsive" design, no one listens to resize events. :P

Yes, for goodness sake, use CSS as much as you possibly can - I believe JavaScript is the origin of the term 'spaghetti code', which you'll begin to understand very quickly if you're using it to update a page's layout on resize events :P

______________________________________________________
Website | Where my website used to be
This isn't a game!

Doctor Cop
Member #16,833
April 2018
avatar

Polybios I was talking about games, like is it same for games too? like games made in javaScript use only CSS for styling and positioning?
Would it be easy that way? If you could just give me an example so that it would be clear to me.

dthompson, I am feeling very frustrated while learning Node.js frameworks and especially the AWT and passport are confusing and I learned all the JavaScript and Node + Express + MongoDB in one month. Did I rush it? Or AWT and passport in fact are confusing.

Edgar Reynaldo
Member #8,592
May 2007
avatar

dthompson said:

Polybios said:

You want "responsive" design, no one listens to resize events. :P

Yes, for goodness sake, use CSS as much as you possibly can - I believe JavaScript is the origin of the term 'spaghetti code', which you'll begin to understand very quickly if you're using it to update a page's layout on resize events :P

How else can you change the layout of the page without using JS?

Polybios
Member #12,293
October 2010

Polybios I was talking about games

Wait... This started with PHP jobs and how Node could substitute for PHP, clearly somehow Web development backend related. Then Edgar talked about the DOM which only exists in a browser (in the frontend) and now you were talking games all along...?

I think games are a totally different subject; I've never done any JS games neither in a browser nor with a Node framework that could also be non-browser. Even in a browser, you would not have to use HTML / CSS but could also just render into e.g. a canvas object.

How else can you change the layout of the page without using JS?

CSS media queries.

Edgar Reynaldo
Member #8,592
May 2007
avatar

Doctor Cop
Member #16,833
April 2018
avatar

Polybios, welcome to our world. Here's a link for starters.

Peter Hull
Member #1,136
March 2001

Polybios was commenting on that thread before you even joined a.cc, Doc!

Re: games you could look at https://phaser.io/ or http://www.melonjs.org/ (there are others, but I've never used them)

Edgar Reynaldo
Member #8,592
May 2007
avatar

If you want to program games in Javascript, you should take a look at Momo, Eric's js library and his games. Where'd that bugger Eric Johnson go? I need your sig....

Found it :

https://github.com/ecj2/momo

Long story short, draw everything using a canvas object. (HTML5)

dthompson
Member #5,749
April 2005
avatar

How else can you change the layout of the page without using JS?

You'd want to use media queries. They're a bit unwieldy in normal CSS, but using them in SCSS (especially with mixins) is a dream

______________________________________________________
Website | Where my website used to be
This isn't a game!

Edgar Reynaldo
Member #8,592
May 2007
avatar

Well, you still need to use javascript, but media queries are pretty cool.

bamccaig
Member #7,536
July 2006
avatar

You don't "need" to use JavaScript. You can accomplish dynamic layouts using just CSS with media queries. Sure, you can add some extra flare with JavaScript, like calendar controls and things, but for just changing the layout of a page on the fly as the device parameters change you can do this entirely with CSS.

Edgar Reynaldo
Member #8,592
May 2007
avatar

I didn't read close enough.

But it doesn't look like it will respect orientation changes without javascript listening to the media object.

I'll try it and post back.

Apparently that works. Just call me Doubting Thomas...

bamccaig
Member #7,536
July 2006
avatar

What you do is define different styles for different media queries. When the device parameters change (e.g., resize the window to fit a different query) the Web page should automatically react by restyling to a new layout to match the new orientation. You can test it with something like this:

#SelectExpand
1<!DOCTYPE html> 2<html> 3 <head> 4 <title>Media Queries Example</title> 5 <style type="text/css"> 6 body { 7 background-color: pink; 8 } 9 10 @media only screen and (max-width: 600px) { 11 body { 12 background-color: lightgreen; 13 } 14 } 15 </style> 16 </head> 17 <body> 18 <p>Resize the window to see it react automatically.</p> 19 </body> 20</html>

If you resize the window to be less than 600 pixels wide then the background color automatically changes. No scripting required.

Edgar Reynaldo
Member #8,592
May 2007
avatar

That's cool.

Are Media Queries CSS3 only? Not that that matters anymore.

 1   2 


Go to: