TypeScript

I write a lot about Angular platforms, monorepos, and production frontends. Bio-Dynamics is different: a browser-only educational lab where you rotate a 3D body map, zoom into tissue, and run deterministic probiotic scenarios tied to health articles on omid.dev. It started for three reasons — a human one, a developer-story one, and a career one. This post is the anchor for that project. Deeper technical posts follow in a short series linked at the end. ...

Most frontend teams do not have a testing problem because they lack tests. They have a testing problem because nobody can explain why a specific test exists. The result is familiar: hundreds of unit tests that prove implementation details; a few end-to-end tests that fail whenever timing changes; component tests that duplicate what unit tests already cover; slow CI pipelines that people stop trusting; high coverage numbers with very little confidence. This is especially common in large Angular codebases. Angular gives teams a serious testing toolbox: TestBed, standalone components, dependency injection, router testing, HTTP testing utilities, harnesses, and good compatibility with tools like Jest, Vitest, Cypress, and Playwright. The tooling is not the hard part. ...

Open almost any mature Angular screen and you will find the same shape: 1 2 3 4 5 loading = false; error: string | null = null; data: Account[] | null = null; retrying = false; submitted = false; The template then becomes a negotiation: 1 2 3 4 5 6 7 8 9 @if (loading) { <app-spinner /> } @else if (error) { <app-error [message]="error" /> } @else if (!data?.length) { <app-empty-state /> } @else { <account-table [rows]="data!" /> } This looks fine. It ships. It passes review. And then production teaches you that the screen was never modeled as one thing. It was modeled as five independent switches that sometimes agree and sometimes do not. ...

Every framework eventually discovers the same truth: developers love nice syntax until nice syntax becomes a hiding place. Angular’s recent template improvements are genuinely useful. Multiple consecutive @case blocks make some @switch statements cleaner. Spread and rest support in templates removes awkward helper code in small cases. Angular 21.2’s template additions, such as arrow functions and exhaustive @switch checks with @default never, continue the same direction: templates are becoming more expressive and more type-aware. ...

Most forms discussions start in the wrong place. They compare syntax. Reactive Forms gives us FormGroup, FormControl, validators, status flags, and a lot of well-known muscle memory. Signal Forms gives us fields, signal-shaped state, form-level submission, custom controls, and migration tools. It is tempting to treat this as a cleaner API for the same old job. But that misses the bigger shift. Signal Forms are not only about filling inputs and showing validation messages. They push forms into the same mental model as the rest of modern Angular state: explicit signals, derived values, and state transitions that can be composed instead of chased through subscriptions. ...

As we advance into 2024, the landscape of frontend development continues to evolve at a rapid pace. Developers are always on the lookout for frameworks that offer more efficiency, better performance, and ease of use. Among the numerous frameworks making waves this year, a few stand out due to their unique offerings and growing adoption: React: A robust and flexible library maintained by Facebook, still reigning as the most popular framework for building user interfaces. Vue.js: Known for its simplicity and ease of integration, Vue.js is a favorite for many developers who need to quickly spin up a project. Angular: A powerful framework backed by Google, Angular is widely used for building large-scale enterprise applications. Svelte: A newer but rapidly growing framework that offers a unique approach to building web applications with a focus on performance and simplicity. While React, Vue, and Angular have been the go-to choices for many developers over the past few years, Svelte is increasingly capturing the attention of the development community. Let’s dive deeper into what makes Svelte stand out and why it’s becoming a preferred choice for many. ...

Managing state in React applications has evolved significantly, from simple state hooks to sophisticated libraries that handle complex state scenarios. Recoil is a powerful state management library for React that addresses many limitations of traditional state management approaches. It provides a flexible and scalable way to handle state, particularly in large applications. This blog post will explore advanced state management techniques using Recoil, focusing on atom families, selectors, and handling asynchronous queries. ...

TypeScript has transformed the way we write JavaScript by providing a static type system that helps developers catch errors early and write more robust code. While basic types and interfaces cover a significant portion of everyday use cases, TypeScript offers advanced features that can take your code to the next level of type safety and flexibility. In this post, we will dive deep into three advanced TypeScript features: Conditional Types, Mapped Types, and Recursive Types. These features are indispensable for creating highly adaptable and type-safe codebases. ...

Angular 2.0 shipped in September. We are on 2.4 now, and the release train is already moving — Angular 4 is being talked about openly. I have been building with it since October, migrating a medium-sized internal dashboard that lived in AngularJS for three years. This is not a tutorial and not a verdict. It is a field report from someone who still dreams in $scope sometimes. The context nobody warns you about If you spent years on AngularJS, you did not “upgrade.” You rewrote. Google offers ngUpgrade to run both frameworks side by side, and we tried it for two weeks before giving up. Our app had too many directives, too much implicit magic, and too many $watches buried in places nobody remembered. We picked a greenfield module, scaffolded it with the CLI, and started porting feature by feature. ...