In Angular, lifecycle hooks are special methods that allow you to tap into key moments of a component or directive’s life — from creation to destruction. These hooks let you execute custom logic at specific points in the component’s life cycle. Angular provides several built-in hooks. Here’s a structured breakdown: 1. ngOnChanges Called: Whenever…
Prettier is an opinionated code formatter. It automatically formats your code so that it follows consistent style rules. It supports many programming languages, including: JavaScript / TypeScript HTML / CSS / SCSS JSON / YAML / Markdown Python (via plugins) And more It does not check for errors or bugs—it just makes your code…
ESLint is a static code analysis tool for JavaScript (and related languages like TypeScript) that helps you find and fix problems in your code. Essentially, it enforces coding standards and best practices so your code is cleaner, more consistent, and less prone to bugs. Here’s a breakdown: Linting: ESLint analyzes your code without running…
1. Angular Templates An Angular template is the HTML view that defines how the UI looks. It can include: Standard HTML elements Angular-specific syntax (directives, bindings, pipes) Example of a simple template: <h1>Welcome, {{ userName }}!</h1> <p>{{ message }}</p> <button (click)="updateMessage()">Click me</button> <h1>Welcome, {{ userName }}!</h1> <p>{{ message }}</p> <button (click)="updateMessage()">Click me</button> Here: {{…
1. Services in Angular Definition:A service is a class in Angular that contains logic, data, or functionality that can be shared across multiple components. Services are used to separate concerns, meaning components handle the view, while services handle business logic or data fetching. Common uses of services: Fetching data from APIs (HTTP requests) Storing…
1. What is a Pipe? A pipe takes in data as input and transforms it into a desired output for display in the template. It's similar to a filter in other frameworks. Example: <p>{{ birthday | date:'longDate' }}</p> <p>{{ birthday | date:'longDate' }}</p> Here, the date pipe transforms a Date object into a readable…
In Angular, directives are classes that add behavior to elements in the DOM. There are two main types: Structural Directives – change the DOM structure (add/remove elements). Examples: *ngIf, *ngFor. Attribute Directives – change the appearance or behavior of an element. Examples: [ngClass], [ngStyle]. 1. Structural Directives *ngIf Conditionally renders elements. <p *ngIf="isLoggedIn"> Welcome,…
In Angular, a decorator is a special kind of declaration that attaches metadata to a class, method, property, or parameter. Angular uses decorators extensively to understand how different pieces of your application should work. They are just functions prefixed with @ that tell Angular how to treat a class or element. Common Angular Decorators…
In Angular, a component is the fundamental building block of the user interface (UI). Structure of a Component A component is made up of three main parts: TypeScript class – contains properties (data) and methods (logic). HTML template – defines what gets rendered on the page. CSS/SCSS styles – optional styles for that component’s…
In Angular, a module is a way to organize an application into cohesive blocks of functionality. 👉 Technically, a module in Angular is defined using the @NgModule decorator.It tells Angular how to compile and launch your application. Key Points about Angular Modules: Root Module (AppModule) Every Angular app has at least one module, called…