So, to deal with this issue, we have to develop some kind of centralised logging system to collect these logs from different sources and then it becomes pretty easy to analyse them.

Centralized Log Management is an approach where the logs that are generated from sub-systems within the same environment are collected, parsed and stored in a central repository in an organized fashion thereby reducing the overall management effort to identify an issue. There are various open-source as well as paid tools available in the market to accomplish this. Some of the examples are Splunk, LogRythm, LogPacker, Logstash, Fluentd, etc.

I have already published a blog on how to achieve the said objective using LogStash and it can be read here:

Spring Boot Logs with Elasticsearch, Logstash and Kibana(ELK)

So, let's start with how to achieve the said objective using Fluentd.

LogStash is a part of the popular ELK stack provided by elastic while Fluent is a part of Cloud Native Computing Foundation (CNCF). Both are open-source data processing pipeline that can be used for collecting, parsing, and storing logs from different sources. These logs can either be indexed in Elastic search or can be pushed to storage. There are number of plugins available as well to do things more efficiently.

1. We must have ElasticSearch and Kibana installed on our system and the guide to install these are here:

• Installing Elasticsearch | Elasticsearch Guide [8.10] | Elastic
• Install Kibana | Kibana Guide [8.10] | Elastic

2. We have to install Fluentd in our system and it doesn’t matter which OS is being used as it’s up and running on most of those.

Installation

3. Next, we have to edit the configuration file for Fluentd. There are following mentioned components used to configure Fluentd.

1. source directives determine the input sources.
2. match directives determine the output destinations.
3. filter directives determine the event processing pipelines. (optional)
4. system directives set system wide configuration. (optional)
5. label directives group the output and filter for internal
   routing (optional)
6. @include directives include other files. (optional)

There’s a configuration file named td-agent.conf so we will edit this file to configure Fluentd as per our need. This file can be found inside the /etc/td-agent/ folder.

I used a sample spring boot application to generate logs so the configuration for that would look like below:

After this step, make sure that Kibana and ElasticSearch is running and then restart the td-agent service. After restarting the service, you can check the logs for td-agent inside the file /var/log/td-agent/td-agent.log and would see something like this:

After all these steps, it’s time to open up Kibana dashboard and there you can see the index by the name mentioned in the td-agent config file. After setting up the index in the Kibana then you will start to see your application logs there immediately.

Any kind of source can be used for logs with Fluentd. We just need to make sure to write the format properly as per our logs syntax in the td-agent config file.

That’s all for this tutorial. Next, I’ll write about comparison between Logstash and Fluentd and some more blogs about how to ships logs from inside of Docker containers. So, stay tuned for more resourceful blogs.

Centralize Your Logs using Fluentd, Kibana and ElasticSearch was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

React Select is a flexible and beautiful Select Input control for ReactJS with multiselect, autocomplete, async and creatable support. React Select is funded by Thinkmill and Atlassian. It represents a whole new approach to developing powerful React.js components that just work out of the box while being extremely customizable.

So recently I was using react select in one of my projects but stumbled upon an issue of properly displaying error messages next to the select and the library doesn’t support it yet.

I tried searching for the issue numerous times but no help, after some time when it started to frustrate me I decided to write a wrapper upon it.

Let's have a look at the wrapper —

There are a few things that are important regarding our current use case —

1. Line number 15 errorMsg as props.
2. Line number 34 to 56 which are the CSS property for the error msgs.
3. Line number 30 which is for internationalization from https://react.i18next.com/ I won’t be covering this plugin in this blog, but for the understanding, this is helpful to use internationalization in a react app.
4. Line number 86 to 88 shows the error msg populated by the error message.
5. Line number 59 to 61 places the error class on the label of the select component.
6. This is just a way I tried using the customization while using react select.

There can be many better ways. If you do find them please notify us in the comments. Happy to learn.

React Select 2 custom error messages was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

In this blog, I will explain to you how we can simplify the promises in a very simple way, and also this is very easy to understand and use.

So we already study in the last blog that promise is a big improvement over callbacks but still, promises can be really hard to read and manage especially when we have a long chain of multiple asynchronous events.

Async and Await is a fine syntactic sugar to make out Asynchronous code to execute like a Synchronous code.

Async

Async with a function just indicates that this function always returns a promise so when we use the async keyword then it takes the return value and automatically resolves it as a promise.

Example

Await

Async set up a context to use the await keyword, the main power of the async function is when we bind it with the await keyword to pause the execution of a function until promise resolve and return its result and this keyword only works inside an async function.

This is very useful when we need one value after another, like if the second statement dependent on previous statement value, for example, if we need user id before fetching his information;

Example

Few points to remember before using Async Await

1. await can not be used in regular function and if we use then end up with an error.
2. await will not work in the top-level-code.

Example

But we can wrap it into an anonymous async function.

Example

Asynchronous javascript: Async /Await was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

So today we are going to cover the scenario of recovering access to an AWS instance if the .pem file for the instance is lost. Some of us might have faced this issue, if not all.

Suppose we have an instance whose .pem file is lost, destroyed, etc. We know that if an AWS instance is secured with .pem file then we can’t regenerate this .pem file from the AWS again.

We will be needing a new instance to recover the .pem file for our lost instance. Let’s call this new instance as helper instance and lost instance as recovery instance

Let’s jump to the steps -

1. Every instance has a volume attached to it which has all the user data. So we need to stop the recovery instance. This can be done either from the AWS management console or using AWS SDK through CLI. Make sure you don’t terminate your recovery instance.
2. Once the recovery instance is stopped. We will detach the volume attached to the recovery instance. Once detached, the volume will be available for use.
3. We now need to attach this volume to our helper instance. Since our helper instance already has a root volume (/dev/sda1), our newly attached volume will be secondary (/dev/xvdf1). One thing to keep a note of is our helper instance should be in the same availability zone of the lost instance, else the volume of the lost instance will not be able to attach to the helper instance.
4. Mount the new attached volume on the helper instance. We can do it by running this command.
   mount /dev/xvdf1 /mount
   This will mount our volume to /mount folder.
5. Now we need to copy the authorized_keys from our helper instance .ssh folder to the mounted .ssh folder. This will allow the .pem file of the helper instance to log in to the recovery instance.
   cp ~/.ssh/authorized_keys /mount/home/ubuntu/.ssh/
6. Unmount the attached volume from the helper instance.
   umount /mount
7. Detach the volume from the helper instance and reattach it to the recovery instance. Make sure you mount the volume at /dev/sda1 as the recovery instance does not have any root volume attached to it yet. So this instance has to be mounted at /dev/sda1.

8. Use the pem file of helper instance to log in to the recovery instance.

9. Stop and terminate the helper instance.

This will let you rest the log in access to the recovery instance.

Recovering access to AWS instance if the .pem file is lost was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

This is the second part of Asynchronous Javascript in which we will learn about the promise.

In the previous blog, I will explain to you how challenging it is to manage the order of asynchronous callbacks, and it can lead to callback hell which makes our code hard to read and it is not a good practice to write code. To resolve this problem javascript promise introduced which helps us to organize these callbacks in a much easier way.

What is Promise?

Javascript promise is an object which represents a successful completion or failure of an asynchronous operation. The promise allows us to write asynchronous code in a more synchronous fashion.

Example: if we use the promise to make an Http call to a web server, then we will create a promise object which represents the data that will be returned by the webserver in the future.

The main advantage of using promise in javascript is better code readability, better handling of the asynchronous operation, and better error handling.

Promise States :

Pending: Promise is in the initial state, neither fulfilled nor rejected.

Fulfilled: Operation successfully completed.

Rejected: Operation failed.

A pending promise will be either fulfilled or rejected if it fulfilled successfully then return data but if rejected then return the reason which is an error.

Create and Consumer Promise:

A promise constructor is used to create a new Promise object which takes a one callback function as an argument and callback function. There are two parameters in the callback function, resolve and reject.

Promises can be consumed by registering functions using .then and .catch methods.

1. Then(): When a promise is either resolved or rejected, then() is invoked. It takes two-parameter. If the promise is resolved, the first function is executed and a result is received. If the promise is rejected, the second function is executed and an error is displayed on the screen.

2.catch(): Whenever there is an error or the promise gets rejected during execution time, catch() is invoked.

Promise.All()

Promise.All() is also a promise, takes an array of promises as an input, and gets resolve when all the promises resolved or any one of the promises gets rejected.

Example: If you have 5 promises and you need to know when all the promises get resolved or if you want to perform some operation after all the promises resolved and until then you have to wait.

Asynchronous Javascript: Promise was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

Arrow Functions

Arrow functions provides us a way to write functions in JavaScript in a concise and compact way. Arrow functions — also called “fat arrow” functions, from CoffeeScript (a transcompiled language) — are a more concise syntax for writing function expressions. They utilize a new token, =>, that looks like a fat arrow.

Iterators

In JavaScript an iterator is an object which defines a sequence and potentially a return value upon its termination. Specifically, an iterator is any object which implements the Iterator protocol by having a next() method that returns an object with two properties: value and done. We can get the values from a collection by calling next() repeatedly and get to know that it’s the end of the collection when we get true in done property.

for of

JavaScript has always had a for in construct that we could use for loop through over an array. for in works by enumerating the properties of an object. It means for in iterate over an array because it works with the available indexes inside an array. Sometimes we just want to iterate over values and not to worry about keys or indexes. It’s where for of comes very handy to accomplish the said task.

Generator Function

A Generator Function is a function which generates an Iterator. A Generator Function doesn’t require lots of code but it does require a new keyword which is called yield keyword and a special function syntax. Generator functions are written using the function* syntax. When called, generator functions do not initially execute their code. Instead, they return a special type of iterator, called a Generator. When a value is consumed by calling the generator’s next method, the Generator function executes until it encounters the yield keyword. The function can be called as many times as desired, and returns a new Generator each time. Each Generator may only be iterated once.

Well, it marks the end of this post in the ES6 blog series.

You can find the previous posts here:

1. ES6 Fundamentals: Introduction
2. ES6 Fundamentals: Variables and Parameters
3. ES6 Fundamentals: Classes

ES6 Fundamentals: Functional Programming was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

Javascript is a single-thread programming language which means that it is not good with multi-tasking. It executes code line by line and if a function depends on the result of another function then it has to wait until other function returns the result. In this era when our computer has multiple cores, it is not a good practice to wait until some other task finish.

Handling Asynchronous operation in javascript is a very important task in javascript because every application is performing some kind of asynchronous operation and for this javascript provide different ways of handling asynchronous operation.

Callbacks

The callback is the oldest and simplest way to handle Asynchronous operation in javascript and a callback function is a function that is passed as a parameter to another function and that will execute later.

It is not necessary that a callback is always Asynchronous, it can be Synchronous too.

Example: setTimeout() function in javascript, it takes two parameters, first is a callback function and another one is the time duration, callback function, in this case, will be executed after the given time duration and until than normal flow of execution of code continue and there will be no code blocking occur.

In this example, you must be surprised by the output of the code, the reason for this output is that javascript didn’t execute the code in the order we wanted. Javascript didn’t wait for 5 seconds to execute the setTimeout() function. The reason for this behavior of javascript is that we cant call function one after another and expect that they execute in a synchronous manner. Callbacks are useful when we want to execute code after some other code execution complete.

Create a Callback

I created a fetchUser function to simulate a fetching username from the server. This function takes two arguments username and callback function and callback function defines inside setTimeout function In which we passing username as a parameter and after that, we call fetchUser function and pass the userName Parameter and invoke callback function in which we are printing username.

Callback Hell

In the above code snippet after fetching user if you want to fetch user address, then user contact, etc. For this, we have to invoke fetchAddress inside fetchUser, then for contact, we have to invoke fetchContact inside fetchAddress. This is called callback hell when we stack methods on each other and it is hard to read and not a good practice to write code.

In the next blog, I will explain to you how to handle callback hell in javascript.

Asynchronous Javascript: Callbacks was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

Continuing from my last story where we migrated the messages stored in the properties file to the database, let’s put them to use now.

In this story, we will set up a Message Source that will pick all the i18n messages from the database.

Often we keep our i18n messages in a properties file and use the messages from there. But, what if the user wants the control to make changes to the content at runtime, we cannot ask the user to change the properties file manually. In these scenario usually database comes to our help where we can open up a rest API to update the message content.

Locale Resolver

Let’s walk through the locale resolver first before diving into the message source. LocaleResolver is required to correctly decide which local is currently used in the application. LocaleResolver interface allows for implementations based on a request, session, cookies, etc. The default implementation in spring-boot is AcceptHeaderLocaleResolver. The locale should be passed in the header called “Accept-Language”. We will stick to the default LocalResolver in our sample code. Please read LocaleResolver for more details.

Message Source

MessageSource interface is used for resolving messages, with support for the parameterization and internationalization of the messages. Spring contains two built-in MessageSource implementations: ResourceBundleMessageSource and ReloadableResourceBundleMessageSource. The latter is able to reload message definitions without restarting the Virtual Machine.

More on message source here.

Basically every Spring application needs a message source that is responsible for resolving messages based on some parameters. This can be achieved by getMessage() method of the MessageSource which has three variants that can be consulted on the official spring documentation here.

We need to set up our message source and the strategy to resolve the messages from the database. We do so by declaring a bean named ‘messageSource’. The name is specific to the Spring ecosystem and should be used as it is, however, the implementations can differ obviously.

Our DatabaseAwareMessageSource is marked with @Component(“messageSource”) which marks the class as a spring component bean named ‘messageSource’. Remember to stick to the name :P

Our message source class implements AbstractMessageSource which provides us with a method resolveCode(String messageKey, Locale locale) that needs to be overridden. Our main logic to retrieve the messages based on locales from the database will be implemented here. This method returns a MessageFormat.

Here I am getting the current tenant in the current request with the help of a utility class TenantContext which obviously am not going to cover here :P

MessageRepository helps us to find the message content by the message key and locale passed along with the tenantId we fetched above.

Next, we create and return an instance of MessageFormat which takes in the content based on the message key and the locale.

That is all for messageSource configuration.

Next, let's use this message source. The usage of getting the messages from messageSource is the same.

Let's say we have a message in the database with the above key and value. This message accepts an argument and is replaced by {0} as the first argument, which is resolved by using getMessage() from the messageSource bean. The database record looks like this in our database.

Usage —

throw new UserNotFoundException(messageSource.getMessage("not.found.admin", new String[]{adminCO.getUniqueId()}, Locale.getDefault()))

results in throwing an exception with the message that is provided from the database. The getMessage() method takes the message key as the first argument, an array of string objects that will be resolved as placeholders in the message content, and a locale. The placeholder arguments can be accessed based on the index, meaning {0} will be replaced by the element at the 0th index, and {2} will be replaced by the element at 2nd index of the array.

Database aware i18n messages — SpringBoot was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

Actually, the concept of Classes is familiar to many programmers from many programming languages like Java, C++ and C# etc and the goal in the JavaScript is the same.

The class keyword creates a class definition and a class definition is a blueprint we can use for creating objects. Creating an object from a class is called instantiating an object form a class.

Well behind the scene, an ES6 class definition is creating a constructor function and manipulating a prototype object. That’s something, we have been doing with JavaScript for years.

This constructor function and prototype setup works but the syntax is hideous because the doesn’t reflect what we want to do in a straightforward manner.

Well, this is where the class keyword in ES6 steps in and you can see the exact same code using the class keyword below:

Defining a Class

JavaScript classes, introduced in ECMAScript 2015, are primarily syntactical sugar over JavaScript’s existing prototype-based inheritance. The class syntax does not introduce a new object-oriented inheritance model to JavaScript.

Classes are in fact “special functions”, and just as you can define function expressions and function declarations. The class syntax has two components: class expressions and class declarations.

Constructor

Managing state consistently usually requires some initialization logic for an object. We can implement this logic by proving a constructor. Just like the other member of a class, it’s a function that automatically invoked when you execute new keyword with a class name.

Getters and Setters

Once we have some data inside an object, we might want to protect that data. It’s called Encapsulation with getters and setters. Getters and Setters are created using the get and set keywords. They effectively bind a property of an object to a function. So, using getters and setters, we will be writing and reading data using these functions not directly.

Inheritance

Inheritance is one of the three pillars of Object-Oriented Programming i.e. Polymorphism, Encapsulation and Inheritance. ES6 gives us an easy syntax to specify Inheritance relationship. Inheritance is a way of saying that a class inherits from another class, and due to Inheritance that class will have all of the methods and state defined by the other class. Inheritance is achieved in ES6 by extends keyword.

super

There are times when we want to use Inheritance in a certain way where we will want to interact with our super class on a specific way. Infact there may come scenarios where we must want to interact with our super class and in those scenarios, super keyword comes very handy.

Well, it marks the end of this post in the ES6 blog series.

You can find the previous posts here:

1. ES6 Fundamentals: Introduction
2. ES6 Fundamentals: Variables and Parameters

ES6 Fundamentals: Classes was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.

Some time back I was working on a use case to get the localized messages from the database instead of message.properties. Since the application was a multi-tenant application we needed to provide the message customization feature to our users as well.

Sounds good? But the main issue was where to store the default messages. As it would have been hectic to every time create the entries in the database for every tenant. The problem became more hectic when we started developing the application. So to overcome this problem we used the properties file to contain default messages for each category like validations, API responses, etc.

This properties file then will be loaded at the booting up of the application and will create the messages with their keys into the databases. I will cover internationalized messages from the database in a separate story.

So let’s start with a basic example of how to get this done.

So here’s our properties file that had the validation messages.

So these messages were the default messages that will be created for every tenant in the database. Next, we create a database schema to hold these records in the database. We are using MongoDB for the database.

Here locale will store the language code, the key will store the message key from the properties file, the content will store the message content from the properties file. tenantId stores the unique key of the tenant for which the message record is created. For simplification, I have categorized the message types to be of types of VALIDATION, API, etc stored in messageType.

@UniqueMessageKey(message = “validation.message.key.exists”) is a custom validator to check that duplicate message keys don’t get created for every tenant. You can read more about Custom Validators in my previous blog here.

Now we will need a service class that processes our properties file and stores them in the database.

Our validation service class implements the InitializingBean which will call afterPropertiesSet() overridden method after the initialization. The properties field is a hashmap which will store the key values from the properties file and will be used for other processing. MessageRepository is our repository class for the Message model.

Next, we load the validation.properties as a classpath resource in the afterPropertiesSet() method. We will use to load our resource as properties instance.
PropertiesLoaderUtils.loadProperties() is a convenient method that loads a resource for programmatically accessing the content as key-value. We iterate on this properties instance and store the key-value based message in our defined properties map.

Now we create a method in this service class that will be used to create the database records of these messages for all tenants.

In this createValidationMessagesForAllTenants() method, we iterate over the properties map and create database records for the messages per tenants. For the sake of simplicity, we are using default locale in this example.

Looks good so far. But what if we have to add/modify a new property? Do we have to create a new record every time? Let's add one more method which will update the records in the database.

This updateValidationMessagesForAllTenants() will check if a record exists by the message key, if not then this will create the new message record for the tenants.

Now you must be wondering that we have created these two methods but we aren’t using these methods anywhere. So let’s create a service that will be bootstrapping these messages on application startup and updating the records if changed.

Our MessageBootstrap.java is a service class that contains a method createData() that can be called in your application-level bootstrap which caters to the application level bootstrapping of data. We have a boolean flag isUpdatingMessagesAllowed that can be turned on or off to allow updating of messages. This can be achieved in various ways but for simplicity, I have taken it in the method itself.

In our next story, we will see how to configure and use these database aware localized messages in our application.

Reading message.properties file programmatically. was originally published in TechCret Software on Medium, where people are continuing the conversation by highlighting and responding to this story.