Angular Http Caching using Interceptor and Refresh

This article is written assuming you have a fair understanding of how an Angular Interceptor works and what they do. Caching an Http request for GET calls is highly important as it will avoid making an API service calls unnecessarily. An Interceptor can be used to delegate caching without disturbing your existing Http calls....

Angular Typeahead using switchMap – a use case

There are plenty of options available in Angular world to implement TypeAhead feature for your project, such as; Angular Material Autocomplete (https://material.angular.io/components/autocomplete/examples) NG Bootstrap Typeahead (https://ng-bootstrap.github.io/#/components/typeahead/examples) Prime-Ng (https://www.primefaces.org/primeng/#/autocomplete) Although, there is no need to reinvent the wheel here, still a simple analysis on how a type ahead works in the above libraries will help...

forkJoin vs combineLatest

Learning RxJS is quite challenging and it is undoubtedly the great tool for front-end developers. We cannot grasp entire RxJS operators in one go, but we may encounter some operators for our use cases. One such operators are forkJoin and combineLatest. forkJoin is a special operator from RxJx that let’s you combine / accept...

Minify / Uglify / remove comments your final Angular build

Removing unwanted code and minifying your application is a crucial step before pushing to production. To fix this, just open up angular.json config file in your editor and navigate to  “Projects” > “Name Of Your Angular App” > “architect” > “configurations” > “production” By setting the “optimization” to true, “vendorChunk” to true and “aot”...

Adding bootstrap 4 to an ionic 4 project

What ever the framework may be, it is often handy to have bootstrap in your favorite application. With it’s plethora of styling definitions, bootstrap indeed is favorite for all web developers, let’s get started. Firstly, install bootstrap in your project by following command. npm install bootstrap   Open angular.json that is in your root...

Angular Material Getting Started

In this tutorial we gonna look at; How to setup Angular Material, include a default theme and build a simple application with sidebar navigation. So basically build a toolbar, and few input elements like input text, checkbox’s, etc So, let’s get started. So first thing first, check if you got angular CLI installed in your PC....

Angular 6 – Routing and Navigation (with Child Routes & Route Auth Guards)

Learn to code routing and navigation in angular 6, which covers pretty much everything about routes, child routes and route auth guard. Source Code: https://github.com/codewithsrini/Angular-6-Routing-and-Navigation-with-Real-World-Sample Time Stamp: 1:26 – Importing Router Modules (for Routing and Navigation) 2:02 – RouterModule.forRoot() 2:54 – Creating a Project Management Application 3:28 – Creating Components and Modules 4:44 –...