Merge branch 'main' into sponsorcard

Author: zalabhavy

blog/Introduction to Cryptography and Cyber security.md renamed to blog/introduction-to-cryptography-and-cyber-security.md

@@ -1,5 +1,5 @@
 ---
-title: 'Cryptography and Its Use in Cyber Security'
+title: "Cryptography and Its Use in Cyber Security"
 sidebar_label: Cryptography and Cyber Security
 authors: [pujan-sarkar]
 tags: [cryptography, cyber security, encryption, technology]
@@ -81,4 +81,3 @@ Zero-knowledge proofs enable one party to prove to another that a statement is t
 ## Conclusion
 
 Cryptography is a cornerstone of cyber security, providing the means to protect data and maintain privacy in an increasingly interconnected world. As technology advances and new threats emerge, the field of cryptography will continue to evolve, offering innovative solutions to ensure the security and integrity of our digital lives. By understanding and implementing cryptographic techniques, individuals and organizations can safeguard their information and build a secure future.
-

blog/Introduction to the Linux development and Cyber security renamed to blog/introduction-to-the-Linux-development-and-cyber-security.md

@@ -0,0 +1,60 @@
+---
+id: lesson-1
+title: "Advanced Forms in Angular"
+sidebar_label: Advanced Forms
+sidebar_position: 1
+description: "Advanced Forms in Angular"
+tags: [courses,Advanced-level,Form,Introduction]
+---
+ 
+Angular's reactive forms provide powerful tools for creating complex form structures and handling user input efficiently. Here are some advanced concepts you can leverage in Angular forms.
+
+#### Dynamic Forms
+
+Dynamic forms allow you to create forms whose structure can change at runtime based on user actions or external data.
+
+1. **Creating Dynamic Forms**:
+   ```typescript
+   import { FormBuilder, FormGroup, FormArray } from '@angular/forms';
+   import { Component } from '@angular/core';
+
+   @Component({
+     selector: 'app-dynamic-form',
+     templateUrl: './dynamic-form.component.html',
+   })
+   export class DynamicFormComponent {
+     form: FormGroup;
+
+     constructor(private fb: FormBuilder) {
+       this.form = this.fb.group({
+         items: this.fb.array([])
+       });
+     }
+
+     get items(): FormArray {
+       return this.form.get('items') as FormArray;
+     }
+
+     addItem() {
+       const item = this.fb.control('');
+       this.items.push(item);
+     }
+
+     removeItem(index: number) {
+       this.items.removeAt(index);
+     }
+   }
+   ```
+
+2. **Dynamic Form Template**:
+   ```html
+   <form [formGroup]="form">
+     <div formArrayName="items">
+       <div *ngFor="let item of items.controls; let i = index">
+         <input [formControlName]="i" placeholder="Item"/>
+         <button (click)="removeItem(i)">Remove</button>
+       </div>
+     </div>
+     <button (click)="addItem()">Add Item</button>
+   </form>
+   ```

courses/Angular/Advance-level/Advanced-Forms/Dynamic.md

@@ -0,0 +1,55 @@
+---
+id: lesson-2
+title: "Custom Form Controls"
+sidebar_label: Form Controls
+sidebar_position: 2
+description: "Custom Form Controls"
+tags: [courses,Advanced-level,Form Controls,Introduction]
+---
+
+
+
+Creating custom form controls allows you to encapsulate complex form logic and UI in reusable components.
+
+1. **Creating a Custom Control**:
+   ```typescript
+   import { Component, forwardRef } from '@angular/core';
+   import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
+
+   @Component({
+     selector: 'app-custom-input',
+     template: `<input [(ngModel)]="value" (ngModelChange)="onChange($event)" />`,
+     providers: [
+       {
+         provide: NG_VALUE_ACCESSOR,
+         useExisting: forwardRef(() => CustomInputComponent),
+         multi: true
+       }
+     ]
+   })
+   export class CustomInputComponent implements ControlValueAccessor {
+     value: string;
+
+     onChange = (value: string) => {};
+     onTouched = () => {};
+
+     writeValue(value: string): void {
+       this.value = value;
+     }
+
+     registerOnChange(fn: any): void {
+       this.onChange = fn;
+     }
+
+     registerOnTouched(fn: any): void {
+       this.onTouched = fn;
+     }
+   }
+   ```
+
+2. **Using Custom Control in a Form**:
+   ```html
+   <form [formGroup]="form">
+     <app-custom-input formControlName="customField"></app-custom-input>
+   </form>
+   ```

courses/Angular/Advance-level/Advanced-Forms/Form-Control.md

@@ -0,0 +1,37 @@
+---
+id: lesson-3
+title: "Form Arrays"
+sidebar_label: Async
+sidebar_position: 3
+description: "Form Arrays"
+tags: [courses,Advanced-level,Form Arrays,Introduction]
+---
+ 
+
+Form arrays are used to manage an array of form controls or groups, allowing you to build complex forms.
+
+1. **Creating a Form Array**:
+   ```typescript
+   import { FormArray, FormGroup, FormBuilder } from '@angular/forms';
+
+   this.form = this.fb.group({
+     users: this.fb.array([
+       this.fb.group({ name: '', age: '' }),
+       this.fb.group({ name: '', age: '' })
+     ])
+   });
+   ```
+
+2. **Template for Form Array**:
+   ```html
+   <form [formGroup]="form">
+     <div formArrayName="users">
+       <div *ngFor="let user of form.get('users').controls; let i = index">
+         <div [formGroupName]="i">
+           <input formControlName="name" placeholder="Name"/>
+           <input formControlName="age" placeholder="Age"/>
+         </div>
+       </div>
+     </div>
+   </form>
+   ```

courses/Angular/Advance-level/Advanced-Forms/Form-arrays.md

@@ -0,0 +1,53 @@
+---
+id: lesson-4
+title: "Advanced Form Validation"
+sidebar_label: Form Validation
+sidebar_position: 4
+description: "Advanced Form Validation"
+tags: [courses,Advanced-level,Form Validation,Introduction]
+---
+
+ 
+
+Advanced validation techniques allow you to implement complex validation rules for your forms.
+
+1. **Custom Validators**:
+   ```typescript
+   import { AbstractControl, ValidatorFn } from '@angular/forms';
+
+   export function ageValidator(min: number): ValidatorFn {
+     return (control: AbstractControl): { [key: string]: any } | null => {
+       const valid = control.value >= min;
+       return valid ? null : { 'ageInvalid': { value: control.value } };
+     };
+   }
+   ```
+
+2. **Using Custom Validators**:
+   ```typescript
+   this.form = this.fb.group({
+     age: ['', [Validators.required, ageValidator(18)]]
+   });
+   ```
+
+3. **Asynchronous Validators**:
+   Asynchronous validators are useful for checking values against a remote server.
+   ```typescript
+   import { Observable, of } from 'rxjs';
+   import { delay } from 'rxjs/operators';
+
+   export function usernameValidator(): AsyncValidatorFn {
+     return (control: AbstractControl): Observable<ValidationErrors | null> => {
+       const forbidden = control.value === 'admin';
+       return of(forbidden ? { 'usernameForbidden': { value: control.value } } : null).pipe(delay(1000));
+     };
+   }
+   ```
+
+4. **Using Async Validators**:
+   ```typescript
+   this.form = this.fb.group({
+     username: ['', { validators: [Validators.required], asyncValidators: [usernameValidator()] }]
+   });
+   ```
+ 

courses/Angular/Advance-level/Advanced-Forms/Form-validation.md

@@ -0,0 +1,8 @@
+{
+    "label": "Advanced Forms",
+    "position": 2,
+    "link": {
+      "type": "generated-index",
+      "description": "Learn to Advanced Forms."
+    }
+  }

courses/Angular/Advance-level/Advanced-Forms/_category_.json

@@ -0,0 +1,54 @@
+---
+id: lesson-4
+title: "Custom Route Strategies"
+sidebar_label: Custom Route
+sidebar_position: 4
+description: "Custom Route Strategies"
+tags: [courses,Advanced-level,Custom Route,Introduction]
+---
+
+
+Custom route strategies allow you to implement advanced routing behaviors that suit specific application needs.
+
+1. **Creating a Custom Route Strategy**:
+   ```typescript
+   import { RouteReuseStrategy, DetachedRouteHandle } from '@angular/router';
+
+   export class CustomRouteReuseStrategy implements RouteReuseStrategy {
+     storedRouteHandles: { [key: string]: DetachedRouteHandle } = {};
+
+     shouldDetach(route: ActivatedRouteSnapshot): boolean {
+       return true; // Modify as needed
+     }
+
+     store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
+       this.storedRouteHandles[route.routeConfig.path] = handle;
+     }
+
+     shouldAttach(route: ActivatedRouteSnapshot): boolean {
+       return !!this.storedRouteHandles[route.routeConfig.path];
+     }
+
+     retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
+       return this.storedRouteHandles[route.routeConfig.path];
+     }
+
+     shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
+       return future.routeConfig === curr.routeConfig;
+     }
+   }
+   ```
+
+2. **Providing the Custom Strategy**:
+   Update your `AppModule` to use the custom route strategy.
+
+   ```typescript
+   import { NgModule } from '@angular/core';
+   import { RouterModule, RouteReuseStrategy } from '@angular/router';
+
+   @NgModule({
+     imports: [RouterModule.forRoot(routes)],
+     providers: [{ provide: RouteReuseStrategy, useClass: CustomRouteReuseStrategy }]
+   })
+   export class AppRoutingModule {}
+   ``` 

courses/Angular/Advance-level/Advanced-Routing/Custom-ROute.md

@@ -0,0 +1,34 @@
+---
+id: lesson-3
+title: "Nested Routes"
+sidebar_label: Nested Routes
+sidebar_position: 3
+description: "Nested Routes"
+tags: [courses,Advanced-level,Nested Routes,Introduction]
+---
+ 
+ 
+
+Nested routes allow you to create hierarchical route structures, making your application more organized and maintainable.
+
+1. **Defining Nested Routes**:
+   ```typescript
+   const routes: Routes = [
+     {
+       path: 'products',
+       component: ProductsComponent,
+       children: [
+         { path: '', component: ProductListComponent },
+         { path: ':id', component: ProductDetailComponent }
+       ]
+     }
+   ];
+   ```
+
+2. **Using Router Outlet**:
+   In the `ProductsComponent` template, include a `<router-outlet>` for nested views.
+
+   ```html
+   <h1>Products</h1>
+   <router-outlet></router-outlet>
+   ```

courses/Angular/Advance-level/Advanced-Routing/Nested-Routes.md

@@ -0,0 +1,42 @@
+---
+id: lesson-2
+title: "Route Resolvers"
+sidebar_label: Route Resolvers
+sidebar_position: 2
+description: "Route Resolvers"
+tags: [courses,Advanced-level,Route Resolvers,Introduction]
+---
+ 
+Route resolvers are a powerful way to fetch data before the route loads. This ensures the data is available when the component is initialized.
+
+1. **Using a Resolver**:
+   ```typescript
+   const routes: Routes = [
+     {
+       path: 'dashboard',
+       component: DashboardComponent,
+       resolve: {
+         data: DataResolver
+       }
+     }
+   ];
+   ```
+
+2. **Accessing Resolved Data**:
+   ```typescript
+   import { ActivatedRoute } from '@angular/router';
+
+   @Component({
+     selector: 'app-dashboard',
+     templateUrl: './dashboard.component.html',
+   })
+   export class DashboardComponent {
+     data: any;
+
+     constructor(private route: ActivatedRoute) {
+       this.route.data.subscribe(data => {
+         this.data = data['data'];
+       });
+     }
+   }
+   ```