Compodoc – Documentation tool for angular application

Hi,

In this post thought to share one of the tools which I use always for keeping my angular app document ready as well. You must have worked with other frameworks where in it can read your API comments and generate proper documentation out of the box. In case of angular, this feature comes live with the help of https://github.com/compodoc/compodoc. This is open source project with really cool themes to suit your need. Either you can install this tool globally and use the same in the project or you can have the same locally installed.

Continue reading “Compodoc – Documentation tool for angular application” »

246 total views, 4 views today

HTTP Client usage in Angular

In this section, thought to talk about HTTP-Client usage in angular and how its different from existing HTTP Module. It has RxJS Observable-based API. It means that the multiple calls to the HTTP module will return an observable, which we need to subscribe.

Salient Features:-

  • If we don’t subscribe to these observables, it won’t work.
  • If we subscribe multiple times to these observables, multiple HTTP requests will be triggered.
  • If HTTP request is successful, it will emit only one value and then complete
  • If HTTP request fails, then these observables will emit an error.

Continue reading “HTTP Client usage in Angular” »

375 total views, 3 views today

Running Multiple Angular SPA using NRWL

Hi Friends,

In this section, we will talk about handling multi-spa scenario with one of the libraries provided by NRWL team. An Nx workspace is pretty much same as angular cli. Main advantage of this, it supports multiple angular application in a single repo. The @nrwl/schematics scope package comes with a binary for running the schematics for generating new workspace. We can start with installing npm i -g @nrwl/schematics.

Continue reading “Running Multiple Angular SPA using NRWL” »

586 total views, 7 views today

Build and Deploy Angular App to Azure from Github via KuduScript

Hi Friends,

In this section, I thought to share deploying any app to Azure via Github. Building app and pushing the same on Git is no brainier. But, deployment on Azure is bit tricky here.

Continue reading “Build and Deploy Angular App to Azure from Github via KuduScript” »

874 total views, 9 views today

Reactive Forms in Angular – Part 1

In the last section, we have understood how to use template driven forms in Angular. In this section, we will focus on how to make use of reactive forms. This approach allows user to create form in greater detail. Here, we will create the forms programmatically in TypeScript.

Continue reading “Reactive Forms in Angular – Part 1” »

620 total views, 3 views today

Angular Forms – Template Driven Part 2

Hi,

In the last section, we have seen how to register controls, how we can submit the form and also which properties this form has. In this section, we will extend the Forms learning from the last point. Basically, we will see start with local reference way of accessing the form. Therefore, when I mention, local reference, it means I am referring to @ViewChild() property.

Continue reading “Angular Forms – Template Driven Part 2” »

552 total views, no views today

Dynamically importing modules at Runtime

Hi Friends,

In this section, we are going to talk about dynamically importing modules and its related components. Say for instance, your CORE SPA is hosted on one server. And different teams are basically building different features as modules, which needs to be injected as part dependency injection. Idea is keeping Core part leaner and meaner. Then how could we achieve the same. In the last post, we have seen similar kind of post, where in we injected modules dynamically but, module was known at compile time as we have used webpack’s import which basically takes path to module as input parameter. In this case, module’s can be injected by reading some kind of metadata coming from somewhere. Hence, you can have get some JSON files with some metadata say what modules’ and related dependencies to load. Then, it will load accordingly

Continue reading “Dynamically importing modules at Runtime” »

685 total views, no views today

Dynamically Importing Modules and Related components in Angular 4/5

In this section, we are going to see, how to dynamically import modules and other related components. In enterprise apps, there might be a scenario, where in you end up loading the modules based on some metadata, say which is coming from some REST call may be. In those scenarios, this kind of implementation is needed. We will discuss Lazy Loading in detail when we talk about those scenarios. However, let’s look at the code where we lazy load modules with all its dependencies.

Continue reading “Dynamically Importing Modules and Related components in Angular 4/5” »

1,194 total views, 25 views today