When it comes to style components in react applications we have a variety of options in our hand. Here, I am going to discuss the three most popular styling options that you can use inside your projects.

Inline Styles

This is the most basic way of styling components and typically you work with styling this way when getting started with react. In inline styling, the style object will be passed as a style prop object directly into the JSX element and this has key-value pairs of CSS rules and values that are assigned to those CSS rules. Also, when we writing CSS…

Basically, Express js is the framework that ruled it as a backend framework a few years back. Also, Koa js is a modern and minimalistic Node.js framework which is created by the creators of Express js. Koa is a bit modern since it uses ES6 syntax and all. If you know Express js you will see that syntax is very similar when comparing with koa and you will pick it up very quickly. Here, we are going to discuss installing koa and creating a server that listens to a certain port.

What is Koa?

A New server-side framework for node.js from the creators…

In JavaScript, var, let, and const are three ways of creating variables. Here, we will talk about the scope and difference between these three ways.

Bit of history on variable declaration

At the beginning of JavaScript, there was one way to declare a variable and, that is using the var keyword. Then let and const are introduced in ES6 but couldn't use it right away. Now, all the major browsers compatible with the let and const syntax, and most of the developers use let and const nowadays.


Variables declared using var keyword scoped to the current execution context. This means If they are inside a function…

Node.js is an open-source environment to run JavaScript outside the browser which is built on Chrome’s V8 JavaScript engine by Ryan Dahl. Also, Deno is another JavaScript runtime environment developed by the same person (But we are not going to talk about that here). Node.js is used to build highly scalable server-side applications with asynchronous I/O features. Here we are going to discuss built-in modules in Node.js and their uses.

What are Node.js modules?

We can refer to modules as small encapsulated units which can be reused and shared with anyone. Easier to maintain and debug because they are separated pieces of code from…

JavaScript is a single-threaded programming language which means the JavaScript engine can execute one statement at a time, line by line. Also, known as synchronous code. Here, I will discuss How the use of Synchronous, Asynchronous JavaScript changed from time to time and Asynchronous code uses using Callbacks, Promises, and Async/Await.

What is Synchronous JavaScript?

JavaScript by nature is a Synchronous programming language due to being single-threaded as mentioned above. which means JavaScript executes one statement at a time from top to bottom order. However, this behavior is not ideal for some times such as requesting data from API or Database. because this process…

Generally, in CSS we write a lot of redundant code in some situations. And to get around that we have to create helper classes and adding those classes to elements. To reduce effort, this is where CSS with superpowers comes in. SCSS, means Sassy CSS which known as SASS before which means Syntactically Awesome Style Sheets. SCSS is the most newer syntax and SASS is the older syntax. These are CSS preprocessors that allow us to write CSS rules more efficiently and more organized code using nesting, mixins, variables, and more. Then these rules will be compiled to CSS which…

In simple terms, Git is like a history book of your code and is used for tracking changes of the code from start to finish. Here, I will discuss the basics of git and a bit of GitHub along with examples.

What are Git and Github?

First, We have to know Git and Github are not referring to the same thing. Git is the most popular version controlling system in the world. The version controlling system records the changes that we do to our code throughout the development process in the kind of database called a repository. Using the repository we can find out who…

Basically, Array is a data structure that is used to store a collection of elements and an index is used to uniquely identifies an element. Arrays in JavaScript are created by using the Array class of a window object. Also, the length of an array or element type is not fixed in JavaScript. Here, I will discuss some of the methods that we can use in arrays.

Creating an array

In JavaScript, one array can hold up different types of elements. Using the array literal is the easiest way to create an array.

Generally, this keyword in JavaScript is confusing in some situations comparing to other programming languages like Java. Here, I will discuss some usages of this keyword and how it behaves in certain situations.

“this” keyword

Basically, this keyword in JavaScript is referring to the object that is executing the current function, also the parent object in some cases.

Behavior inside global scope

First, we are going to consider the behavior of “this” in the global scope. In the global scope, this keyword is referring to the window object itself. The window object represents the document page that is currently opened in the browser window.

Thushara Thiwanka

Software Engineering Undergraduate

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