poc model

src/app/app-module.ts

@@ -3,10 +3,14 @@ import { BrowserModule } from '@angular/platform-browser';
 
 import { AppRoutingModule } from './app-routing-module';
 import { App } from './app';
+import { PocModelComponent } from './poc-model-component/poc-model-component';
+import { HomeComponent } from './home-component/home-component';
 
 @NgModule({
   declarations: [
-    App
+    App,
+    PocModelComponent,
+    HomeComponent
   ],
   imports: [
     BrowserModule,

src/app/app-routing-module.ts

@@ -1,10 +1,16 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
+import { PocModelComponent } from './poc-model-component/poc-model-component';
+import { HomeComponent } from './home-component/home-component';
 
-const routes: Routes = [];
+const routes: Routes = [
+  { path: '', component: HomeComponent, pathMatch: 'full' },
+  { path: 'poc-model', component: PocModelComponent },
+  { path: '**', component: HomeComponent },
+];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],
-  exports: [RouterModule]
+  exports: [RouterModule],
 })
-export class AppRoutingModule { }
+export class AppRoutingModule {}

src/app/app.html

@@ -1,10 +1 @@
-<div class="flex h-screen">
-  <div class="m-auto">
-    <h1 class="text-6xl font-bold">InfiniMotion</h1>
-    <h2 class="text-4xl font-bold bg-gradient-to-r from-indigo-500 to-pink-600 bg-clip-text text-transparent pb-10">
-      Absolut war gestern, Bewegung ist heute!
-    </h2>
-  </div>
-</div>
-
 <router-outlet />

src/app/app.ts

@@ -4,7 +4,7 @@ import { Component, signal } from '@angular/core';
   selector: 'app-root',
   templateUrl: './app.html',
   standalone: false,
-  styleUrl: './app.css'
+  styleUrl: './app.css',
 })
 export class App {
   protected readonly title = signal('infinifront');

src/app/home-component/home-component.html

@@ -0,0 +1,10 @@
+<div class="flex h-screen">
+  <div class="m-auto">
+    <h1 class="text-6xl font-bold">InfiniMotion</h1>
+    <h2
+      class="text-4xl font-bold bg-gradient-to-r from-indigo-500 to-pink-600 bg-clip-text text-transparent pb-10"
+    >
+      Absolut war gestern, Bewegung ist heute!
+    </h2>
+  </div>
+</div>

src/app/home-component/home-component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HomeComponent } from './home-component';
+
+describe('HomeComponent', () => {
+  let component: HomeComponent;
+  let fixture: ComponentFixture<HomeComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [HomeComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(HomeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/home-component/home-component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-home-component',
+  standalone: false,
+  templateUrl: './home-component.html',
+  styleUrl: './home-component.css'
+})
+export class HomeComponent {
+
+}

src/app/poc-model-component/poc-model-component.html

@@ -0,0 +1,3 @@
+<p>Diese Komponente später löschen, nur ein Proof Of Concept für die Modellverwendung!</p>
+<p>{{ ticket.id }}</p>
+<p>{{ ticket.code }}</p>

src/app/poc-model-component/poc-model-component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PocModelComponent } from './poc-model-component';
+
+describe('PocModelComponent', () => {
+  let component: PocModelComponent;
+  let fixture: ComponentFixture<PocModelComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [PocModelComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(PocModelComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/poc-model-component/poc-model-component.ts

@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+import { Eintrittskarte } from '@InfiniMotion/model-frontend';
+
+@Component({
+  selector: 'app-poc-model-component',
+  standalone: false,
+  templateUrl: './poc-model-component.html',
+  styleUrl: './poc-model-component.css',
+})
+export class PocModelComponent {
+  ticket: Eintrittskarte = {
+    id: 12345,
+    code: 'ABCDEF',
+  };
+}