Posts

Showing posts from July, 2017

Tree structure in Angular with PrimeNg

Image
Tree structure in Angular with PrimeNg PrimeNg is a Angular component library. Compared to other component libraries like ngbootstrap or material, PrimeNg comes with more advance components which can’t be found elsewhere, one of them being the tree structure.
Having the component is one thing but having to build the tree data which can be used by the component is another hard part.
Therefore today I will firstly show how we can use PrimeNg and secondly I will show how we can mold data to fit in the model used to build PrimeNg tree.
This post will be composed by 3 parts:1. Install PrimeNg 2. Mold data for Tree structure with reduce 3. Other use cases and benefits 1. Install PrimeNgPrimeNg can be added via npm npm install primeng --save.
It also needs font awesome for icons which can be added via npm npm install font-awesome --save.After installed, under the /primeng/resources folder, we should be able to see the style files. Those needs to be added to the styles in the angularCLI .angu…

A better dotnet CLI experience with ConEmu

Image
A better dotnet CLI experience with ConEmuWhen developing multiple Web api under multiple Visual Studio solutions, it can become very tedious to maintain, run and debug. Opening multiple instances of Visual Studio is very costly in term of memory and running all at once also clutter the screen which rapidly becomes irritating. With the advent of dotnet CLI tools, it has been clear that the next step would be to move out of the common “right click/build, F5” of Visual Studio and toward “dotnet run” on a command prompt.
Last month I was looking for a Windows alternative of the bash terminal which can be found on Mac and I found ConEmu.ConEmu provides access to all typical shells via an enhanced UI. It is actively maintained and open sourced https://github.com/Maximus5/ConEmu. Today we will see how we can use ConEmu to ease our development process by leveraging only 2 of its features; the tasks and environment setup. This post will be composed by 4 parts:1. dotnet CLI 2. Setup environmen…

Configurations in ASP NET Core

Configurations in ASP NET CoreEvery application needs configurations, whether it is a port, or a path or simply string values. In order to deal with configurations, ASP NET Core ships with a Configuration framework. The framework provides a builder allowing to read configurations from different json files, supports environment convention and also defining custom configuration providers in order to read from other sources like MSSQL or other services.
Today we will see how we can use the configuration framework.This post will be composed by 2 parts:1. Install the configuration framework 2. Make configuration injectable via Options 1. Install the configuration frameworkWe start first by making sure we have the library installed, Microsoft.Extensions.Configuration.
In Startup constructor use the ConfigurationBuilder to extract configurations:public IConfigurationRoot Configuration { get; set; } public Startup(IHostingEnvironment env) { var builder = new ConfigurationBuilder() …

Managing global state with Ngrx store in Angular

Image
Managing global state with Ngrx store in AngularThe goal of Angular components is to be completely independent. This can lead to mismatch of displayed data where one component isn’t in sync with what other components are displaying. One solution is to have a stateful service shared among all components and delivering global data. This can be problematic when multiple pieces have to be globally accessible among multiple components. In this situation, the need for a global state becomes inevitable.Global state has had a bad reputation since inception due to its unpredictable nature.
About two years ago, Redux was introduced as a way to manage this unpredictability by making the state immutable and operations acting on the state synchronous and stateless (a similiar approach can be found in the actor pattern).
Since then, its principales has inspired multiple implementations, one of them being the Ngrx store for Angular.
Today I will go through the library and build a sample application …