Blog
Mert Özen's blog posts on software development, backend, frontend, and DevOps.
Angular Reactive Forms: FormGroup, FormBuilder, FormArray and Validators
Reactive forms in Angular 12: building the form in the class with FormControl, FormGroup and FormBuilder, custom and async validators, dynamic fields with FormArray, valueChanges and patchValue.
Angular Template-driven Forms: ngModel, ngForm and Form Validation
We build a template-driven form in Angular 12: FormsModule, ngModel and name, ngForm with ngSubmit, required/email/pattern validators, touched/dirty states, CSS classes and ngModelGroup.
Angular Guards and Lazy Loading: CanActivate, CanDeactivate, CanLoad and Resolve
We protect routes with class-based guards in Angular 12: CanActivate, CanDeactivate, CanLoad and Resolve. We lazy load a feature module with loadChildren and preload it with PreloadAllModules.
Angular Routing Guide: RouterModule, Route Parameters and Child Routes
Routing in Angular 12: app-routing.module.ts, router-outlet, routerLink, route parameters with ActivatedRoute, query params, Router.navigate, child routes, redirectTo and a wildcard for 404s.
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.
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 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.
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 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.
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 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.
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)].