Notes about Refactoring, at very beginning

https://refactoring.guru/refactoring/what-is-refactoring

Why Refactoring ?
Fight technical debt, clean code

And because you are not Chuck Norris

Angular errors that kick in my nuts - ExpressionChangedAfterItHasBeenCheckedError

Take notes of some angular errors which kicked good in my nuts

ExpressionChangedAfterItHasBeenCheckedError: "Expression has changed after it was checked"

Notes about Domain-Driven Design

Ubiquitous Language

Consistent nouns, verbs, statements within the team. Your team member should know what you're saying immediately in the first sentence.

From Promise to async/await in Typescript Part II

In part I we went through a simple example, simple enough to illustrate what async/await look like and how to use them. This time we can discuss why we want to embrace async/await, instead of our old friend Promise.

From Promise to async/awiat in Typescript Part I

Diving in the asynchronous programming environment for a long while, at least 3 or 4 years I think, from Promise to Rx Observables. Until recently I finally found that they actually put this pattern support explicitly into ES6(ECMAScript 2015) implementation.

Design an Angular 2+ shopping module PART 3

Follow up from PART 2 we now need to fill the blank of payment implementation which is mostly handled by 3rd party payment services, but we still need an adapter or api or something to communicate with these external services.

Design an Angular 2+ shopping module PART 2

Now I'll need an user story to figure out what services and functionalities I need.

The user story...

1. When I see an item, whatever is for sale, it's a Product. I can add it to my shopping cart.
2. I can quick link to my shopping cart wherever in the APP.
3. I can change the quantity of purchased product
4. It'll require my contact information to complete the order.
5. I have to choose a payment method to complete the order.
6. I have to follow the instruction of payment method to complete payment.
7. When payment confirmed, I need to be noticed that the order is confirmed paid.
8. I can review the order detail anytime.
9. I can check a list of all my orders.

Design an Angular 2+ shopping module PART 1

I should have done this way before my code of this module being tangled like a hell.

A shopping module...

What the fudge is it ?

It's an Angular 2+ shopping module, which is meant to be integrated into any Angular 2+ APP and enabling users to purchase items in the APP, to create an order, and to pay for that order.

RxJs mergeMap, switchMap, concatMap, exhaustMap in exmples PART 2

PART 1

Quick review of part 1, our purpose is to clarify differences between RxJs mergeMap, switchMap, concatMap, exhaustMap, and we made a scenario as bellow to do this:

• There are 5 tasks which I have to do on almost every morning
• The 5 tasks start in a specific order, which won't change at all.
• But how long each task takes to finish it, that will change.
• Our mappers wait for a task finish and emit message to info the finish.

RxJs mergeMap, switchMap, concatMap, exhaustMap in exmples PART 1

We once talked about how mergeMap(flatMap), switchMap, concatMap work and what's those differences between them, in words, without examples. And we missed the youngest kid in the Map family, exhaustMap. It's time to use some example codes to clarify them once for all.

Write a compound number range picker in Angular 6

The reason of this component is that I need a custom input for users to decide their budget, include minimum and maximum, 2 numbers. And lately I found that this input could be reusable in many cases, while itself defined in features as below: