https://github.com/lukaofirst/learning-angular

This repository contains my practices and lessons with Angular
https://github.com/lukaofirst/learning-angular

angular angular2 javascript typescript

Last synced: 8 months ago
JSON representation

This repository contains my practices and lessons with Angular

• Host: GitHub
• URL: https://github.com/lukaofirst/learning-angular
• Owner: lukaofirst
• Created: 2022-11-03T15:54:52.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2022-12-12T17:27:19.000Z (over 3 years ago)
• Last Synced: 2025-01-02T23:36:06.401Z (over 1 year ago)
• Topics: angular, angular2, javascript, typescript
• Language: TypeScript
• Homepage:
• Size: 1.07 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
Learning Angular


Main Topics Learned


-   How an Angular App gets Loaded and Started

-   Creating a Component

    -   understanding the @Component decorator

    -   adding component "manually" and using the CLI

-   Databinding

    -   String Interpolation

    -   Property Binding

    -   Listening to User Events

    -   Two-Way-Binding

    -   Binding to Custom Properties using the @Input() decorator (Parent-Child Communication)

    -   Binding to Custom Events using the @Output decorator + EventEmitter() (Child-Parent Communication)

    -   Accessing the DOM using the Template Variables #templateVariable and @ViewChild() decorator

    -   Projecting Content with ng-content and accessing with @ContentChild() decorator

-   Directives

    -   Output Data Conditionally \*ngIf

    -   Styling Elements Conditionally [ngStyle] [ngClass]

    -   Outputting Lists \*ngFor

    -   Creating a custom Directive

    -   The usage of @HostListener(), @HostBinding() decorators

    -   Understanding and building a Structural Directive

-   Services

    -   Creating and Injecting a Service into Components

    -   Injecting Services into Services

    -   Using Services for Cross-Component Communication

-   Routes

    -   Setting up Routes and Nested Routes

    -   Navigating through Router Links

    -   Styling route links using routerLinkActive

    -   Navigating Programatically

    -   Passing and Fetching Parameters, Query Parameters and Fragment to Routes

    -   Adding a 404 Not Found Page and Redirect to a Route

    -   Protecting Routes using CanActivate interface

    -   Passing static data to a route

    -   Passing dynamic data to a route using Resolve Guard

-   Observables

    -   Creating an Observable (processing data, error or complete)

    -   The needed of unsubscribe custom observables

    -   Operators (mid-layer between Observable-Observer to manipulate the output)

    -   Subject (the "new-way" to handle EventEmitter() observable)

-   Forms

    -   Template-Driven Approach

        -   Creating, registering and submitting form data

        -   Adding validators (only native HTML form validation) and use them to output feedback messages

        -   Deep dive into databinding (No Binding, One Binding and Two-Way Bind)

        -   Grouping form controls

        -   Setting/Patching form values

    -   Reactive Approach

        -   Creating, synching and submitting form data

        -   Adding built-in Angular validators and output feedback messages

        -   Grouping controls

        -   Creating Custom Validators and Custom Async Validators

        -   Observables of a reactive form

        -   Setting/Patching form values

-   Pipes

    -   Using built-in pipes

    -   Creating custom pipes

    -   The filtering pipe's problem

    -   Chaining multiple pipes

-   Http Requests

    -   Injecting and using types with HttpClient

    -   Handling Errors

    -   Making CRUD operations

    -   Setting Headers and Query Params

    -   Changing the default response

    -   Interceptors

-   Modules and Lazy Loading

    -   Module's definition

    -   Using Shared Module (Declaring Components, Directives and Pipes only once)

    -   Lazy Loading

    -   Preloading Lazy Loaded Code

-   Standalone Components

    -   What they are and what changes?

    -   Building a Standalone Component

    -   Services, Routing and Lazy Loading with Standalone Component

Notes


-   This repo was made following the course: [Angular - The Complete Guide](https://www.udemy.com/course/the-complete-guide-to-angular-2/)