Angular and Storybook – Component with content projection

Loading

Reading Time: 3 minutes In Bonnie’s visual DOM course, I learnt the technique of applying multiple content projections in a component. I created a FoodMenuCardComponent with two content projections; i.e., a component with two <ng-content> elements. The first <ng-content> has selector ‘head’ that projects FoodQuestion component and the second <ng-content> has selector ‘body’ that projects a list of FoodChoice … Read more

Angular and Storybook – Simple Component with inputs and actions

Loading

Reading Time: 4 minutes Previously, I created a story book for simple component with inputs only (link) . In this post, I want to add new stories for a simple components with both input and action. The component is FoodChoiceComponent that has two states: choice available to order and choice that has sold out. If choice is available, user … Read more

Angular and Storybook – Simple Component

Loading

Reading Time: 3 minutes I recently completed Visual DOM course at Angular Nation and the course covers advanced materials and is beneficial to Angular developers of any level. I personally struggle with the concept of view container ref (vcr) and would like to build a side project about it with my mentor, Nati. The idea of the application is … Read more

Swagger In NestJS

Loading

Reading Time: 5 minutes Problem: Frontend developers complained that integration with API is a painful process because there is no documentation on available endpoints, expected payloads and responses. Therefore, our backend team leads elect to enable swagger such that frontend developers can browse all the APIs on dedicated documentation site. When they showed me how it was done, I … Read more

Dynamic Task Scheduler In NestJS

Loading

Reading Time: 7 minutes Scenario: Our ESG (Environmental, Social, and Governance) platform requires to run schedule jobs to call endpoints to generate reports for internal teams and send company emails to our customers. Development team was tasked with developing a job scheduler that executes cron jobs at a specified period of time. node-cron is a popular open source library … Read more

Stripe Integration In NestJS

Loading

Reading Time: 6 minutes Scenario: Our ESG (Environmental, Social, and Governance) platform offers monthly and annual subscriptions to charge customers for using our ESG reporting service. When we designed our payment module, we chose Stripe as our payment platform because it accepts credit card payment method, provides good documentations and open source node library for the API (stripe-node). Problem: … Read more

How I cache data list in memory using useFactory in NestJS

Loading

Reading Time: 3 minutes Scenario: Application at work stores data lists in database tables and they never change after initial population. These data lists are used for dropdown selection in frontend, for example, users select their salutation in user profile page and click to make the change. Problem: When user opens the page, UI makes a HTTP request to … Read more

End to end testing (e2e) in NestJS

Loading

Reading Time: 4 minutes This is part 3 of Use TypeOrm Custom Repository in NestJS and this post is about end- to-end testing (e2e) of NestJS endpoints. In part one and part two, controllers, services and custom repositories are tested and they pass all the test cases. The final step is to validate HTTP requests between frontend and backend … Read more

Unit Test Custom Repository in NestJS

Loading

Reading Time: 5 minutes This is part 2 of Use TypeOrm Custom Repository in NestJS and this post is about unit testing custom repository. In part one, I created a NestJS demo with controllers, services and custom repositories. The demo also added unit testing on controllers and services in which I mocked the methods of custom repositories with jest.fn(). … Read more

Dependency injection by abstract class in NestJS

Loading

Reading Time: 3 minutes When developers start using NestJS, they create new module with controllers and services to design backend APIs. Developers register controllers and services in the module and inject service into controller to perform CRUD operations. Provider Registration The following is a code snippet of a user module; user controller is registered in controller array while user … Read more