In this article, we will discuss the implementation of JSON Web Token Authentication in Angular 8 application by using
This post is compatible with Angular v6+ and RxJS v6+
What is JWT?
JWT or JSON Web Token is an encrypted string which contains information related to the logged in user and secret key, this token is generated at server end after a user is authentication. This JWT is used for further communication between clients and servers.
After getting JWT from the server, every HTTP call to RESTful APIs must have an Authorization header set with JWT, which is encoded at the server end for authenticating the source. After successful validation data is transferred. Continue reading Angular 8 | JSON Web Token Authentication Tutorial with Login/ Dashboard and Guards using angular2-jwt
In this tutorial, we will learn how to quickly integrate HttpClient service in Angular 8 application to consume RESTful API JSON data from the server.
HttpClient enables the communication between client and server through many available methods like get(), post(), put(), delete() etc. We will also add Error handling techniques using RxJS operators at one place in our service.
For demonstrating real-world scenarios, here we will create a Student management application with the following operations:
- Create a new Student record using the post() method.
- List/Get Students data to show in a table using get() method.
- Update any Student data by clicking on Edit put() method.
- Delete any Student by clicking Delete on table row using delete() method.
Continue reading Angular 7/8 | HttpClient Service Tutorial to Consume RESTfull API from Server
In our previous tutorial, we discussed how to implement a very basic Routing Module in an Angular 8 application. Here we will go a step further to discuss some more concepts related to Routing in Angular 8 application.
What we are going to create?
Create an Angular 8 application which will have Nested Routing up to three levels. Each level of components has its own Router Module. We will also discuss How to use lazy loading concept in Angular 8 Routing to load components on run time when they are called.
Continue reading Angular 8 | Nested Routing with Multiple RouterOutlet using loadChildren having own Router Modules Example Application
Angular routing plays an important role in a real-world application which is responsible for loading different components which may have sensitive data as well. Angular provides a full proof mechanism to develop an application which can add a protecting shield for accessing components.
Continue reading Angular 7/6 | Use Auth Guards CanActivate and Resolve in Angular Routing Quick Example
Ionic 4 is using Angular Routing, so it becomes very easy to add authentication in an Ionic application using Auth Guards.
In this post, we will create a simple login application to quickly demonstrate how we can implement Angular Guards in Ionic 4 to prevent access to pages if the user is not logged in. This is very common and required by most of the real world application where we don’t want some pages to be accessed without proper authentication.
Continue reading Ionic 4 | Create Simple Login and Prevent Page Access using Angular Guards
After the release of Ionic’s stable version 4, the major change which is introduced besides web components is related to Routing. The latest version of Ionic now supports Angular Routing.
In the earlier version on Ionic, there was the concept of push and pop, where pages were pushed in a stack of pages having viewable page object on top. So if we want to go to some page we simply go to that pushed page index or push a new one.
Continue reading Ionic 4 | Latest Angular Routing in Ionic 4 Application