In this article, we’ll discuss about a simple use case of ngx-bootstrap modals in Angular application, in which there will be an angular component named modal-comp, where all the codes for ngx-bootstrap modal will be present. And it will be called by clicking a button in the app component.

Our target is to create an application which looks like the following.

Initial Setup

First of all, we’ll open the terminal and initialize our angular application with the following command — ng new exercise1. This will create a folder with the name exercise1. …

In Angular, an observable is an object that is imported from a package called rxjs.

To define an observable in simple words, we can say that an observable is the source from which data is emitted. Also, there is an observer which observes for any data packet emitted by the observable. Between observable and observer, there is a stream in which multiple events are emitted by the observable.

An observable can emit data packets on various cases. Some of them are listed below:

• A developer has programmatically configured the observable to emit data.
• In Angular HTTP, the observable is linked…

According to the official documentation of Angular, components are the most basic UI building block of an Angular app. An Angular app contains a tree of Angular components. These components helps us to understand and organize the UI codes, easily.

In this article, we’ll see how to make these components interact with each other. More precisely, we’ll learn various use cases of passing data between components.

Initial Setup

First of all, we’ll open the terminal and initialize our angular application with the following command — ng new exercise. This will create a folder with the name exercise. …

In this article, we’ll discuss about creating a simple visitor’s register application using TypeScript, in which we’ll be able to make a list of people checking in and out of the premises.

The final look of this exercise is given below:

Initial setup

To use TypeScript, we have to install the TypeScript package using NPM. For that we will run the following command in the terminal.

npm install -g typescript

We are installing the package globally into our system.

After that we’ll create a directory with the name practice, where we’ll write codes for learning TypeScript.

In the project directory, we’ll…

According to https://www.typescriptlang.org/,TypeScript is an open-source language which builds on JavaScript, one of the world’s most used tools, by adding static type definitions.

Browsers, by default, do not understand TypeScript. After writing TypeScript code, we have to compile it into JavaScript in order for browsers to understand it.

TypeScript allows us to use types. If we declare a variable in TypeScript to be of certain type (say number), then we can’t change that number type later on to string, boolean etc. It makes our error checking process and debugging of our code a bit easier. …

In this article, we’ll develop a simple note-taking application using HTML, Bootstrap, and Vanilla JavaScript, in which we can add, delete and search for our notes. The notes will be stored in the local storage of the web browser and they will not be deleted even if the browser is closed. The application will also prevent HTML and script injections via the input field.

After completing this exercise, our application will work as follows —

Now, let’s dive into this exercise.

First of all, we’ll create a project directory with two files — index.html and script.js.

The index.html file…

JavaScript is a single-threaded language. That means, only one line of code can be executed at a time and all the codes are executed one after the other.

But there are certain situations in which a line of code needs to fetch data from the database or any other APIs, which takes time. In these situations, the execution of subsequent line of codes will get blocked. They will only be executed after fetching the data. And this is not a good experience. So, to counter this situation, we have asynchronous codes in JavaScript. Asynchronous codes do not block the subsequent…

In this article, we’ll develop a React application which will fetch data (page by page) from the following API — https://jsonplaceholder.typicode.com/photos and will display them on the browser in the form of a table. When the application is opened in the browser, it will display the contents of the first page and upon scrolling, the application will load and display the subsequent pages as well. The final look of the application is shown below —

Initial setup

First of all, we have make sure that Node.js is installed in our system. If so, we’ll create a directory with name React_Projects and…