Services and HttpClient: singletons by default

Business logic lives in services, not components

Angular services are plain TypeScript classes you inject into components and other services. Services centralize API calls, caching, authentication state, and shared logic. With providedIn: 'root', Angular's DI makes one instance available throughout the application.

@Injectable({ providedIn: 'root' })
export class InvoiceApi {
  private http = inject(HttpClient);

  list(): Observable<Invoice[]> {
    return this.http.get<Invoice[]>('/api/invoices');
  }
}