Skip to main content

Angular 7 – Virtual Scrolling and Drag and Drop features

Angular 7 is out!! Angular Material received a big update in this year and the two new features of Angular CDK, Virtual Scrolling and Drag and Drop support are now available with Angular 7. Virtual Scrolling loads and unloads elements from the DOM based on the visible parts of a list, where Drag and Drop feature supports dragging, dropping and rearranging elements. In this post, we will look at Virtual Scrolling and Drag and Drop features in action with Angular 7. Read More

How to create an Angular 7 app with Visual Studio 2017

Last week, I posted a guide on upgrading Angular 6 app to Angular 7. But, what if you wish to create Angular 7 app from scratch with VS 2017? At the time of writing this post, default ASP.NET Core SPA templates allow you to create Angular 5/6 based app with Visual Studio without installing any third-party extensions or templates. This post talks about how to create an Angular 7 App with Visual Studio 2017. Read More

Upgrade Angular 6 app to Angular 7 with Visual Studio 2017

Angular 7 is out!! It’s another major release spanning the entire platform, including the core framework, Angular Material, and the CLI with synchronized major versions. Earlier I posted about creating an Angular 6 app with Visual Studio 2017 using ASP.NET Core 2.1 SPA templates. Now, it’s time to upgrade the same angular app to the latest version which is Angular 7. This post talks about how to upgrade Angular 6 app to Angular 7 with Visual Studio 2017 and we’ll also see an example of Angular 7 Drag and Drop Feature. Read More

How to lazy load images in Angular 6

Lazy loading is a technique to load the content only when the user asks for it. Therefore, the initial loading of the webpage is much faster as the complete page is not loaded. In case of lots of images on the webpage, it is always recommended to use lazy loading for the images. As an example, while showing a photo gallery, there is no point loading all the images in one go as the user may leave after only viewing the first few images and this would result in slower loading and waste of bandwidth. In such scenarios, lazy loading is an ideal choice. This post talks about how to lazy load images in Angular 6.
Read More

Angular Console – An UI for Angular CLI

When Angular CLI was released, it instantly got the attention, and many developers started using it as it took away all the pain to create Angular based applications. Angular CLI performs every activity required for an angular application starting from creating to deploying the app. You don’t have to spend time for webpack configurations, making tests run, fixing source maps as the CLI takes care. But, one will have to remember all the CLI commands to use it efficiently. To address this, a new tool is available called “Angular Console”. It’s a visual representation of angular CLI. In this post, we’ll see how to get started with Angular Console and create an angular application using the same.
Read More