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.
Ionic 4 | Create Simple Login and Prevent Page Access using Angular Guards
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
Ionic 4 | Show Native like Toast Messages in Ionic Application in 2 Steps Without Any Plugin
In this post, we will discuss How to Add Ionic 4 Toast Component in Application in few easy steps. Ionic toasts are available with many options and event handlers which can be used without any plugin.
Toasts are basically messages which are used to show some sort of information to users like success or error messages. These are similar to Native toasts shown in Android or IOS applications.
Ionic 4 | Latest Angular Routing in Ionic 4 Application
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
Ionic 4 | Turn on Device GPS in Ionic 4 Application Without Leaving App using Ionic Native Plugin
In Ionic Application which is using Geolocation get device location coordinates like latitude and longitude may need more accuracy. Device Geolocation service can location coordinates using the network, WiFi Bluetooth but for more accurate location device GPS option must be turned on, which can provide Location accuracy up to 10m which proves quite good for real-time and delivery applications.
In this post, we will discuss How to Turn on Device GPS option from Ionic 4 Application itself, so that user does not need to leave application. We will use Cordova and Ionic Native plugin, which will prompt the user to turn on GPS.
Ionic 4 | Adding Google Analytics in Ionic 4 Application using Cordova and Ionic Native Plugin
Google Analytic is very popular among Web applications to track various parameters like traffic analysis based on demography, event activity, content-based analysis etc. We have already discussed How to integrate Google Analytics in Ionic 3 application. Google Analytic provides use dashboards to view real-time traffic on Web Applications.
In this post, we will discuss on How we can integrate Google Analytics in Hybrid applications based on Ionic’s latest version 4. As hybrid application based on web view so it is very easy to integrate with a few steps.
How to Pre / Post Load Assets like Images, CSS, JS files using Preload JS liberary
In this post, we will discuss How to load assets like images, CSS files, js files and another type of files in lazy load manner using Preload JS library. Using Preload we can check how much data is loaded and also check progress in percentage.
Preload Js can be used in a number of scenarios like if we have a number of heavy images then we can show a loader when images are loading in the background, then after the all images are loaded we can show success message or hide loader.
Continue reading How to Pre / Post Load Assets like Images, CSS, JS files using Preload JS liberary
Angular 7/6 | Adding Owl Carousel 2 Image and Content Slider in Angular Application with Custom Navigation in 3 Steps
Angular 7/6 | CRUD Operations using Firebase and Firestore Database in Angular Application Tutorial
In this post, we will implement the Firebase database in Angular 7 project. Firebase provides a cloud-based service Firestore, it is a NoSQL database which is very fast and easy to create and maintain.
In our example app, we will have Database CRUD operations which are commonly known as Create, Delete, Update and Delete. These are the basic database operation which is used in most of the real world application. To keep out app simple to understand we will not have routing.
Ionic React | Introduction to Latest React beta version of Ionic 4
The ionic team launched Web Component-based Ionic’s latest version 4 to make it more compatible with major frameworks other then Angular. With the rising trend in other JS libraries like React and Vue Ionic team is constantly working to provide the Ionic platform an option for React developers.
Continue reading Ionic React | Introduction to Latest React beta version of Ionic 4