Node Toolchain for Newbies: The Best Node Apps and Libraries to Increase Productivity

I get this question very often: “What tools would you recommend for Node development?” Software engineers love to optimize and increase productivity instead of wasting their time. I bet you are one of them! Read on to find out the best Node tools for development.

  • IDEs/code editors
  • Libraries
  • GUI tools
  • CLI tools

IDEs/code editors

When it comes to your primary tool, the code editor, I recommend sticking with lighter and simpler editors like Atom or VS Code instead of full-blown IDEs like Webstorm. Of course an IDE will do more for you but this comes with a learning curve and the need to configure. Node is interpreted, thus there’s no need to compile it. The files are just plain text files with the .js extension.

title
title

Here’s my list of the best Node editors:

  • Atom: created and maintained by GitHub; uses Electron, HTML, JS and CSS under the hood which makes it very easy to customize or add functionality; allows to have Git and terminal support via packages. Price: free.
  • VS Code: a newer addition; uses similar to Atom web-based tech; was created from Azure’s Monaco editor; comes with debugging, smart autocomplete based on types, Git and terminal support. Price: free.
  • WebStorm: more of an IDE than an editor, developed by JetBrains and based on IntelliJ platform; has code assistance, debugging, testing, Git. Price: starts at $59/yr for individuals.

There are more options like Brackets, Sublime Text 3 and of course IDEs like Eclipse, Aptana Studio, NetBeans, Komodo IDE, and cloud-based like Cloud 9, Codenvy.

What to pick? Any of the three in the list is good choice. I have heard good things about VS Code and their smart autocomplete is a nice thing, but I didn’t find it a good enough reason for me to switch from Atom. So try VS Code and Atom and see which one you like more. Both of them offer a wide variety of packages and themes.

The most popular and useful libraries and project dependencies

Here’s the list of the most used and most popular modules which you would install as dependencies of your projects. Node developers use most of these modules (or alternatives) in almost all of their projects.

The libraries are listed with the npm names, so you can execute npm i {name} substituting {name} with the name of the package/module:

  • webpack: Builds static assets like browser JavaScript, CSS and even images. It allows to use node modules in the browser.
  • babel: Allows to code in the latest versions of JavaScript/ECMAScript without having to worry about your runtime by converting the new code to the code compatible with older versions of ECMAScript
  • axios: Makes HTTP requests
  • express: the most popular Node web framework
  • mongoose: MongoDB object-document mapper library
  • sequelize: PostgreSQL object-relational mapper library
  • socket.io: Real-time library with support of Web Sockets and others.
  • cheerio: jQuery syntax for working with HTML-like data on the server
  • node-oauth: Low-level but very mature and tested library to roll out any OAuth integration
  • passport: OAuth library to quickly integrate with major services
  • yargs
  • shelljs
  • mocha: Testing framework
  • async: Controls flow by running function concurrently, sequentially or any way you want
  • concurrently: Allows to execute CLI tools (local) as multiple processes all at the same time, e.g., webpack and node-static.

Note: Some of the libraries/tools listed above like webpack or mocha, can be installed globally instead of locally in your project folder. However, installing them globally is an old practice and currently is an anti-pattern because local installation allows developers to use multiple versions of the tool with different projects in addition to have these tools specified in package.json.

 

Of course there are a lot of different options in each category. For example, request and superagent are also extremely popular HTTP agent libraries. However, I don’t want to give too many options and confuse you with the differences, I listed only one tool (typically the one I use the most currently).

CLI tools (global)

pm2 in action
pm2 in action

Unlike the previous section, these tools are okay to install globally since most likely their version won’t affect or break your project.

  • node-dev: Monitor and restart your Node app automatically on any file change within the current folder
  • node-static: Serve files over HTTP web server
  • node-inspector: Debug Node code in a familiar interface of DevTools (now part of Node starting with v7)
  • docker: Build and run Docker containers to isolate app environment, speed up deployment and eliminate conflicts between dev and prod (or any other) environments
  • curl: Make HTTP(S) requests to test your web apps (default for POSIX but can get for Windows too)
  • nvm: Change Node versions without having to install and re-install them each time
  • wintersmith: Build static website using Node templates and Markdown
  • pm2: Process manager to vertically scale Node processes and ensure fail-tolerance and 0-time reload

GUI tools

MongoUI in action
MongoUI in action

A good share of Node developers prefer GUI (graphical user interface) tools at least for some of the tasks because these tools require less typing and have features which makes them more productive and the development easier and simpler.

  • Postman: HTTP client with ability to save requests and history, change formats (JSON, form, etc.) and do other things
  • MongoUI: Modify and inspect your MongoDB data in a web interface. You can host this web app on your server to enable the database management.
  • Chrome: DevTools is a great way to inspect your requests, network, traffic, CPU profiles and other developer related data which is very useful for debugging
  • iTerm, itermocil and zsh: A better alternative to a native macOS Terminal app which together with itermocil and zsh increases productivity greatly
  • SourceTree: Visual git trees and histories

If you liked this post, next step is to understand the Node platform better. For this reason, check out this FREE course You Don’t Know Node.

ES 7 and ES8 Features

Recently I wrote a blog post and even created an online course on ES6/ES2015. Guess what? TC39—the mighty overseer of JavaScript—is moving forward with ES8 so let’s cover ES7 and ES8 (or ES2016 and ES2017 officially). Luckily, they are much, much, much smaller than the best of a standard that was ES6. Really! ES7 has only two (2) features!

ES7 features:

  1. Array.prototype.includes
  2. Exponentiation Operator

ES8 is not finalized yet as of this writing (Jan, 2017) but we can assume all finished proposals (stage 4) and most of stage 3 (more on stages here and in my course). The finished 2017 (ES8) proposals are:

  1. Object.values/Object.entries
  2. String padding
  3. Object.getOwnPropertyDescriptors
  4. Trailing commas in function parameter lists and calls
  5. Async Functions

I won’t include stage 3 proposals in this post, but you can check the status of proposals from stage 1 to 3 here.

Let’s dive deeper into the proposals and features…

The rest of the article: https://node.university/blog/1621685/es7es8.

Beautiful Node APIs

This post is on how to build beautiful APIs in Node.js. Great, and what is an API? The definition says Application Programming Interface, but what does it mean? It could mean on of the few things depending on the context:

  • Endpoints of a service service-oriented architecture (SOA)
  • Function signature
  • Class attribute and methods

The main idea is that an API is a form of a contract between two or more entities (objects, classes, concerns, etc.). Your main goal as a Node engineer is to build beautiful API so that developers who consume your module/class/service won’t be cursing and sending you hate IM and mail. The rest of your code can be ugly but the parts which are public (mean for usage by other programs, and developers) need to be conventional, extendable, simple to use and understand, and consistent.

Let’s see how to build beautiful APIs for which you can make sure other developer

Continue reading “Beautiful Node APIs”

React Native Quickly: Start Learning Native iOS Development with JavaScript NOW!

This book is a guide on getting started with React Native for mobile iOS development. You can find source code and the manuscript in https://github.com/azat-co/react-native-quickly. You can read this book online here, or at reactnativequickly.com, or if you prefer videos, you can watch project videos at Node.University: http://node.university/courses/react-native-quickly.

In this book, I’ll introduce you to React Native for native mobile iOS and Android development… and do it quickly. We’ll cover topics such as

  • Why React Native is Awesome
  • Setting up React Native Development for iOS
  • Hello World and the React Native CLI
  • Styles and Flexbox
  • Main React Native UI components
  • Importing Modules into an Xcode Project
  • Project: Timer
  • Project: Weather App

This book is about getting started with React quickly and not about React Native, which is technically a separate library (or some might even call it a framework). But I figured after eight chapters of working with React for web development, it would be fun to apply our knowledge to mobile development by leveraging this awesome library. You’ll be amazed how many React Native skills you already know from React.

Continue reading “React Native Quickly: Start Learning Native iOS Development with JavaScript NOW!”

3 Conferences in 4 Days: NodeSummit, ForwardJS and npmCamp 2016

Last week was very fruitful on conferences. Luckily, there were all in the Bay Area so I didn’t have to travel. I spoke at NodeSummit and ForwardJS, and attended npmCamp. At all of them, I met old friends and made new ones. All of them were great but in different way.

NodeSummit 2016


NodeSummit started on Tuesday with Executive Roundtable which consisted of tech leads from major companies most of you’re familiar with like Netflix, Disney, Dictionary.com, New York Times, me representing Capital One and others totally 12 or so. It’s the first time Joyent put together this round table. It was interesting to hear how other people use Node.js, their pains and wins. Sorry, but I can’t tell you anything more because we all swore to secrecy and weren’t allowed to record anything.

Continue reading “3 Conferences in 4 Days: NodeSummit, ForwardJS and npmCamp 2016”

Reactive Web Stack: 3RES – React, Redux, RethinkDB, Express, Socket.io

This post has been written by Scott Hasbrouck. You can find him on Twitter or his website.

It’s been nothing but wonderful to see JavaScript truly catch fire the past few years in web technology, ultimately becoming the most used language in 2016, according to StackOverflow data. My history with JavaScript began about 15 years ago, not all that long after it was first released as part of Netscape Navigator 2, in 1996. My most used learning resource was DynamicDrive, and their tutorials and code snippets of “Dynamic HTML” or DHTML – a term coined by Internet Explorer 4. Really, DHTML was a set of browser features implemented with JavaScript, CSS, and HTML that could get you nifty elements like rollover buttons and stock tickers.

Fasting forward to today, we now live in a world where JavaScript has grown to take over web technology. Not just in the browser, but it is now the most popular backend language according to that same StackOverflow report! Naturally, there are always those who dislike the language citing things like the ease of creating a global variable, or null being an object and undefined being its own datatype. But I’ve found that every language I pick up has quirks that are easily avoidable once you learn to properly use it. And we do want to become experts in our craft and truly learn to master our tools, do we not?

Continue reading “Reactive Web Stack: 3RES – React, Redux, RethinkDB, Express, Socket.io”

You Don’t Know Node: Quick Intro to Core Features

This essay was inspired by the Kyle Simpson’s series of books, You Don’t Know JavaScript. They are a good start with JavaScript fundamentals. Node is mostly JavaScript except for a few differences which I’ll highlight in this essay. The code is in the You Don’t Know Node GitHub repository under the code folder.

Why care about Node? Node is JavaScript and JavaScript is almost everywhere! What if the world can be a better place if more developers master Node? Better apps equals better life!

This is a kitchen sink of subjectively the most interesting core features. The key takeaways of this essay are:

  1. Event loop: Brush-up on the core concept which enables non-blocking I/O
  2. Global and process: How to access more info
  3. Event emitters: Crash course in the event-based pattern
  4. Streams and buffers: Effective way to work with data
  5. Clusters: Fork processes like a pro
  6. Handling async errors: AsyncWrap, Domain and uncaughtException
  7. C++ addons: Contributing to the core and writing your own C++ addons

Event Loop

We can start with event loop which is at the core of Node.

Node.js Non-Blocking I/O
Node.js Non-Blocking I/O

It allows processing of other tasks while IO calls are in the process. Think Nginx vs. Apache. It allows Node to be very fast and efficient because blocking I/O is expensive!

Take look at this basic example of a delayed println function in Java:

System.out.println("Step: 1");
System.out.println("Step: 2");
Thread.sleep(1000);
System.out.println("Step: 3");

It’s comparable (but not really) to this Node code:

console.log('Step: 1')
setTimeout(function () {
  console.log('Step: 3')
}, 1000)
console.log('Step: 2')

Continue reading “You Don’t Know Node: Quick Intro to Core Features”

Meeting React.js: An Excerpt from ‘React Quickly’

This is an excerpt from React Quickly (Manning, 2016). You can download the entire first chapter for free at Manning. The book is scheduled for release in the first quarter of 2016, but MEAP is available right now. Use code “mardandz” to get 39% off.

Each chapter has a project which is supplemented by a video screencast hosted on YouTube.

React Quickly Screencasts
React Quickly Screencasts

Project: Menu with React.js

The project for this article will be minimal. The idea is to have a dynamically generated menu which will consist of <a> tags.

We’ll use custom React components Menu and Link. They way we create them is similar to the way we create the HelloWorld component in the previous example. The project will show you how to render nested elements programmatically. In the previous examples, we just coded the children manually. We’ll use the map() function for it.

Continue reading “Meeting React.js: An Excerpt from ‘React Quickly’”

React Quickly Screencasts

Each chapter of my new book React Quickly (Manning, 2016) has a project which is supplemented by a video screencast. Watch the videos here or on YouTube. The code is on GitHub.

React Quickly
React Quickly

Also, you can download the entire first chapter for FREE at Manning. The book is scheduled for release in the first quarter of 2016, but early access (e-copy) is available right now. Use code “mardandz” to get 39% off at Manning.

React Quickly Chapter 1 Project: Menu with React:

Continue reading “React Quickly Screencasts”

Full Stack JavaScript

My new book Full Stack JavaScript (my 4th traditionally-published book) comes with a series of screencast videos for better immersion in a wonderful and mesmerizing world of Node.js, Backbone and MongoDB. It’s a one thing to read through the text and another to follow up with dynamic videos which walk you through the book’s projects.

Full Stack JavaScript
Full Stack JavaScript

The videos and the source code are open source, meaning they are publicly available. Therefore, you don’t have to buy a book—you can just watch the 14 videos on YouTube (playlist) and go through the code on GitHub (repository).

Continue reading “Full Stack JavaScript”

ExpressWorks Walkthrough: Node.js Web Framework [VIDEOS]

Have you ever wanted to learn basics of Node.js and the most popular Node.js web framework Express.js? If you are experienced web developer or software engineer who wants to learn Node.js and build some servers along the way, then this self-study workshop is for you.

What is ExpressWorks? It’s an automated tool which allows to learn Express.js from the author of one of the best books on Express.js—Pro Express.js— with this workshop that will teach you basics of Express.js and building Node.js web apps (a.k.a. servers).

You will walk through adventures via command-line interface. Each adventure has a problem, hints, and the solutions.

Some of the resources before you get started:

The entire playlist: on YouTube or just watch individual solutions below. Try solving problems without looking at the solutions!

Setup:

Continue reading “ExpressWorks Walkthrough: Node.js Web Framework [VIDEOS]”

Top 10 ES6 Features Every Busy JavaScript Developer Must Know

I recently went to HTML5 Dev conference in San Francisco. Half of the talks I went to were about ES6 or, as it’s now called officially, ECMAScript2015. I prefer the more succinct ES6 though.

This essay will give you a quick introduction to ES6. If you don’t know what is ES6, it’s a new JavaScript implementation. If you’re a busy JavaScript software engineer (and who is not?), then proceed reading to learn the best 10 features of the new generation of the most popular programming language—JavaScript.

Here’s the list of the top 10 best ES6 features for a busy software engineer (in no particular order):

  1. Default Parameters in ES6
  2. Template Literals in ES6
  3. Multi-line Strings in ES6
  4. Destructuring Assignment in ES6
  5. Enhanced Object Literals in ES6
  6. Arrow Functions in ES6
  7. Promises in ES6
  8. Block-Scoped Constructs Let and Const
  9. Classes in ES6
  10. Modules in ES6

Continue reading “Top 10 ES6 Features Every Busy JavaScript Developer Must Know”

The Astonishing Power of High Performance JavaScript, Without The Headache or A Steep Learning Curve

Stop struggling to code front-end the hard way. React.js is performing fast DOM manipulations and is easy to learn.

I stumbled upon some guy from Zurich, Switzerland who was arguing that you don’t need MVC (model, view, controller) with React.js.

What?

I love controversial topics! How refreshing to hear such a brave opinion after almost a decade of MVC-domitaion.

VIDEO —>>>> The Astonishing Power of High Performance JavaScript, Without Headache or Steep Learning Curve from Azat Mardan on Vimeo.

Continue reading “The Astonishing Power of High Performance JavaScript, Without The Headache or A Steep Learning Curve”

JavaScript and Node FUNdamentals is Finished

JavaScript and Node FUNdamentals: A Collection of Essential Basics is a short read to brush up and refresh JavaScript and Node.js topics including frameworks like CoffeeScript, Backbone.js and Express.js. The motto of the book is “If it’s not fun, it’s not JavaScript.

JavaScript and Node FUNdamentals: A Collection of Essential Basics
JavaScript and Node FUNdamentals: A Collection of Essential Basics

JavaScript and Node FUNdamentals has these chapters:

  1. JavaScript FUNdamentals: The Powerful and Misunderstood Language of The Web
  2. CoffeeScript FUNdamentals: The Better JavaScript
  3. Backbone.js FUNdamentals: The Cornerstone of JavaScript MV* Frameworks
  4. Node.js FUNdamentals: JavaScript on The Server
  5. Express.js FUNdamentals: The Most Popular Node.js Framework

The book is available on Amazon.com (Kindle) and LeanPub (MOBI, PDF, EPUB).

Continue reading “JavaScript and Node FUNdamentals is Finished”

Node.js FUNdamentals: A Concise Overview of The Main Concepts

Node.js is a highly efficient and scalable non-blocking I/O platform that was build on top of Google Chrome V8 engine and its ECMAScript. This means that most front-end JavaScript (another implementation of ECMAScript) objects, functions and methods are available in Node.js. Please refer to JavaScript FUNdamentals if you need a refresher on JS-specific basics.

Note: This text is a part of upcoming ebook JavaScript and Node FUNdamentals: A Collection of Essential Basics.

Node.js is a highly efficient and scalable non-blocking I/O platform that was build on top of Google Chrome V8 engine and its ECMAScript. This means that most front-end JavaScript (another implementation of ECMAScript) objects, functions and methods are available in Node.js. Please refer to JavaScript FUNdamentals if you need a refresher on JS-specific basics.

Continue reading “Node.js FUNdamentals: A Concise Overview of The Main Concepts”

Breaking Bad (Loops in JavaScript Libraries)

JavaScript Libraries are important (e.g., jQuery, Lo-Dash, Underscore), but in the case of asynchronous loops (`forEach` and `each`) they create a lot of confusion… Lo-Dash is not equal to Underscore, unless a special underscore-compatible version is being used.

It was sort of a surprise for me when I discovered inconsistencies in the most popular JavaScript libraries in how they handle their each and forEach loops. This post compares:

  • forEach Loop in Native JavaScript
  • each Loop in Lo-Dash
  • each Loop in jQuery
  • each Loop in Underscore.js
  • forEach Loop in Underscore.js

forEach Loop in Native JavaScript

JavaScript Libraries are important (e.g., jQuery, Lo-Dash, Underscore), but in the case of functional loops (forEach and each) they create a lot of confusion (for loop can be broken with ‘break’). Let’s inspect the example of native JavaScript code for the forEach method:

[1,2].forEach(function(v){
  alert(v);
  return false;
})

This will display us two alert boxes. Try the native JavaScript code yourself in JSFiddle.

This is an expected behavior in most cases because with each iteration we invoke a new function. Unlike the for (var i=0; i<arr.length; i++) {} code that has no function/iterators.

Continue reading “Breaking Bad (Loops in JavaScript Libraries)”

Understanding Fat Arrows (=>) in CoffeeScript

The fat arrows (=>) are special function expressions that confuse even the smartest of developers. Most JavaScript professionals know that closure changes the meaning of this (@ in CoffeeScript).

There’s no reason to be afraid of fat arrows in CoffeeScript. They are time savers (and clarity achievers) when it comes to the nested functions and jQuery event handlers. When they are applied to class methods, the good rule of thumb is: use => when we need @ to be the object in which method is written; use-> when we need @ to be the object in which method is executed.

The fat arrows (=>) are special function expressions that confuse even the smartest of developers. Most JavaScript professionals know that closure changes the meaning of this (@ in CoffeeScript).

Continue reading “Understanding Fat Arrows (=>) in CoffeeScript”

Solving Programming Problems

Programming problems are not that much different from mathematics or physics problems. There are usually an input and an output to which someone needs to arrive by providing an algorithm. This algorithm is typically a function or series of functions.

Programming puzzles and toy problems are good exercises to sharpen skills and prepare for technical interviews. No wonder that more and more online coding schools (e.g., CodeAcademy) make those metal workouts main staple of their courses.

Beginner programmers might benefit by applying these steps to their process of solving a programming problem:

Programming problems are not that much different from mathematics or physics problems. There are usually an input and an output to which someone needs to arrive by providing an algorithm. This algorithm is typically a function or series of functions.

Programming puzzles and toy problems are good exercises to sharpen skills and prepare for technical interviews. No wonder that more and more online coding schools (e.g., CodeAcademy) make those metal workouts main staple of their courses.

Beginner programmers might benefit by applying these steps to their process of solving a programming problem:

Continue reading “Solving Programming Problems”

JS FUNdamentals: An Essential Overview of JavaScript

Programming languages like BASIC, Python, C has boring machine-like nature which requires developers to write extra code that’s not directly related to the solution itself. Think about line numbers in BASIC or interfaces, classes and patterns in Java.

On the other hand JavaScript inherits the best traits of pure mathematics, LISP, C# which lead to a great deal of expressiveness (and fun!).

More about Expressive Power in this post: What does “expressive” mean when referring to programming languages?

If it’s not fun, it’s not JavaScript.

Note: This text is a part of upcoming ebook JavaScript and Node FUNdamentals: A Collection of Essential Basics.

Expressiveness

Programming languages like BASIC, Python, C has boring machine-like nature which requires developers to write extra code that’s not directly related to the solution itself. Think about line numbers in BASIC or interfaces, classes and patterns in Java.

Continue reading “JS FUNdamentals: An Essential Overview of JavaScript”

Cisco, Node.js and other musings

The hands-on Introduction to Node.js training consisted of two days and started badly: I was late driving from Oakland to San Jose through traffic, and security personnel in the lobby took extra 15 minutes to clear and escort me to the classroom. Nevertheless, attendees quickly plunged into installing Node.js, Node Package Manager and MongoDB using hard copies of Rapid Prototyping with JS: Agile JavaScript Development that I brought with me.

Continue reading “Cisco, Node.js and other musings”