Angular
Angular in Practice #6: Testing and Deployment — Wrapping the Track
The final post of the practice series. We fill the dashboard with tests, package it with Docker, deploy it to Cloudflare Pages, and run a full CI/CD cycle with GitHub Actions. Then we look back across all 27 posts of the Angular track.
Angular in Practice #5: Charts and Data Tables
A dashboard is, in the end, about visualization. We build a data table with sorting, pagination, and search using Angular Material's MatTable, and draw sales and category charts with ng2-charts — turning our dashboard into a screen that actually "shows" something.
Angular in Practice #4: State Management — Cleanup with SignalStore
In the previous post, signal state was wired directly into ProductService. In this post, we move it to @ngrx/signals' SignalStore for cleanup. Step-by-step, we follow the flow of gathering state, derived values, methods, and lifecycle into one place using the four-piece set of withState/withComputed/withMethods/withHooks.
Angular in Practice #3: Product CRUD with Forms + API
In the third post of the practice series, we layer real data work on top of the authenticated app. Combining Reactive Forms, HttpClient, and a Resolver, we build the screens for Product Create/Read/Update/Delete from start to finish.
Angular in Practice #2: Authentication and HTTP Interceptor
Filling the dashboard skeleton with an auth flow. Reactive Forms login, an AuthService that holds the token in a signal, a functional Auth Guard, and an HTTP Interceptor that automatically attaches the token to every request — a full lap around auth in modern Angular.
Angular in Practice #1: Building the Dashboard Skeleton
The first post in the practice series. We create the project with ng new, layer Angular Material on top, lay out the main layout with mat-toolbar and mat-sidenav, and stand up the lazy-loading routes — the skeleton.
Angular Advanced #7 Performance tuning — Virtual Scroll, Image, Profiler
Angular app performance, organized by three layers — build, runtime change detection, and resources. Virtual Scroll, NgOptimizedImage, Angular DevTools Profiler, and the defer block — the tools that actually pay off in large apps, all in one place.
Angular Advanced #6 SSR — Angular Universal and Hydration
Angular's SSR model, Hydration, TransferState, and pre-rendering — modern Angular's server-side rendering, all in one place.
Angular Advanced #5 Intro to NgRx — Store, Action, Reducer, Effect
NgRx — the tool for making state flow explicit in large apps. Maps out the roles of Store/Action/Reducer/Effect in a single diagram, and compares side by side with modern Angular's SignalStore and Component Store.
Angular Advanced #4 RxJS in depth — custom operators and Schedulers
On top of the RxJS basics from Intermediate, we cover the advanced topics that actually make a difference in practice. Higher-order Observables, concurrency-control operators, custom operators, Schedulers, and marble testing.
Angular Advanced #3 Dynamic components and ViewContainerRef
A walk-through of patterns for creating components dynamically at runtime. From ViewContainerRef and createComponent to @defer, ngComponentOutlet, CDK Portal, dynamic injectors, and memory management — all in one go.
Angular Advanced #2 Signals in depth — computed, effect, model
A deep dive into Signals, Angular's new reactive model. We bring computed, effect, input/output/model, linkedSignal, and the cooperation with RxJS together in one place.