Angular: Frontend Development with Real Projects

Master Angular directives, focusing on ngFor for rendering arrays and objects, and differentiate structural from attribute directives while applying ngIf, ngTemplate, and JSON pipe.

Learn to use ngFor with add and delete buttons to dynamically modify an object array by pushing new items and removing them with splice, and understand Angular change detection.

Learn to use the Angular ngIf directive to conditionally render lists or a no-data message based on array length, including ng-template for else conditions.

Learn to implement ng switch case in Angular to display step one, two, or three forms with buttons, a stepForm variable, and a TypeScript onClick handler, including a default fallback.

Explore ngStyle and ngClass in Angular to conditionally apply color, text transform, and CSS classes using style binding, object style, and class binding with a boolean isActive.

Identify Angular structural directives that reshape the dom by adding or removing elements with the leading asterisk, and contrast attribute directives like ngClass that change appearance without altering the dom.

Apply a small Angular form to input data, save and display it in a table, implement delete functionality, and show an empty state when no data remains.

Builds Angular form with name, email, and address bound by ngModel, saves entries to a user array, renders them in a table with ngFor and delete, plus a no-data template.

Learn how Angular pipes transform data in templates, pass parameters, and create a custom pipe from scratch, using eight inbuilt pipes like uppercase, currency, and JSON.

Explore built-in Angular pipes such as uppercase, lowercase, number, decimal, currency, date, JSON, percent, and slice, and learn how to create and register a custom prefix pipe.

Learn how to generate and implement custom Angular pipes with the CLI, register them automatically, and create dynamic, length-based text truncation with a default value.

Learn how angular services share data and methods across unrelated components using dependency injection. Create services with the angular CLI to support data modeling and angular interfaces.

Learn how to create Angular services manually, share data with components via dependency injection, and render a post list with the Ng4 directive, using providers and injectable services.

Learn to implement angular template-driven forms with ngForm and ngModel, build a validated HTML form, apply bootstrap styling, and show validation messages using touched and required rules.

Connect Firebase to an Angular project by configuring firebase init, enabling Firestore and Storage emulators, and injecting providers for app, Firestore, and Storage.

Learn how to build a to-do list in Angular with add, edit, update, and delete functionality, including descriptions, dates, and tags, using different APIs.

Develop an Angular to-do list app that consumes APIs to fetch, create, update, and delete tasks; build a Bootstrap UI with due dates and tags.

Explore a q&a page in angular frontend development that lets you select language and topic to fetch questions with an angular pipe, and style the page with a black background.

Build a qna frontend in angular by scaffolding the app, installing bootstrap and font awesome, configuring styles, creating home page and reusable components, and implementing routing and a responsive nav.

Implement a backend API to fetch languages, define language interfaces, and build an Angular service with HttpClient to supply data to a dynamic language dropdown in the component.