I faced the issue when updating the expired PKCS12 with the newly provided PKCS12 file in our server.

What it contains & why it is used?
PKCS12 file holds the certificates as well as the encrypted private key of the server. This file is then distributed to the clients to make a secure connection to the server’s REST endpoints.

The below is the exception which we received when updated the new file in our server. This is occurring when we are extracting the private key it appends with the redundant 0s leads to an Invalid Key Exception.

Invalid RSA Private key

How to resolve…


As we discussed already, Class Components are stateful which used several Lifecycle methods and Functional components are Stateless, In the previous story, we used React Hook method useEffect to make it stateful.

The React LifeCycle is mainly classified into three stages Mounting, Updating, UnMounting. All Class level components will go through these methods of the stages, and you can override the methods in your component to run code at the required place in the process.

LifeCycle of React Component

Table of Contents

The state is where you store the property values that belong to the component. Changing the state will automatically invoke the render method of React DOM and re-render the component. State is comparable to props, props can use across the components, but it’s specific to the component.

The below diagram shows the State initialization and how to read & update the State value.


Table of Contents

The component provides the solution for front-end complexity. It's just breaking the large pieces of complex UI parts into smaller pieces. So the component can be working independently and easily reusable.

The React component can write it in two ways, Class Component & Functional Components.

Before going to a detailed view about components, if you don’t have an idea about class. Please refer ES6 Class feature in our story and then continue.

Class Component

A class component requires you to extend from React. Component. The render() method must define in your subclass if the parent is React. Component. …


Table of Contents

ReactJS is a JavaScript library for building a user interface. It was developed by Facebook to create web applications or Complex UI. In microservice architecture how the services break the function of the application allows operating as an independent service. Similarly, each part of UI breaks into an independent component and reuses the same if required.

If you are not familiar with ES features, please go through the Es6 features that we have in our story list with practical examples in code pen. …


Table of Contents

In promises, the object creation starts the execution of asynchronous functionality. Here await only blocks the code execution within the async function. Code Pen


Table of Contents

A promise is an object that represents the completion or failure of an asynchronous task and its resulting value

Syntax: For creating a Promise
let promise = new Promise(function(resolve, reject) {
//Code
});

Promises mainly introduced to avoid multiple callbacks in an asynchronous way. The last story explained the callback function and mentioned the multiple callback code looks very nested leads too hard to understand as well as maintain. Promise helps to overcome the problem. Let see how it works?

The promise object has three states.


Table of Contents

callback function

A function with an argument of another function to be a callback. eg) function(arg1, callback).

Use of callback function

Sometimes your function fully depends upon the data which u received from another function. In such cases, the callback will help the outer function will wait till the callback should complete their actions, and then the outer function will perform the routine or actions.

Simple Callback

In the example below, the method employeeData is collecting data from the callback method of getProfile and this again has a callback of getTechProfile. This means the outer function of employeeData waits for the callback methods has to execute, then the…


In the last story, we discussed choosing the keyword ‘this for ES6& ‘super for ES5to access the parent class methods from the child class. It says, in ES6this’ keyword refers to the parent object, but in ES5 the ‘super’ keyword did.

Let’s see how the value of “this” varying at the functional level.

Case1: Code Pen
A simple JavaScript function that consoles the log of “this” keyword in both ES5 vs ES6. In the example below, thisValueInES5() & thisValueInES6() returns the same global object.

Case 2: Code Pen
A simple JavaScript function placed inside an object that consoles…


Table of Contents

ES6 Standard introduces classes in JavaScript, also this provides great new features which are useful for object-oriented programming.

Basic Syntax of Class

In JavaScript, the class is similar to a function. Like the function keyword, here it will be declared with the class keyword. In ES5, initialize a function using a new keyword but not with ES6 functions, the class can initialize with a new keyword.

Vignesh S

Software Developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store