Learn When Functions Cause Problems and How to Solve it Using Pipes in Angular.

In the previous article, we have seen the performance problem in Angular using the ngFor and how to solve it using the trackBy function. In this tutorial, we are going to see another performance problem with Angular using the functions. This is a very simple problem. But many of us have not noticed this. I have not found this problem when I was a beginner in Angular.

When will a function cause a performance problem?

We always create functions to ease our work. Functions alone do not create performance problems in Angular. But if we use the functions in the HTML section, then sometimes it will cause a…

How to create Components, Routes, and send/receive data via those Routes in Angular

In this tutorial, we are going to see how to pass data from one component to another component in an Angular application. Before Angular, Server only will handle the data sending and data capturing activity. But in Angular, the data sending and data capturing activity is done by Angular only. We can send data to another page/component using many ways. Few options are listed below.

  1. URL Parameter
  2. Query Parameter
  3. Extras State

This tutorial focuses on the routing parameters. Let’s see them one by one.

URL Parameter

The URL parameters are mostly used for SEO purposes. Just look at the sample URL.


Validation performs a very important role in application development. Validation helps the user to access/use the application in a better way. Most of the UI frameworks offer built-in validation. We can use some third party plugins for validation also.

Say, for example, if a user wants to verify his/her mobile number using OTP, then he/she must enter a mobile number in the given input field. Sometimes the user may enter more than ten(10) digits( Indian mobile numbers are ten(10) digit length). After entering the wrong mobile number(more digits), the user expects OTP. However, the SMS server will tell us the…

When we develop a simple application or complex enterprise application using any technology, The end-user always needs the report data in an Excel file. Why because most people rely on excel file. I worked with various Angular Enterprise applications. In all applications, the customer asked us to give a downloadable excel file using various filters.

In this tutorial, you will learn, how to download an excel file using Angular. I am going to show a demo of excel file download using ExcelJS and File Saver plugin. If you are an Angular developer and looking for export data to excel, then…

What is the problem with Angular Components?

The components act as a page in the Angular applications. Generally, What we do while creating Angular applications?. We will create many components based on the project requirements. Say, for example, if you are creating an Angular application and it requires ten pages(10 pages only). Then we will create ten components and deploy the application to the Cloud server. Assume the whole dist folder size is around 2–3 MB. When you load the particular application, the browser will load all the ten components in a first request. The loaded components will be cached in the browser memory. And it serves…

The hot tool in the DevOps field.

Install Jenkins

In this tutorial, we are going to see, how to install Jenkins on Ubuntu 18. Jenkins is a very popular tool in the software industry. Jenkins is a leading open source automation server, which provides hundreds of plugins to support building, deploying, and automating any project.

Jenkins is available for various Linus operating systems.

  1. Debian/Ubuntu
  2. Fedora
  3. Red Hat / CentOS


  1. Minimum hardware requirements => 256 MB of RAM and 1 GB of drive space.
  2. Recommended hardware configuration => 4 GB+ of RAM and 50 GB+ of drive space
  3. Java

1.Install Java

Jenkins requires Java. If you don’t have it on your machine…

Listing very common mistakes of beginners in their first project and how to avoid them

Photo by Nandhu Kumar on Unsplash

I am sharing my personnel experience where the beginner programmer will do the mistake. It may be their first project in application development or any other software development. Doing mistakes is very common. Even experienced people will do the mistakes. We will learn only from our mistakes. Here I am sharing the 7 common mistakes every beginner programmer will do in their project.

1. Wrong Copy Paste:

This is a very common problem among beginner developers. If we are not able to solve the problem, what we do?. We always google to find the solution. Of course, Google will give a better link for…

Learn how to use the AuthGuard to protect routes in Angular


In this tutorial, we are going to see, how to protect the pages/routes from unauthorised access using Angular. We can easily create a component and we can create a route for the component. By default, all the routes in Angular are accessible by anyone. But when we develop an application such as ERP, CRM, etc., those applications must be accessed only by the authorized people.

Before using Angular, the HTML code is mixed with the server-side code. So we previously had a session concept to restrict the users from accessing the page. Once the user logged in, the session is…

Learn how to show the progress bar when uploading files using Angular

In this tutorial, we are going to see, how to show the progress percentage while uploading an image/file to the server using Angular. I have already written a tutorial regarding how to upload an image/file using Angular and PHP. I am going to use the same code in the previous article with little modification to show the progress percentage. So please read the previous article if you don’t have an idea about file upload in Angular.

To upload files we will use the HttpClient class in Angular. We already used the post() method from the HttpClient to upload the files…


Setup and Install Android Studio on macOS. Learn Android Project Structure.

Android Studio Installation

In this tutorial, we are going to see, how to install the Android Studio on macOS and how to create a new project using the Android Studio. I am planning to write series of tutorials on Android Application development using Kotlin. So this is my first tutorial on Android application development.

Android is the most used Mobile Operating System in the world. Leading mobile manufacturing companies using the Android OS only. We have millions of applications in the Google Play Store. Learning Android application development will help you to create your Android application easily. Most people preferring the mobile application…


Deep&Machine Learning, Ionic, Full Stack Developer. https://ampersandacademy.com/tutorials/ https://github.com/bharathirajatut

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