Angular SDK

Angular error tracking that finds bugs before your users do

An Angular SDK with an ErrorHandler provider, router instrumentation, and an HTTP interceptor — plus session replay and readable stack traces via source maps on the same platform. Call init before bootstrap, register the providers, and every uncaught error reaches your dashboard with the journey behind it.

Why Angular apps need real error tracking

Angular apps fail quietly in production. An uncaught exception in a component breaks a workflow for a user three time zones away, the console message disappears with their tab, and the first signal you get is a support ticket with no steps to reproduce. Minified production bundles make it worse — a stack trace pointing at main.7d4f9b.js line 1 tells you nothing about which component, route, or HTTP call actually failed.

AllStak's Angular SDK closes that gap. Call init in main.ts before bootstrapping, then register the standalone providers: provideAllStakErrorHandler forwards every uncaught error, provideAllStakRouterInstrumentation traces navigation, and allStakHttpInterceptor records each outbound request as an http.client span. Upload source maps and minified traces become readable code; session replay shows what the user actually did before the failure. All of it lands on the same platform as your backend errors, logs, and uptime — one bill, one dashboard.

Full-stack Angular monitoring

From an uncaught exception in a component to the HTTP call behind it, AllStak covers your Angular app across every layer.

Error tracking

provideAllStakErrorHandler — or createErrorHandler for a custom ErrorHandler — forwards every uncaught error automatically, and AllStak.captureException reports the ones you handle yourself.

Session replay

See what the user actually did before the error — clicks, navigation, and the moment it broke — with privacy masking so sensitive input never leaves the browser.

Source maps

Upload source maps and minified production stack traces resolve to your original TypeScript — file, line, and function — so the fix starts immediately.

Router instrumentation

Register provideAllStakRouterInstrumentation and navigations are traced automatically — so every error carries the route the user was on when it happened.

HTTP interceptor

allStakHttpInterceptor records each outbound request and opens an http.client span — use the functional interceptor with withInterceptors, or the class version with HTTP_INTERCEPTORS.

Alerts & incidents

Get notified the moment a new error appears or an old one spikes — before the support tickets arrive, not after.

Add AllStak in minutes

Install from npm and call init in main.ts before bootstrapping the app — then register the standalone providers for errors, routing, and HTTP.

main.ts
npm install @allstak/angular

import { init } from '@allstak/angular';
import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { appConfig } from './app/app.config';

init({ apiKey: 'your-ingest-key', environment: 'production' });

bootstrapApplication(AppComponent, appConfig);

In appConfig, register provideAllStak, provideAllStakErrorHandler, provideAllStakRouterInstrumentation, and provideHttpClient(withInterceptors([allStakHttpInterceptor])) — the setup guide shows the full providers array. full setup guide · SDK reference.

What you see in AllStak

Error detail with full context

Open any issue to a readable stack trace (via source maps), the breadcrumbs leading up to it, and the release it shipped in — reproduction without the guesswork.

Session replay of the failure

Watch the user's session around the error — what they clicked, where they navigated, and what the page looked like when it broke.

Routes and HTTP calls together

Router instrumentation and the HTTP interceptor put every navigation and outbound request next to the errors they relate to — so a failing API call is never a mystery.

Unified real-time dashboard

Frontend errors next to the backend errors, logs, and uptime of the APIs behind them — one dashboard, in English or Arabic, for the whole team.

Why teams pick AllStak for Angular

  • Frontend and backend on one platform — errors, logs, uptime, and infrastructure with one bill.
  • Standalone provider functions that fit modern Angular — register them once in appConfig and you're covered.
  • Session replay and source maps turn vague bug reports into watchable, readable evidence.
  • Router instrumentation and the HTTP interceptor capture the journey — no per-call instrumentation.
  • Predictable SAR pricing with a genuine free tier — start without a credit card.
  • Data stays in Saudi Arabia, with an English and Arabic dashboard for the whole team.

Angular monitoring FAQ

How do I add error tracking to an Angular app?

Install @allstak/angular from npm, call init with your project API key in main.ts before bootstrapApplication, and register provideAllStakErrorHandler in your providers. Uncaught errors are forwarded automatically from there; the setup guide covers the router and HTTP providers too.

Does AllStak work with Angular standalone components?

Yes. The SDK ships provider functions built for the standalone API — provideAllStak, provideAllStakErrorHandler, provideAllStakRouterInstrumentation, and the functional allStakHttpInterceptor with withInterceptors. Module-based apps can use the class AllStakHttpInterceptor with HTTP_INTERCEPTORS and createErrorHandler with the ErrorHandler token instead.

Is AllStak free for Angular?

Yes. AllStak has a free tier you can start on without a credit card, and predictable SAR pricing as you grow. The Angular SDK itself is free to use.

Is AllStak a Sentry alternative for Angular?

Yes. You get Angular error tracking with source maps and session replay like Sentry, plus the logs, uptime, and infrastructure monitoring of your backend on the same platform — one SAR bill and data stored in Saudi Arabia instead of a stack of separate tools.

Will the SDK slow down my Angular app?

The SDK is built for production browsers: capture hooks are lightweight and telemetry ships in the background, so your users' experience isn't meaningfully affected. You also choose exactly what's instrumented — each provider (error handler, router, HTTP interceptor) is registered separately.

Start tracking Angular errors today

Call init, register the providers, deploy — and watch errors, routes, and sessions arrive in one dashboard. Start free — no credit card required.