angular

Day 2 – Create a ShoppingCart component

by

Loading

Reading Time: < 1 minuteOn day 2, I will delete the boilerplate codes and create the ShoppingCart component. Create the shopping cart component Deleted all the files from the components/ folder.Create ShoppingCart.vue in the component/ folder. The template has a paragraph element that displays “Shopping Cart”. Updated the codes in App.vue that failed to compile Create shopping-cart.svelte in the lib/ folder. The template has a paragraph element that displays “Shopping Cart”. … Read more

Day 1 – Create a new projects, dependencies, and global CSS styles

by

Loading

Reading Time: 2 minutesThe contents are from Vue School’s Vue.js 3 Fundamental with the Composition API. The Vue app was written in TypeScript + Composition API, and then it was ported to Angular 19 and Svelte 5 to get a first-hand experience of their similarities and differences. This is a simple shopping cart that adds and deletes items from … Read more

Asynchronous redirectTo function in Angular Routing

by

Loading

Reading Time: 3 minutesOne of the new features in Angular 20.0.0-next.8 is the asynchronous redirect function. The redirect function redirects from a matched route path to another in the routing configuration. In version 19, the function’s return type is string | UrlTree, which is a synchronous value. This feature allows the function to return an Observable or a … Read more

Using HttpContext to Configure httpResource Requests

by

Loading

Reading Time: 5 minutesAngular’s httpResource simplifies data fetching, and HttpContext allows you to pass metadata to HTTP interceptors. This combination provides a powerful way to manage HTTP requests, especially when you need to modify them dynamically. This blog post will explore how to integrate httpResource and HttpContext. We’ll focus on a practical example: setting the responseType of an HTTP request based on context. The Problem … Read more

Displaying httpResource Status Code and Headers in Error

by

Loading

Reading Time: 4 minutesIn Angular 19.2.7, a bug fix was made to set the appropriate status code and headers when a request fails in httpResource. The response has the same metadata in successful and failed HTTP requests; therefore, status code management can be handled similarly in all paths. When the status code is 200, the application will show a … Read more

Built replies generation application with Angular

by

Loading

Reading Time: 6 minutesIntroduction I built a replies generation application four times using different large language models, APIs, frameworks, and tools. I experimented with different tools and models to find my preferred stack to build Generative AI applications. Create a new Angular Project Update the app component The app component has a router outlet to lazy load the … Read more

Built text summarization application to summarize a web page with Angular

by

Loading

Reading Time: 6 minutesIntroduction I am an Angular and NestJS developer interested in Angular, Vue, NestJS, and Generate AI. Blog sites such as dev.to and hashnode have many new blog posts daily, and it is difficult for me to pick out the good ones to read and improve my knowledge of web development and generative AI. Therefore, I … Read more

rx-angular/state – a library for managing states of an Angular application

by

Loading

Reading Time: 7 minutesIntroduction Many companies and developers use Angular to build Enterprise applications, which are so large that they must manage a lot of data. To maintain the applications in scale, developers use state management libraries such as the rx-angular/state library or the Angular Signal API to manage states. In this blog post, I create a cart … Read more

Signal in a service for state management in Angular

by

Loading

Reading Time: 6 minutesIntroduction Many companies and developers use Angular to build Enterprise applications, which are so large that they must manage a lot of data. To maintain the applications in scale, developers use state management libraries or “Signal in a Service” to manage states. In this blog post, I implement the “Signal in a Service” to create … Read more

State Management in Angular using NgRx Signal Store

by

Loading

Reading Time: 6 minutesIntroduction Many companies and developers use Angular to build Enterprise applications, which are so large that they must manage a lot of data. To maintain the applications in scale, developers tend to use state management libraries or the Angular Signal API to manage states. In this blog post, I want to use the NgRx Signal … Read more