Ones and Zeros

 Angular - app.routes.ts import { Routes } from '@angular/router' ; import { ProjectComponent } from './components/project/project.component' ; import { EmployeeComponent } from './components/employee/employee.component' ; import { DepartmentComponent } from './components/department/department.component' ; import { DepartmentTeamComponent } from './components/departmentTeam/departmentTeam.component' ; import { TimegridComponent } from './components/timegrid/timegrid.component' ; import { HolidayComponent } from './components/holiday/holiday.component' ; export const routes : Routes = [     { path : '' , component : ProjectComponent },     { path : 'employee' , component : EmployeeComponent },     { path : 'department' , component : DepartmentComponent },     { path : 'departmentTeam' , component : DepartmentTeamComponent },     { path : 'holiday' , comp...

 Angular - app.config.ts import { ApplicationConfig } from '@angular/core' ; import { provideHttpClient } from '@angular/common/http' ; import { provideRouter } from '@angular/router' ; import { routes } from './app.routes' ; import { provideToastr } from 'ngx-toastr' ; import { provideAnimationsAsync } from '@angular/platform-browser/animations/async' ; import { TimeService } from './services/time.service' ; import { ProjectService } from './services/project.service' ; import { EmployeeService } from './services/employee.service' ; import { DepartmentService } from './services/department.service' ; import { DepartmentTeamService } from './services/departmentTeam.service' ; import { HolidayService } from './services/holiday.service' ; import { DatePipe } from '@angular/common' ; export const appConfig : ApplicationConfig = {   providers : ...

 Angular - Service Files import { Injectable } from '@angular/core' ; import { HttpClient } from '@angular/common/http' ; import { Observable } from 'rxjs' ; import { Department } from '../models/department' ; @ Injectable ({     providedIn : 'root' , }) export class DepartmentService {     private apiUrl = 'api/departments' ; // Replace with your API URL     constructor ( private http : HttpClient ) { }     // Get all departments     getDepartments () : Observable < Department []> {         return this . http . get < Department []>( this . apiUrl );     }     // Get a department by ID     getDepartmentById ( id : number ) : Observable < Department > {         return this . http . get < Department >( ` ${this . apiUrl } / ${ id } ` );     }     // Create a new department     createDepa...

  Angular - Model Files department.ts export interface Department {     departmentId ?: number ; // Optional for new ones     name : string }

  Angular - Component Files department.component.css      your local CSS for your custom fields. department.component.html < main class = "main" >     < div class = "content" >       < div class = "left-side" > < div >     <!-- Heading -->     < h1 > Departments </ h1 >     < button (click) = "newDepartment()" class = "btn" > Add New Department </ button >     <!-- Grid -->     < table >         < thead >             < tr >                 < th > ID </ th >                 < th > Name </ th >                 < th > Actions </ th >             </ tr >       ...

  ANGULAR - FILE CHECKLIST For each new component: new folder with 4 files (CSS, HTML, SPEC.TS, TS)  (CSS should be almost empty) models - new model services - new service app.config - add service and import app.routes - add import and route sidebar.component.html - add menu option with routerLink

  Component Within A Component Angular 17, 11/29/204, by Eric Wood Background: We have adopted this pattern of files for components (shown here as Department and Team): The Team screen has been proven to work stand-alone by adding a menu option and clicking to see if the screen runs. We do this to limit the debugging if issues arise. Goal: We want Teams to appear when we click Add or Edit Department: department.component.ts department.component.html departmentTeam.component.ts What Must Match: 1) The parent typescript file - The component name of child component must match the upper import statement and with folder path correct. 2) The parent typescript file - The @component.imports name must match the child component’s name. 3) The parent HTML identifier must match the @component.selector of the child component.

Data Annotations  Required  for anything that is not null: [Required] DataType for anything: [DataType(DataType.Password)] The data types are:                 Custom = 0, // Summary: Represents a custom data type.         DateTime = 1, // Summary: Represents an instant in time, expressed as a date and time of day.         Date = 2,         Time = 3,                 Duration = 4, // Summary: Represents a continuous time during which an object exists.         PhoneNumber = 5,         Currency = 6,         Text = 7,         Html = 8,         MultilineText = 9,         EmailAddress = 10,         Password = 11,         Url = 12,         ImageUrl = 13, ...

 Pagination in APIs Make a PaginationRequest.cs and put this in it: namespace eShop.Catalog.API.Model; public record PaginationRequest(int PageSize = 10, int PageIndex = 0); ------------------------------------ namespace eShop.Catalog.API.Model; public class PaginatedItems<TEntity>(int pageIndex, int pageSize, long count, IEnumerable<TEntity> data) where TEntity : class {     public int PageIndex { get; } = pageIndex;     public int PageSize { get; } = pageSize;     public long Count { get; } = count;     public IEnumerable<TEntity> Data { get;} = data; } ------------------------------------    Pagination only really applies to the GetAll(), GetItemsByName(), or GetAllByType() methods. Not needed on create, delete, update, or GetById().     So in your:   api.MapGet("/items", GetAllItems);    you need to implement GetAllItems() as such: public static async Task<Results<Ok<...