In my current project, we’re using TypeScript (rather than pure Javascript) for a large-scale application with Node.JS on the server side. And I think it’s really awesome🌹 There’s abit of a learning curve at the start but eventually you come to really appreciate the benefits that it offers❤️️
So here’s a brief introduction of what it is and why you may want to consider using it.

What is TypeScript?

• TypeScript is an open source programming language that is developed and maintained by Microsoft in 2012
• TypeScript is designed for large-scale JavaScript application development
• TypeScript brings ‘types’ (or datatypes) to JavaScript.
• TypeScript is a…

To handle asynchronous Javascript, callbacks were first used but it had major cons like callback hell. Then came about promises to try to improve things. However, .then chains can also get nested and confusing.
So now, we have async/await, which was introduced in NodeJS 7.6 and is currently supported in all modern browsers.

The async/await syntax allows you to work with promises in a cleaner fashion. It makes asynchronous code easier to read and understand. However, it is important to note that async/await is actually just syntax sugar built on top of promises. …

ES6 introduced a number of significant improvements to the language, including de-structuring of Objects and Arrays.

Array Destructuring

Traditionally, to access elements in an Array, you would do so with their index number like so:

const array = [1, 2, 3];console.log(array[0])
// 1

Javascript ES6 allows you to assign the array to another array that contains variables in the same index as the element you need.

You can do this:

const array = [1, 2, 3];const [first, second, third] = array;console.log(first, second, third); 
// 1 2 3

This works well for simple arrays. However, if you only want to…

Promises are widely used instead of callbacks. Promises are a great feature in Javascript that enable you to avoid callback hell, especially when you need to wait on a response from multiple API requests that are asynchronous.

A Promise is a special Javascript object that represents the eventual result of an asynchronous action. A promise is kind of a proxy for a value that we don’t have yet.

A promise object has 2 internal properties:
1. PromiseStatus
2. PromiseValue

A promise can be in 1 of 3 states:
1. Pending
2. Fulfilled — action fulfilled successfully
3. …

We will use a simple function called calculateSquare to demonstrate how to handle errors in asynchronous Javascript code.

In order to simulate an asynchronous function, we will use setTimeout:

function calculateSquare(number, callback) {  
  setTimeout(() => {
    const result = number * number;    
    callback(result); 
  }, 1000);
}let callback = (result) => {
  console.log('Result from calculateSquare: ' + result)
}calculateSquare(2, callback);

Run the code above and everything works.

But what happens when this function gets a String instead of a Number type? We would get NaN (not a number) for the result. This needs to be handled.

function calculateSquare(number, callback)…

If you use Node.js for your applications, you may want to use different versions of Node. Fortunately, there is a tool to manage them all using Node Version Manager.

Node.js

For a work project, I needed to include a wizard form with 2 questions on each page. To get the total page count, I divided the total number of questions by 2 and then rounded it off to the nearest integer. There were however some problems with that implementation and a more efficient solution was required.

My tech lead pointed out the usage of Array chunking. So this is how it works:

In the above, we define a function named Chunk which takes in 2 parameters: an original array and the chunk size.

Then, we define a temporary array…

Javascript Templating

Javascript templating is a fast and efficient technique to render client-side view templates with Javascript by using a JSON data source. The template is HTML markup, with added templating tags that will either insert variables or run programming logic.

The template engine then replaces variables and instances declared in a template file with actual values at runtime, and convert the template into an HTML file sent to the client.

Mustache