Blog
Mert Özen's blog posts on software development, backend, frontend, and DevOps.
What Is Angular and Why Does It Exist? The Reason Behind the Framework
What exactly is Angular, why does it exist and what problem does it solve? We cover framework vs library, the TypeScript requirement, when Angular is the right choice and how this series unfolds.
Angular Setup and Your First Project: Preparing the Environment from Scratch
We install Node 16 with nvm and Angular CLI 12, create our first project, and walk through every file from app.module.ts to the environments folder to see what each one does.
Your First Angular Component: The Anatomy of Decorator, Selector and Template
We take apart an Angular component: the @Component decorator, selector, template and styles. We generate one with the CLI and see the component tree and style encapsulation.
What Is an Angular NgModule? Declarations, Imports, Exports and Feature Modules
We open up NgModule, the skeleton of an Angular 12 app: declarations, imports, exports, providers, bootstrap, startup in main.ts, BrowserModule vs CommonModule, feature and shared modules.
Data Binding in Angular: Interpolation, Property, Event and Two-Way Binding
Every bridge between class and template in Angular 12: interpolation, property, attribute, class and style binding, event binding and $event, template reference variables and [(ngModel)].
Angular Built-in Directives: *ngIf, *ngFor, ngSwitch, ngClass and Your Own Directive
Angular 12's built-in directives: *ngIf with else, *ngFor with trackBy, ngSwitch, ngClass, ngStyle, ng-container, the ng-template behind the asterisk, and your own attribute directive with HostListener.
Component Communication in Angular: @Input, @Output, @ViewChild and ng-content
How components talk in Angular 12: data from parent to child with @Input, notifications back with @Output and EventEmitter, your own two-way binding, @ViewChild and content projection with ng-content.
Angular Lifecycle Hooks: A Component's Life From ngOnInit to ngOnDestroy
Constructor vs ngOnInit, ngOnChanges with SimpleChanges, ngAfterViewInit where ViewChild is ready, and ngOnDestroy for cleaning up intervals. We log every hook to see the exact order.
Angular Pipes: Dates, Currency, Turkish Locale and Writing a Custom Pipe
Built-in pipes like date, currency, number and titlecase, parameters and chaining, Turkish formatting with registerLocaleData, writing a custom pipe, and how pure vs impure affects performance.
Angular Services and Dependency Injection: providedIn, the Injector Tree and Providers
Why services exist, singletons with providedIn: 'root', constructor injection, component-level providers and hierarchical injectors, useClass/useValue/useFactory, and config values via InjectionToken.
Introduction to RxJS in Angular: Observables, Operators, BehaviorSubject and the async Pipe
Observable vs Promise, of/from/interval/fromEvent, a search box with map, filter, debounceTime and switchMap, service state with BehaviorSubject, the async pipe, and avoiding leaks with takeUntil.
Angular HttpClient for API Requests: GET, POST, Error Handling and Interceptors
We send GET, POST, PUT and DELETE requests with Angular 12's HttpClient. Typed responses, HttpParams, error handling with catchError and retry, class-based interceptors and environment config.