Angular
Senior

The tag defines the element; The attribute configures information or behavior in its start tag. A property DOM represents the live state and may differ from the initial attribute.

id identifies an element within the document and is used for relationships, fragments and labels. class groups elements for styles or behavior.

I associate labels, group options with fieldset/legend, use types and autocomplete, explain errors and move focus when the flow requires it.

ol communicates that the order modifies the meaning; ul groups elements without semantic sequence.

A link with href changes location and preserves native actions such as opening in another tab. A button executes an action in the interface. Choosing the right element brings keyboard, role and expectations without recreating them with JavaScript.

Attributes such as required, type, min, max and pattern express constraints and allow feedback from the browser. The application can customize messages, but the server must repeat the validation because the client can modify it.

Flexbox distributes elements along an axis and allows wrapping. Grid defines a two-dimensional structure. An interface can use both at different levels.

The element can live within a stacking context that is below another. I compare ancestral contexts before uploading the number.

display:none removes box; visibility:hidden conserves its space. If you need to only visually hide and maintain readability, I use a proven visually-hidden pattern.

I reduce specificity, define tokens and layers, limit scope, document variants and test states, sizes, themes and actual content.

I identify the stacking contexts of both elements and compare their ancestors, not just their numbers. transform, opacity, isolation, and certain positioned elements create contexts that limit where a descendant competes.

A media query responds to the viewport or user preferences. A container query responds to the space available for the component. The second allows you to reuse the same piece in different layouts without knowing the page that contains it.

var has function scope and allows redeclaration. let and const have block scope and remain in the Temporal Dead Zone until initialized. const prevents reassignment of the binding, but the referenced value can still mutate.

== converts the array to primitive, produces an empty string, and then converts both sides to numbers: zero and zero. With === the result is false because the types differ.

I use arrow for callbacks that need the outer this. Use normal function for dynamic methods, constructors or APIs that assign receiver.

A shallow copy creates a new object or array, but nested values are copied by reference. For example, with const original = { user: { name: 'Ana' } }; const copy = { ...original };, copy !== original, but copy.user === original.user; therefore, copy.user.name = 'Luis' also changes original.user.name. Spread, Object.assign, Array.from, and slice make shallow copies. A deep copy recursively duplicates the structure so nested objects do not share identity. structuredClone(original) works for many native data types and cycles, but it does not clone functions or DOM elements, and it does not preserve the behavior of every class instance. I do not deep-clone by default: it costs CPU and memory and can break identities the application relies on. For state updates, I prefer copying only the changed path, such as { ...state, user: { ...state.user, name: 'Luis' } }; this preserves immutability and structural sharing without duplicating the entire object graph.

When JavaScript enters a block, it creates the bindings for let, const, and class, but leaves them uninitialized until their declaration executes. That interval is the Temporal Dead Zone. Reading the binding during it throws a ReferenceError: console.log(total); let total = 1;. Even typeof total fails when total is in the TDZ, unlike a variable that does not exist. With var, the binding is initialized to undefined, so early access does not fail and can hide an ordering bug. The TDZ prevents a block-scoped variable from being used before it has the value promised by its declaration. It does not mean let and const are not hoisted: their bindings are created when entering the scope, but they are not accessible yet.

Yes, but I would deliberately use value == null only when I want to accept exactly null or undefined. The comparison is true for those two values and false for 0, false, '', and NaN; for example, if (response.middleName == null) detects that an optional field is missing without rejecting a valid empty string. This is a well-known Abstract Equality exception and should be allowed explicitly with a rule such as eqeqeq: ['error', 'always', { null: 'ignore' }]. Everywhere else I use === and !==, because == applies coercions that are difficult to read: '' == 0, '0' == false, and [] == false are all true. If the team prioritizes maximum explicitness, I write value === null || value === undefined; it communicates the same contract without relying on knowledge of the exception.

class organizes inheritance and methods with clearer syntax; the runtime resolves methods through prototypes. Knowing the model explains instanceof, shadowing and shared methods.

map creates a transformed collection and requires using the return. forEach expresses one effect per element and returns undefined.

Map accepts any key, preserves insertion order, and offers size and direct iteration. An object fits into records with string/symbol keys and JSON serialization.

push, pop, shift, unshift, splice, sort, reverse, fill and copyWithin. map, filter, slice, concat and the to* methods create another array.

Spread copies enumerable properties from the first level. Nested references remain shared and the copy does not preserve complete descriptors or internal behavior of all objects. First I define which part of the model needs a new identity.

Each operator can loop through and assign another collection. On a hot route or a large list, a single loop can reduce memory and work. I keep the chain when its clarity outweighs that measured cost.

Run the synchronous stack first, then all the created microtasks, and only then timers. Each callback can queue more microtasks before the next task.

Promise represents a settlement and starts when it is created. Observable can produce multiple values, is usually lazy, and allows unsubscribe and concurrency operators.

I create an AbortController, pass signal to fetch and call abort. I treat AbortError as a cancellation, not a product failure.

The parser detects a syntax error before executing that unit. A runtime error appears when evaluating a valid operation on syntax with an invalid state.

The browser empties the microtask queue before advancing to the next task and rendering. A chain that schedules another microtask can delay input and painting. I split the work and defer to the scheduler when I need the browser to process another task.

Promise.all rejects upon receipt of the first observable rejection, but remaining operations continue unless its API supports cancellation. I use allSettled when I need the result of each operation and AbortController when I need to stop compatible I/O.

unknown forces you to validate or narrow the type before using it. any allows invalid operations and propagates holes throughout the application.

Both describe shapes of objects. interface supports declaration merging and contract-oriented extension; type also represents unions, intersections, tuples, and computed types. The consistency of the code and the capacity needed decide the choice.

satisfies checks that the value satisfies a contract and preserves its inference. as forces an interpretation of the type and may hide an incompatibility. I use assertions only when the runtime provides a guarantee that the compiler cannot prove.

The generic must preserve a relationship between values, for example between input and output or between a key and its property. If the type parameter appears only once, perhaps a union or a specific type better communicates the contract.

I would migrate by supported increments, with tests, bundle budgets and observability. I prioritize security, compatibility and deprecated APIs; then I adopt new syntax.

Eliminates the need for NgModules to declare components. Modules can still bundle legacy APIs or libraries. Standalone simplifies dependencies and lazy loading.

I look for mutations that depend on ZoneJS, libraries that update fields without notifying and direct uses of external APIs. I migrate the visible state to signals, AsyncPipe or explicit flags and compare tests and metrics before removing ZoneJS.

I differentiate expensive content that does not participate in the first visual objective. I choose trigger and prefetch based on the probability of use, reserve space to avoid CLS and measure LCP, transfer and interaction in a production build.

An input expresses dependency on the parent and keeps the component reusable. A service serves state shared by distant branches or a domain. Do not hide presentation data by globalizing everything.

ng-content works for fixed slots and declarative ergonomics. TemplateRef allows you to repeat, parameterize, or choose templates at runtime.

Only inputs, outputs and slots that represent real variations of the product. If an option exposes internal details or joins invalid states, I prefer to split responsibilities or model a more precise join.

I create a directive when I need to add behavior to an existing element without imposing markup. I create a component when the unit has visual structure, state, and an API that must evolve together.

The constructor belongs to TypeScript and DI. ngOnInit belongs to the Angular loop and receives ready inputs. Avoid I/O on both if a resolver, store or resource expresses the load better.

Use AsyncPipe, signals or takeUntilDestroyed; clean external APIs with DestroyRef.onDestroy. Then I verify repeated navigation with profiler and tests.

ngAfterViewInit confirms that Angular initialized the view, but a measurement may depend on a later render. afterNextRender executes work after the next render of the tree and allows separating write and read phases.

Place the cleanup next to the resource that needs it and avoid concentrating contextless teardown on ngOnDestroy. I use it with listeners, observers and takeUntilDestroyed to bind their life to the injection context.

No. OnPush changes when Angular checks the view. Immutability makes it easier to detect changes by reference and avoids corrupt shared state.

For logging, storage, canvas, browser APIs or external integration. UI derivations belong to computed.

Code that mutates fields without issuing a supported notification, as well as dependencies on NgZone events. I would migrate state to signals or flag the view.

A signal compares the new value with the old one using Object.is by default. Mutating a property preserves the reference and does not publish another value. I create a new reference or model field as a separate signal.

computed calculates derived state and only depends on other signals. effect synchronizes the reactive graph with an external boundary such as storage, logging, or canvas. I do not copy derived state through effects.

It is a singleton within the injector that provides it. Two injectors can create two instances. The phrase 'singleton global' omits the scope.

Allows you to inject deleted configuration, functions or interfaces into runtime. The token preserves identity and can define factory and type.

useClass asks the injector to construct another instance of the indicated class. useExisting creates an alias to a registered instance. I use aliasing when two tokens must share identity and state.

The injector that registers the provider defines its scope and lifetime. A component provider isolates instances per subtree; one route can live with the lazy feature; root shares the instance in the application.

It nests life cycles and errors, complicates cancellation and creates races. A flattening operator expresses the policy and returns a single subscription.

I debounce, remove duplicates and use switchMap. unsubscribe cancels the XHR/fetch request when the backend and client allow it.

Unsubscribe stops the observation and may abort the request if the source integrates cancellation, such as HttpClient. The server may have started the job. Effects operations require idempotence or their own cancellation protocol.

You can retain the last value and keep the subscription alive longer than expected. I define buffer, refCount and reset policy according to the life cycle. I also decide how to invalidate errors and stale data.

When several flows share state, you need traceability, coordinated effects or complex rules. For an isolated form, a global store increases cost without benefit.

Recalculable derivations, unnecessarily non-serializable objects, and ephemeral DOM state. I would save the minimal source of truth.

Server state is a copy of remote data and requires stale time, caching, and invalidation. Client state is born in the interaction, for example filters or steps of a wizard. Separating them prevents a store from treating both lifecycles with the same policy.

I consider it when multiple flows write the same domain, I need event traceability, coordinated effects or shared update rules. A local form or isolated display does not justify that cost alone.

No. A user controls the client. The guard improves UX and prevents accidental navigation; the API authorizes each operation.

Resolve when the view does not make sense without the data or you need consistency before activating. Component loading for streaming, skeletons or partial content.

CanMatch decides if a route configuration can participate in matching and allows another route to be tested. CanActivate acts after choosing it and decides whether to activate it. None replace server authorization.

I avoid blocking navigation for secondary or slow data. The screen can show structure, loading and partial recovery. I use resolve when the data defines whether the route makes sense or when entering without it would produce an invalid state.

I define a typed schema, components by field type, derived visibility rules and registrable validators. I separate data, layout and behavior; I test the engine with contract cases.

Issue during writeValue, forget disabled state or do not check touched. That creates loops and breaks the semantics of the form.

You must write the external value without issuing a user change, register change and touched callbacks, and honor the disabled state. You also need a clear representation for null and partial values.

I model validation as a flow that cancels the previous query upon changing the value. I apply debounce when appropriate and distinguish transport error, invalid value and pending status on the interface.

In an authentication layer coordinated by interceptor, with a single renewal in flight and controlled queue. I avoid loops and clean the session if the refresh fails.

The HttpClient generic expresses the expectation, it does not validate the server. At a critical boundary I validate and transform the DTO before exposing it.

Each interceptor envelops the next. The request proceeds in the recorded order and the response returns in reverse order. Authentication, retry, cache and logging can change their behavior depending on that composition.

I relate each writing to the affected keys. I can override, update optimistically, or replace with the server's response. The policy includes rollback and avoids deleting data from unrelated domains.

DOM models the document. BOM brings together objects and APIs from the browser environment, such as history, location, and navigator.

I choose localStorage for few non-responsive preferences, sessionStorage for tab life and IndexedDB for volume, queries and asynchronous work.

A browser policy that allows the server to declare which origins can read a response. It does not protect endpoints from non-browser clients nor does it replace authorization.

Layout recalculates geometry; paint generates pixels; compositing combines layers. Changes and interleaved reads can force synchronous work.

A write invalidates styles or layout and a subsequent geometric read, such as getBoundingClientRect, forces the browser to calculate the result at that time. I group reads and writes to avoid repeating that work within a loop.

No. CORS controls which responses JavaScript can read from another origin in a browser. A server script can call the endpoint. The API still needs authentication, authorization and validation.

I use their limits and dependency inversion where they protect business rules. I avoid copying backend layers if they only add files and mappings.

When there is a stable contract and more than one real consumer, or when the limit requires ownership and own tests. Pull ahead freezes immature APIs.

Circular imports appear, coordinated changes between supposedly independent folders and shared services that know all domains. I relocate the behavior according to ownership and expose a small API per border.

It receives components, models and services from different domains until it becomes a global dependency. I separate reusable primitives from business contracts and leave each model close to the feature that owns it.

In Angular I provide the service on a shared injector. The guarantee is valid within that scope; local providers or multiple applications create other instances.

You can stabilize the feature's API and hide store details. You can also hide capabilities and duplicate names. I use it when protecting a real boundary.

The consumer depends on a contract expressed by an abstract class or InjectionToken. The configuration connects that contract to an implementation. I can change the border in tests or by environment without showing details to the consumer.

A facade that only renames each method adds navigation without reducing coupling. I use it when concentrating a use case, hiding coordination between dependencies, or protecting the UI from subsystem changes.

I define slow interaction, reproduce with real data and record performance. I identify network, scripting, layout or memory; I change a cause and measure again.

In *ngFor yes. Modern control flow uses track. Both preserve DOM identity; an unstable key voids the benefit.

I define an interaction and a metric, reproduce with a production build and capture a profile. Then I separate network, scripting, rendering and memory. I optimize the measured neck and compare again under the same conditions.

No. OnPush may reduce view checks, but a function that occupies the main thread still blocks input and render. I split the job, reduce its complexity or move it to a Worker if the message cost allows it.

Improves HTML delivery and SEO, but adds server and hydration. TTFB or interaction can worsen if the backend and the bundle do not match.

HTML different between server and client, non-deterministic dates or random, DOM manipulated before hydrating and invalid markup.

I use SSG for stable content, SSR for request-dependent HTML, and CSR for private areas where the shell contributes little to the server. I evaluate SEO, personalization, latency, cache and operational cost per route.

The client produces a different tree than the server's HTML due to non-deterministic data, browser access, or conditional markup. I share the initial state, isolate APIs from the browser and keep the structure stable until hydrated.

The most expensive risk: domain rule, permission, payment, migration or interaction that has already failed. Percentage coverage does not replace that prioritization.

I replace the service border, execute the interaction with the DOM and check the visible result and the relevant call. I don't test Angular.

One unit covers pure rules and states with few borders. An integration test checks template, DI, router or HTTP when its composition is part of the behavior. I choose the lowest level that can still detect the actual fault.

I control clock, scheduler and external responses. I wait for a observable condition instead of using arbitrary delays, close pending requests, and remove shared state between cases.

Reduces XSS by escaping and sanitizing known contexts. DOM Direct APIs, bypasses, libraries and external HTML reopen the risk.

It depends on the threat model. HttpOnly cookies reduce reading by XSS and require CSRF controls. LocalStorage simplifies headers but exposes the token to compromised JavaScript.

The call does not sanitize the content. Declares that the application trusts that source and bypasses Angular protection for that sink. I restrict it to a revised boundary and prefer to transform data before producing HTML.

The user controls the client and can skip navigation or call the API directly. The guard improves the experience. The server verifies identity, permissions and ownership in each operation.

Button provides keyboard, focus, role and activation without recreating behavior. A div requires implementing and maintaining all of that.

I combine lint and ax with real keyboard, screen reader in critical flows and review of focus, contrast and accessible names.

ARIA may contradict native semantics or announce a state that the behavior does not implement. I start with the correct HTML element and add name, status, or relationships only when information is missing.

I move focus to a useful point within the dialog, keep the navigation on its content, close with Escape when appropriate, and return focus to the trigger. The dialogue also needs a name and an inert background.

I maintain temporary API compatibility, handle chunk-load errors, use versioned assets, and avoid deleting previous files before their cache expires.

Errors, tests, bundles, Web Vitals, warnings, browser support changes and even dependencies. Later I removed obsolete compatibility.

I define owner, audience, fallback, metrics and retirement date. The backend maintains the authorization rules. Both paths remain tested as long as the flag exists and I remove the code when the rollout ends.

I generate them to relate minified errors to the TypeScript, but I restrict their access to the observability system. I associate each map with release and commit to symbolize the correct stack.

I increase observable context, compare version, browser, and data path, and create a testable hypothesis. I avoid speculative changes without a signal.

Normalized endpoint, status, duration, correlation ID and operation. I redact or delete body, tokens and personal data.

I propagate an allowed identifier in requests and register it along with route, release and action. Backend and gateway keep the same value to link the visible fault with logs and traces without saving personal data.

I repeat the traversal, force garbage collection in a diagnostic environment and compare heap snapshots. I look for retained components, detached DOM nodes, listeners, timers and caches that preserve references.

I group widgets by frequency and ownership, use a connection service with multiplexing, normalize events, apply backpressure and render with signals. I pause invisible streams and measure INP.

I define design tokens, accessibility and small APIs; I publish harnesses, documentation and semver. I try keyboard, themes, SSR and breaking changes.

WebSocket is for bidirectional communication, SSE for a server-to-client stream over HTTP and polling for infrequent changes or simple infrastructure. I compare reconnection, proxies, order, volume and backend support.

Defines key, TTL, invalidation, deduplication and stale behavior. It also explains how to reconcile optimistic updates, conflicts, and pagination changes without mixing different user data or filters.

I align constraints, compare options with criteria, spike if evidence is missing, and document the decision. Then I support the agreed option.

I described the form modularization case: you listened, reviewed standards, refactored for responsibility, asked for another review, and applied the learning.

Blocking due to correction, security, data loss, broken contract or a debt that prevents the change from operating. I mark preferences as suggestions and explain the risk so the author can apply the criteria.

Record context, restrictions, options considered, decision and consequences. I add owner and review date when conditions may change. The document allows the election to be discussed without depending on oral memory.

It is not the number of named APIs. It is being able to explain the mechanism, choose according to restrictions, compare alternatives and propose a way to validate the result. For example, it is not enough to say "I use switchMap": you must explain that it keeps only the most recent internal operation and why that policy matches the problem.

Say which part you know, reason from the Angular model and explain how you would verify the detail. Inventing a signature is more damaging than recognizing an edge.

Name two or three decisive conditions, set a reasonable scenario and choose. For example: “If the page needs SEO and quick initial content, I would choose SSR; “If it is an authenticated internal tool, I would start with CSR.” Then explain what information would change the decision.

Define the objective, compare alternatives with the same criteria and agree on a sign of success. "I prefer Signals" is an opinion; "I use Signals for synchronous local state because it simplifies derivations and I verify the impact with readability, tests and profiling" is a debatable and measurable decision.

I start with a one-sentence definition, explain the mechanism, and make a decision for a specific scenario. I close with the cost, the alternative and how I would check the result. If the question is broad, I point out that structure so that the interviewer can go deeper where they are interested.

I ask for the constraints that really change the answer: volume, change frequency, SEO, latency, consistency, security, and team capacity. If they are not available, I declare an assumption, choose under that scenario and say what information would make me change my option.

I am a Frontend Developer specialized in Angular, with experience since Angular 2 and distributed teams. I have designed dynamic scale forms and data products. I am looking for a role where I can combine architecture, delivery and mentoring.

Focus on growth, technical scope and type of product. Avoid badmouthing the current team or using a generic response.

I summarize the situation and task in a few sentences. I dedicate most of it to my decisions, alternatives and coordination. I close with a measurable result and the learning that changed my subsequent work.

I choose a real mistake, explain the decision that produced it, and take responsibility for my part. I describe how I limited the impact, what signal I added, and what code or process change prevented it from happening again.