 Resources from Akash Gutha in 2024

The Hypertext Transfer Protocol (HTTP) is an application-level protocol for distributed, collaborative, hypermedia information systems. It is a generic, stateless, protocol which can be used for many tasks beyond its use for hypertext, such as name servers and distributed object management systems, through extension of its request methods, error codes and headers.

http

Previously to tackle manual restarts due to server crashes , process management tools were used. 

Forever is one such module that is runs on the node ecosystem. So, we need not move away from the rich ecosystem of Node.js.

Use ``` npm install --global forever ``` to install forever module globally.
 

Running your server forever using forever in Node.js

Cascading Style Sheets bring order and beauty to our applications.

We will understand the Bootstrap grid system by creating a sample HTML page which is responsive to width changes. 
We will use Bootstrap 3 for this lesson.

[Link for Bootstrap setup](http://getbootstrap.com/docs/3.3/getting-started/#download)

Understand the Bootstrap Grid system

TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

typescript

Typescript 2.5 has brought a couple of interesting changes to the table. let's take a look at these new features and how to take advantage of these features.

Optional catch clauses: TypeScript 2.5 brings a new ECMAScript-bound feature for making catch clauses optional. Most of the time, you’ll find yourself writing a try/catch but not really caring about the thrown error. So Typescript provides you some syntactic sugar for omitting the error paramter.

Avoid Catching Errors with TypeScript 2.5 Optional Catch Clauses

JavaScript® (often shortened to JS) is a lightweight, interpreted, object-oriented language with first-class functions, most known as the scripting language for Web pages, but used in many non-browser environments as well such as node.js or Apache CouchDB. It is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional programming styles.

javascript

Introduction to the new includes method included in the ES2016 specification for the Array data structure.
Review of the previous methods followed, also some complicated examples to get out heads around the new functionalities provided using the includes function.

Array Includes method in ES2016 - ES7

In this lesson, we will create a fluid loading animation using Animations and Transformations in CSS3.

Summary:
1. Use keyframes to animate.
2. Add animation property to the required division.
3. Add in an appropriate Transition time.
4. Play with the easing function to get a smooth animation.

Build a Fluid Loading Animation in CSS

Bootstrap makes building a carousel control a breeze. For Bootstrap carousel to work, we should include Jquery and Bootstrap's javascript module.

Carousel has 3 parts:
1. Slider
2. Slider Controls
3. Indicators 

**To setup Bootstrap:**

http://getbootstrap.com/docs/3.3/getting-started/#download




Build a Carousel Control using Bootstrap

React is one of the web’s most popular frameworks for building JavaScript applications. 

If you know what you’re doing, React can drastically simplify how you build, use, and maintain code.

Whether you’re a React newbie or you’re ready for advanced techniques, you can level-up with egghead. Explore our in-depth courses, lessons, and community resources to build more powerful applications and crack open your career.

react

In this lesson, we will cover a popular image processing component in the react eco-system for image processing.

The Library is react-imgpro.

**Installation:**

> npm install --save react-imgpro

**Include it as a module :**
> import ProcessImage from 'react-imgpro'

The documentation and the source files can be found here: 

https://github.com/nitin42/react-imgpro



Process images in React with react-imgpro

Typescript 2.5 adds JSDoc type assertion support for javascript file via ts-check service.

Type check JavaScript files using JSDoc and Typescript 2.5

Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.

node

Understanding the basics of botbuilder sdk by microsoft, and exploring the basic bot setup to run and respond to messages on any command line client.

The botframework provides two connector classes ConsoleConnector, ChatConnector.

1.  To setup connection to the terminal we used the ConsoleConenctor class
2. Though in production environment you would like to deploy the bot on to various platforms like facebook, skype, slack etc. the ChatConnector class provides the functionality to do this.
3. The Chat Connector setup is a bit more complicated, yet doesn't affect the actual logic that you will build your bot on.

Create a Hello bot using Microsoft Botbuilder SDK in Node.js

We will use the React-Remarkable library to render markdown onto our React DOM.
This library uses the Remarkable library to render markdown.

**Installation Guide**

npm install --save react-remarkable


**Importing Guide**

import Markdown from 'react-remarkable'

Render Markdown using React with React-Remarkable

A brief introduction and review of the exponent operator in ES2016 and review previous methods being followed.
We will also look at some examples that demonstrate the behaviour of the exponent operator.

Exponent operator in ES2016 - ES7

HTML 5 is the structure of our web pages. It is the markup that represents the DOM (document object model).

html

We will create an interesting animated hamburger that can be used in websites.
In this process, we will look at transitions and transformations in CSS3.

**Further Links:**

1. https://codepen.io/tag/hamburger%20menu/
2. https://codepen.io/designcouch/pen/Atyop

Create an Animated Hamburger using HTML5 and CSS3

This lesson covers the Refactoring services and Quick fixes provided by Typescript 2.5

Refactor Services and Quick Fixes with Typescript 2.5

In this lesson we will understand the For Of loop in Javascript which was introduced in ES6. The for-of loop lets you iterate of an itterable object (array, string, set, or map) and returns each objects value in  a specified variable. This excludes plain objects as we will see in the lesson.

Iterate Over Items with JavaScript's for-of Loop

Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.

This lesson explores what git ignore files are and automating the creation of git ignore files.

The methods covered in this lesson for creating git ignore files are :

1. Manual Method
2. Using Github Site
3. using an IDE
4. using Gitignore.io

Create Automated .gitignore Files for Your Project

npm is the package manager for JavaScript. Find, share, and reuse packages of code from hundreds of thousands of developers — and assemble them in powerful new ways.

In this lesson, we will look at a node module `nodemon` which stands for `node-monitor`.
it enables us to do continuous development by monitoring our files for changes and re-running our file when it detects any changes. this is helpful while we are developing and want to see the changes continuously without waiting.

to install nodemon run `npm install --global nodemon` in the cmd or terminal.

Continous iterative development in Node.js using nodemon

The `Object.entries()` function is an addition to the ECMAscript scpec in Es2017. This allows us to iterate through the properties of an object and read the entries as keys and objects.

Iterate over properties of an object with ES2017 Object.entries()

This lesson take an extensive look at the addition of the Object.values functions, how they can be used to gather information about the values of an object’s own enumerable string-key properties

Iterate over values of an object with ES2017 Object.values()

Property descriptors describe the attributes of a property (its value, whether it is writable, etc.). 

We will look at `Object.getOwnPropertyDescriptors()` and present different use cases that it can be used in such as `cloning objects`, `copying properties into an object`.

Property descriptors are not available in all browsers, example code will be added when available.

Clone Objects and Copy Properties with ES2017 Property Descriptors

Image loading in react is `Error-Prone` and has no fallback by default. This issue can be solved using `Error Boundaries`.
However, the one solution is to use an existing library and in this lesson, we are going to look at `react-graceful-image` and the `Image` component it provides.

Graceful Image loading in React using react-graceful-image

In Javascript, all function arguments are optional by default. That means if you ever forget to pass a critical parameter, the code will just fail without warning you what went wrong. 

There are `many` workarounds for this, and in this lesson, you will learn one of the easiest and foolproof methods of solving this problem.

Topics

Instructors

Content Type

Akash Gutha