diff --git a/apps/frontend-tsef/src/app/app.component.spec.ts b/apps/frontend-tsef/src/app/app.component.spec.ts deleted file mode 100644 index 9723719..0000000 --- a/apps/frontend-tsef/src/app/app.component.spec.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { TestBed } from '@angular/core/testing'; -import { AppComponent } from './app.component'; -import { NxWelcomeComponent } from './nx-welcome.component'; - -describe('AppComponent', () => { - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [AppComponent, NxWelcomeComponent], - }).compileComponents(); - }); - - it('should render title', () => { - const fixture = TestBed.createComponent(AppComponent); - fixture.detectChanges(); - const compiled = fixture.nativeElement as HTMLElement; - expect(compiled.querySelector('h1')?.textContent).toContain('Welcome frontend-tsef'); - }); - - it(`should have as title 'frontend-tsef'`, () => { - const fixture = TestBed.createComponent(AppComponent); - const app = fixture.componentInstance; - expect(app.title).toEqual('frontend-tsef'); - }); -}); diff --git a/apps/frontend-tsef/src/app/app.routes.ts b/apps/frontend-tsef/src/app/app.routes.ts index 24e21b2..18e9d20 100644 --- a/apps/frontend-tsef/src/app/app.routes.ts +++ b/apps/frontend-tsef/src/app/app.routes.ts @@ -1,9 +1,13 @@ import { Route } from '@angular/router'; -import { HomeComponent } from '@forepath/landingpage/frontend'; +import { GettingStartedComponent, HomeComponent } from '@forepath/landingpage/frontend'; export const appRoutes: Route[] = [ { path: '', component: HomeComponent, }, + { + path: 'getting-started', + component: GettingStartedComponent, + }, ]; diff --git a/apps/frontend-tsef/src/i18n/messages.de.xlf b/apps/frontend-tsef/src/i18n/messages.de.xlf index e138a3f..a8a5569 100644 --- a/apps/frontend-tsef/src/i18n/messages.de.xlf +++ b/apps/frontend-tsef/src/i18n/messages.de.xlf @@ -2,6 +2,170 @@ + + Next Steps + Nächste Schritte + + + Ready to go deeper? Explore the documentation, join the community, or reach out for support. + Bereit für mehr? Entdecken Sie die Dokumentation, treten Sie der Community bei oder wenden Sie sich an den Support. + + + Documentation + Dokumentation + + + Read guides, patterns, and reference materials. + Lesen Sie Anleitungen, Patterns und Referenzen. + + + Browse docs + Dokumentation ansehen + + + Community + Community + + + Get help, share ideas, and stay up to date. + Hilfe erhalten, Ideen teilen und auf dem Laufenden bleiben. + + + Join Discord + Discord beitreten + + + Support + Support + + + Need help with onboarding or migration? + Benötigen Sie Hilfe beim Onboarding oder bei der Migration? + + + Contact support + Support kontaktieren + + + Prerequisites + Voraussetzungen + + + Workspace Tour + Workspace-Tour + + + Essential Nx Commands + Wichtige Nx-Befehle + + + Node.js & npm + Node.js & npm + + + Install the latest LTS release for best stability. + Installieren Sie die neueste LTS-Version für maximale Stabilität. + + + Git + Git + + + Version control and project checkout. + Versionsverwaltung und Projekt-Checkout. + + + Nx CLI (optional) + Nx CLI (optional) + + + Global convenience: npm i -g nx + Globaler Komfort: npm i -g nx + + + Docker (optional) + Docker (optional) + + + For containerized local development and CI. + Für containerisierte lokale Entwicklung und CI. + + + apps + apps + + + Application containers (frontend, backend, native, keycloak-theme). + Anwendungshüllen (Frontend, Backend, Native, Keycloak-Theme). + + + libs + libs + + + Domain libraries: feature, data-access, ui, util. + Domänen-Libraries: feature, data-access, ui, util. + + + tools + tools + + + Workspace scripts and custom executors. + Workspace-Skripte und Custom Executors. + + + e2e + e2e + + + End-to-end tests and configuration. + End-to-End-Tests und Konfiguration. + + + Project Graph + Project Graph + + + Visualize dependencies across apps and libraries. + Visualisieren Sie Abhängigkeiten über Apps und Libraries. + + + Affected + Affected + + + Run tasks only where changes matter. + Führen Sie Tasks nur dort aus, wo Änderungen relevant sind. + + + Run Many + Run Many + + + Execute a target across multiple projects. + Führen Sie ein Target über mehrere Projekte aus. + + + The installer scripts set up most tooling automatically. For a smooth onboarding and consistent builds, ensure these fundamentals are available on your machine before you start. + Die Installationsskripte richten die meisten Tools automatisch ein. Für ein reibungsloses Onboarding und konsistente Builds stellen Sie sicher, dass diese Grundlagen auf Ihrem Rechner vorhanden sind, bevor Sie starten. + + + Learn how your workspace is organized so new code lands in the right place every time. Keep applications lean and reusable logic inside libraries for a maintainable monorepo. + Erfahren Sie, wie Ihr Workspace organisiert ist, damit neuer Code jedes Mal am richtigen Ort landet. Halten Sie Anwendungen schlank und platzieren Sie wiederverwendbare Logik in Libraries für ein gut wartbares Monorepo. + + + Your daily toolbox for fast feedback and reproducible results. Leverage Nx’s smart task execution to visualize dependencies, run only what changed, and scale confidently across projects. + Ihr täglicher Werkzeugkasten für schnelles Feedback und reproduzierbare Ergebnisse. Nutzen Sie die intelligente Aufgabenausführung von Nx, um Abhängigkeiten zu visualisieren, nur geänderte Teile auszuführen und sicher über Projekte hinweg zu skalieren. + + + The fastest way to an AI-ready Nx workspace + Der schnellste Weg zu einem KI-bereiten Nx-Workspace + + + Enterprise-grade TypeScript stack with smart Nx workflows, agent-powered tooling, and built-in compliance. + Unternehmensreifer TypeScript-Stack mit smarten Nx-Workflows, agentengestützten Tools und integrierter Compliance. + TSEF vs Alternatives TSEF vs Alternativen @@ -130,10 +294,22 @@ Quick Start Schnellstart + + Learn more about installing, updating and using TSEF in the getting started guide. + Erfahren Sie mehr über Installation, Updates und die Nutzung von TSEF im Getting-Started-Leitfaden. + Create your first TSEF workspace in under 2 minutes. Erstellen Sie Ihren ersten TSEF-Workspace in unter 2 Minuten. + + Install + Installieren + + + Update + Aktualisieren + View on GitHub Auf GitHub ansehen diff --git a/apps/frontend-tsef/src/i18n/messages.xlf b/apps/frontend-tsef/src/i18n/messages.xlf index 509e9f6..ae74e39 100644 --- a/apps/frontend-tsef/src/i18n/messages.xlf +++ b/apps/frontend-tsef/src/i18n/messages.xlf @@ -2,6 +2,344 @@ + + The installer scripts set up most tooling automatically. For a smooth onboarding and consistent builds, ensure these fundamentals are available on your machine before you start. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 6,9 + + + + Prerequisites + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 5,6 + + + + Node.js & npm + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 18,19 + + + + Install the latest LTS release for best stability. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 19,20 + + + + Git + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 27,28 + + + + Version control and project checkout. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 28,29 + + + + Nx CLI (optional) + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 36,37 + + + + Global convenience: npm i -g nx + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 37,38 + + + + Docker (optional) + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 45,46 + + + + For containerized local development and CI. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html + 46,47 + + + + Workspace Tour + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 5,6 + + + + apps + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 17,18 + + + + Application containers (frontend, backend, native, keycloak-theme). + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 18,21 + + + + libs + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 28,29 + + + + Domain libraries: feature, data-access, ui, util. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 29,30 + + + + tools + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 36,37 + + + + Workspace scripts and custom executors. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 37,38 + + + + e2e + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 46,47 + + + + End-to-end tests and configuration. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 47,48 + + + + Essential Nx Commands + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 5,6 + + + + Project Graph + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 15,16 + + + + Visualize dependencies across apps and libraries. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 16,17 + + + + Affected + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 25,26 + + + + Run tasks only where changes matter. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 26,27 + + + + Run Many + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 37,38 + + + + Execute a target across multiple projects. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 38,39 + + + + Next Steps + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 5,6 + + + + Ready to go deeper? Explore the documentation, join the community, or reach out for support. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 6,9 + + + + Documentation + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 13,16 + + + + Read guides, patterns, and reference materials. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 16,17 + + + + Browse docs + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 17,18 + + + + Community + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 21,24 + + + + Get help, share ideas, and stay up to date. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 24,25 + + + + Join Discord + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 25,26 + + + + Support + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 29,32 + + + + Need help with onboarding or migration? + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 32,33 + + + + Contact support + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html + 33,34 + + + + Learn how your workspace is organized so new code lands in the right place every time. Keep applications lean and reusable logic inside libraries for a maintainable monorepo. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html + 6,8 + + + + Your daily toolbox for fast feedback and reproducible results. Leverage Nx’s smart task execution to visualize dependencies, run only what changed, and scale confidently across projects. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html + 5,8 + + + + TSEF is the AI-ready TypeScript Enterprise Framework. Easily build, deploy, and scale modern enterprise applications with best practices, advanced tooling, and AI capabilities out of the box. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.ts + 19 + + + libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts + 39 + + + + TSEF, TypeScript, Enterprise Framework, AI-ready, Angular, web development, scalable, application framework, cloud, modern apps, enterprise solutions, software tools, best practices + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.ts + 23 + + + libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts + 43 + + + + The fastest way to an AI-ready Nx workspace + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html + 6,8 + + + + Enterprise-grade TypeScript stack with smart Nx workflows, agent-powered tooling, and built-in compliance. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html + 9,11 + + + + Install + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html + 18,20 + + + + Create your first TSEF workspace in under 2 minutes. + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html + 21,23 + + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html + 45,47 + + + libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html + 24,26 + + + + Update + + libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html + 42,44 + + TSEF vs Alternatives @@ -205,32 +543,32 @@ 21,23 - - Create your first TSEF workspace in under 2 minutes. + + Learn more about installing, updating and using TSEF in the getting started guide. libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html - 35,37 + 38,40 View on GitHub libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html - 51,54 + 55,58 Join Community libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html - 59,61 + 63,65 Get Support libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html - 63,65 + 67,69 @@ -317,20 +655,6 @@ 73,75 - - TSEF is the AI-ready TypeScript Enterprise Framework. Easily build, deploy, and scale modern enterprise applications with best practices, advanced tooling, and AI capabilities out of the box. - - libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts - 39 - - - - TSEF, TypeScript, Enterprise Framework, AI-ready, Angular, web development, scalable, application framework, cloud, modern apps, enterprise solutions, software tools, best practices - - libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts - 43 - - How It Works @@ -916,7 +1240,7 @@ Documentation libs/domains/landingpage/frontend/ui-components/src/lib/header/header.component.html - 36,37 + 39,40 diff --git a/libs/domains/landingpage/frontend/feature-getting-started/.eslintrc.json b/libs/domains/landingpage/frontend/feature-getting-started/.eslintrc.json new file mode 100644 index 0000000..67206d4 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/.eslintrc.json @@ -0,0 +1,36 @@ +{ + "extends": ["../../../../../.eslintrc.json"], + "ignorePatterns": ["!**/*"], + "overrides": [ + { + "files": ["*.ts"], + "extends": [ + "plugin:@nx/angular", + "plugin:@angular-eslint/template/process-inline-templates" + ], + "rules": { + "@angular-eslint/directive-selector": [ + "error", + { + "type": "attribute", + "prefix": "landingpage", + "style": "camelCase" + } + ], + "@angular-eslint/component-selector": [ + "error", + { + "type": "element", + "prefix": "landingpage", + "style": "kebab-case" + } + ] + } + }, + { + "files": ["*.html"], + "extends": ["plugin:@nx/angular-template"], + "rules": {} + } + ] +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/README.md b/libs/domains/landingpage/frontend/feature-getting-started/README.md new file mode 100644 index 0000000..df6bd10 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/README.md @@ -0,0 +1,7 @@ +# landingpage-frontend-feature-getting-started + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test landingpage-frontend-feature-getting-started` to execute the unit tests. diff --git a/libs/domains/landingpage/frontend/feature-getting-started/jest.config.ts b/libs/domains/landingpage/frontend/feature-getting-started/jest.config.ts new file mode 100644 index 0000000..f0b9b0a --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/jest.config.ts @@ -0,0 +1,21 @@ +export default { + displayName: 'landingpage-frontend-feature-getting-started', + preset: '../../../../../jest.preset.cjs', + setupFilesAfterEnv: ['/src/test-setup.ts'], + coverageDirectory: '../../../../../coverage/libs/domains/landingpage/frontend/feature-getting-started', + transform: { + '^.+\\.(ts|mjs|js|html)$': [ + 'jest-preset-angular', + { + tsconfig: '/tsconfig.spec.json', + stringifyContentPathRegex: '\\.(html|svg)$', + }, + ], + }, + transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'], + snapshotSerializers: [ + 'jest-preset-angular/build/serializers/no-ng-attributes', + 'jest-preset-angular/build/serializers/ng-snapshot', + 'jest-preset-angular/build/serializers/html-comment', + ], +}; diff --git a/libs/domains/landingpage/frontend/feature-getting-started/project.json b/libs/domains/landingpage/frontend/feature-getting-started/project.json new file mode 100644 index 0000000..459b5b9 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/project.json @@ -0,0 +1,21 @@ +{ + "name": "landingpage-frontend-feature-getting-started", + "$schema": "../../../../../node_modules/nx/schemas/project-schema.json", + "sourceRoot": "libs/domains/landingpage/frontend/feature-getting-started/src", + "prefix": "landingpage", + "projectType": "library", + "tags": ["domain:landingpage", "scope:frontend", "type:feature"], + "targets": { + "test": { + "executor": "@nx/jest:jest", + "outputs": ["{workspaceRoot}/coverage/{projectRoot}"], + "options": { + "jestConfig": "libs/domains/landingpage/frontend/feature-getting-started/jest.config.ts", + "tsConfig": "libs/domains/landingpage/frontend/feature-getting-started/tsconfig.spec.json" + } + }, + "lint": { + "executor": "@nx/eslint:lint" + } + } +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/index.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/index.ts new file mode 100644 index 0000000..229f44e --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/index.ts @@ -0,0 +1 @@ +export * from './lib/page/getting-started.component'; diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/assets/background-section-light.svg b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/assets/background-section-light.svg new file mode 100644 index 0000000..2af6a98 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/assets/background-section-light.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html new file mode 100644 index 0000000..bc19507 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.html @@ -0,0 +1,55 @@ +
+
+
+
+

Essential Nx Commands

+

+ Your daily toolbox for fast feedback and reproducible results. Leverage Nx’s + smart task execution to visualize dependencies, run only what changed, and + scale confidently across projects. +

+
+
+ +
+
+
+
+ +
Project Graph
+

Visualize dependencies across apps and libraries.

+
+ npx nx graph +
+
+
+
+
+
+
+ +
Affected
+

Run tasks only where changes matter.

+
+ npx nx affected -t build,test,lint +
+
+
+
+
+
+
+ +
Run Many
+

Execute a target across multiple projects.

+
+ npx nx run-many -t test -p PROJECT_NAME +
+
+
+
+
+
+
diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.scss b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.scss new file mode 100644 index 0000000..a8441c6 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.scss @@ -0,0 +1,37 @@ +.essential-commands { + background-color: var(--bs-white); + overflow: hidden; + position: relative; + + &::before { + content: ''; + position: absolute; + bottom: 48px; + left: 48px; + aspect-ratio: 1 / 1; + height: 50%; + background-image: url('assets/background-section-light.svg'); + background-position: right bottom; + background-size: contain; + background-repeat: no-repeat; + background-blend-mode: multiply; + z-index: 1; + + @media (max-width: 991px) { + display: none; + } + + @media (max-width: 1799px) { + opacity: 0.5; + } + } + + > * { + position: relative; + z-index: 2; + } +} + +.card { + background-color: #fafafc; +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.ts new file mode 100644 index 0000000..ef7c6ae --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/essential-commands/essential-commands.component.ts @@ -0,0 +1,11 @@ +import { CommonModule } from '@angular/common'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'landingpage-essential-commands', + standalone: true, + imports: [CommonModule], + templateUrl: './essential-commands.component.html', + styleUrls: ['./essential-commands.component.scss'], +}) +export class EssentialCommandsComponent {} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.html b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.html new file mode 100644 index 0000000..c2f2311 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.html @@ -0,0 +1,5 @@ + + + + + diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.ts new file mode 100644 index 0000000..c6f77a8 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/getting-started.component.ts @@ -0,0 +1,37 @@ +import { Component, inject } from '@angular/core'; +import { Meta, Title } from '@angular/platform-browser'; +import { EssentialCommandsComponent } from './essential-commands/essential-commands.component'; +import { HeroComponent } from './hero/hero.component'; +import { NextStepsComponent } from './next-steps/next-steps.component'; +import { PrerequisitesComponent } from './prerequisites/prerequisites.component'; +import { WorkspaceTourComponent } from './workspace-tour/workspace-tour.component'; + +@Component({ + selector: 'landingpage-frontend-feature-getting-started', + imports: [ + HeroComponent, + PrerequisitesComponent, + WorkspaceTourComponent, + EssentialCommandsComponent, + NextStepsComponent, + ], + templateUrl: './getting-started.component.html', +}) +export class GettingStartedComponent { + titleService = inject(Title); + metaService = inject(Meta); + + constructor() { + this.titleService.setTitle('The AI-ready TypeScript Enterprise Framework | TSEF'); + this.metaService.addTags([ + { + name: 'description', + content: $localize`:@@homeMetaDescription:TSEF is the AI-ready TypeScript Enterprise Framework. Easily build, deploy, and scale modern enterprise applications with best practices, advanced tooling, and AI capabilities out of the box.`, + }, + { + name: 'keywords', + content: $localize`:@@homeMetaKeywords:TSEF, TypeScript, Enterprise Framework, AI-ready, Angular, web development, scalable, application framework, cloud, modern apps, enterprise solutions, software tools, best practices`, + }, + ]); + } +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/assets/background-hero.svg b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/assets/background-hero.svg new file mode 100644 index 0000000..ae2057a --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/assets/background-hero.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html new file mode 100644 index 0000000..783757d --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.html @@ -0,0 +1,60 @@ +
+
+
+
+

+ The fastest way to an AI-ready Nx workspace +

+

+ Enterprise-grade TypeScript stack with smart Nx workflows, agent-powered + tooling, and built-in compliance. +

+
+
+
+
+
+ + Install +
+

+ Create your first TSEF workspace in under 2 minutes. +

+
+ + /bin/bash -c "$(curl -fsSL + https://raw.githubusercontent.com/forepath/tsef/refs/heads/main/install.sh)" + +
+
+ + npx nx g @forepath/devkit:frontend my-app + +
+
+
+
+
+
+
+
+ + Update +
+

+ Update your TSEF workspace to the latest version. +

+
+ + /bin/bash -c "$(curl -fsSL + https://raw.githubusercontent.com/forepath/tsef/refs/heads/main/update.sh)" + +
+
+
+
+
+
+
+
+
diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.scss b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.scss new file mode 100644 index 0000000..77b2589 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.scss @@ -0,0 +1,29 @@ +.hero { + overflow: hidden; + position: relative; + + &::before { + content: ''; + position: absolute; + bottom: 48px; + right: -64px; + aspect-ratio: 1 / 1; + height: calc(100% - 48px); + background-image: url('assets/background-hero.svg'); + background-position: right bottom; + background-size: contain; + background-repeat: no-repeat; + background-blend-mode: multiply; + z-index: -1; + mix-blend-mode: color-burn; + opacity: 0.25; + + @media (max-width: 991px) { + display: none; + } + + @media (max-width: 1799px) { + opacity: 0.125; + } + } +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.ts new file mode 100644 index 0000000..62a101f --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/hero/hero.component.ts @@ -0,0 +1,11 @@ +import { CommonModule } from '@angular/common'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'landingpage-hero', + standalone: true, + imports: [CommonModule], + templateUrl: './hero.component.html', + styleUrls: ['./hero.component.scss'], +}) +export class HeroComponent {} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/assets/background-section-dark.svg b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/assets/background-section-dark.svg new file mode 100644 index 0000000..8424609 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/assets/background-section-dark.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html new file mode 100644 index 0000000..30b66ba --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.html @@ -0,0 +1,60 @@ +
+
+
+
+

Next Steps

+

+ Ready to go deeper? Explore the documentation, join the + community, or reach out for support. +

+
+
+ +
+
+
+
+ +
Documentation
+

Read guides, patterns, and reference materials.

+ Browse docs +
+
+
+
+
+
+ +
Community
+

Get help, share ideas, and stay up to date.

+ Join Discord +
+
+
+
+
+
+ +
Support
+

Need help with onboarding or migration?

+ Contact support +
+
+
+
+
+
diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.scss b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.scss new file mode 100644 index 0000000..565b4a1 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.scss @@ -0,0 +1,35 @@ +.next-steps { + background-color: #f8f9fa; + overflow: hidden; + position: relative; + + &::before { + content: ''; + position: absolute; + bottom: 48px; + right: 48px; + aspect-ratio: 1 / 1; + height: 50%; + background-image: url('assets/background-section-dark.svg'); + background-position: right bottom; + background-size: contain; + background-repeat: no-repeat; + background-blend-mode: multiply; + z-index: 1; + mix-blend-mode: color-burn; + opacity: 0.25; + + @media (max-width: 991px) { + display: none; + } + + @media (max-width: 1799px) { + opacity: 0.125; + } + } + + > * { + position: relative; + z-index: 2; + } +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.ts new file mode 100644 index 0000000..4b260b5 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/next-steps/next-steps.component.ts @@ -0,0 +1,12 @@ +import { CommonModule } from '@angular/common'; +import { Component } from '@angular/core'; +import { RouterModule } from '@angular/router'; + +@Component({ + selector: 'landingpage-next-steps', + standalone: true, + imports: [CommonModule, RouterModule], + templateUrl: './next-steps.component.html', + styleUrls: ['./next-steps.component.scss'], +}) +export class NextStepsComponent {} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/assets/background-section-light.svg b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/assets/background-section-light.svg new file mode 100644 index 0000000..2af6a98 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/assets/background-section-light.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html new file mode 100644 index 0000000..a79244a --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.html @@ -0,0 +1,53 @@ +
+
+
+
+

Prerequisites

+

+ The installer scripts set up most tooling automatically. For a + smooth onboarding and consistent builds, ensure these fundamentals are + available on your machine before you start. +

+
+
+ +
+
+
+
+ +
Node.js & npm
+

Install the latest LTS release for best stability.

+
+
+
+
+
+
+ +
Git
+

Version control and project checkout.

+
+
+
+
+
+
+ +
Nx CLI (optional)
+

Global convenience: npm i -g nx

+
+
+
+
+
+
+ +
Docker (optional)
+

For containerized local development and CI.

+
+
+
+
+
+
diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.scss b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.scss new file mode 100644 index 0000000..fdc5193 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.scss @@ -0,0 +1,37 @@ +.prerequisites { + background-color: var(--bs-white); + overflow: hidden; + position: relative; + + &::before { + content: ''; + position: absolute; + bottom: 48px; + left: 48px; + aspect-ratio: 1 / 1; + height: 50%; + background-image: url('assets/background-section-light.svg'); + background-position: right bottom; + background-size: contain; + background-repeat: no-repeat; + background-blend-mode: multiply; + z-index: 1; + + @media (max-width: 991px) { + display: none; + } + + @media (max-width: 1799px) { + opacity: 0.5; + } + } + + > * { + position: relative; + z-index: 2; + } +} + +.card { + background-color: #fafafc; +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.ts new file mode 100644 index 0000000..87e7dc6 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/prerequisites/prerequisites.component.ts @@ -0,0 +1,11 @@ +import { CommonModule } from '@angular/common'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'landingpage-prerequisites', + standalone: true, + imports: [CommonModule], + templateUrl: './prerequisites.component.html', + styleUrls: ['./prerequisites.component.scss'], +}) +export class PrerequisitesComponent {} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/assets/background-section-dark.svg b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/assets/background-section-dark.svg new file mode 100644 index 0000000..8424609 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/assets/background-section-dark.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html new file mode 100644 index 0000000..1358417 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.html @@ -0,0 +1,55 @@ +
+
+
+
+

Workspace Tour

+

+ Learn how your workspace is organized so new code lands in the + right place every time. Keep applications lean and reusable logic inside + libraries for a maintainable monorepo. +

+
+
+ +
+
+
+
+ +
apps
+

+ Application containers (frontend, backend, native, keycloak-theme). +

+
+
+
+
+
+
+ +
libs
+

Domain libraries: feature, data-access, ui, util.

+
+
+
+
+
+
+ +
tools
+

Workspace scripts and custom executors.

+
+
+
+
+
+
+ +
e2e
+

End-to-end tests and configuration.

+
+
+
+
+
+
diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.scss b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.scss new file mode 100644 index 0000000..057511e --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.scss @@ -0,0 +1,35 @@ +.workspace-tour { + background-color: #f8f9fa; + overflow: hidden; + position: relative; + + &::before { + content: ''; + position: absolute; + bottom: 48px; + right: 48px; + aspect-ratio: 1 / 1; + height: 50%; + background-image: url('assets/background-section-dark.svg'); + background-position: right bottom; + background-size: contain; + background-repeat: no-repeat; + background-blend-mode: multiply; + z-index: 1; + mix-blend-mode: color-burn; + opacity: 0.25; + + @media (max-width: 991px) { + display: none; + } + + @media (max-width: 1799px) { + opacity: 0.125; + } + } + + > * { + position: relative; + z-index: 2; + } +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.ts new file mode 100644 index 0000000..bcb5607 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/lib/page/workspace-tour/workspace-tour.component.ts @@ -0,0 +1,11 @@ +import { CommonModule } from '@angular/common'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'landingpage-workspace-tour', + standalone: true, + imports: [CommonModule], + templateUrl: './workspace-tour.component.html', + styleUrls: ['./workspace-tour.component.scss'], +}) +export class WorkspaceTourComponent {} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/src/test-setup.ts b/libs/domains/landingpage/frontend/feature-getting-started/src/test-setup.ts new file mode 100644 index 0000000..58c511e --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/src/test-setup.ts @@ -0,0 +1,3 @@ +import { setupZoneTestEnv } from 'jest-preset-angular/setup-env/zone'; + +setupZoneTestEnv(); diff --git a/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.json b/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.json new file mode 100644 index 0000000..e0fd313 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.json @@ -0,0 +1,21 @@ +{ + "extends": "../../../../../tsconfig.base.json", + "compilerOptions": { + "target": "es2022", + "moduleResolution": "bundler", + "module": "es2022" + }, + "angularCompilerOptions": { + "enableI18nLegacyMessageIdFormat": false + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + }, + { + "path": "./tsconfig.spec.json" + } + ] +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.lib.json b/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.lib.json new file mode 100644 index 0000000..8200876 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.lib.json @@ -0,0 +1,17 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../../../../dist/out-tsc", + "declaration": true, + "declarationMap": true, + "inlineSources": true, + "types": ["@angular/localize"] + }, + "exclude": [ + "src/**/*.spec.ts", + "src/test-setup.ts", + "jest.config.ts", + "src/**/*.test.ts" + ], + "include": ["src/**/*.ts"] +} diff --git a/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.spec.json b/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.spec.json new file mode 100644 index 0000000..f99f588 --- /dev/null +++ b/libs/domains/landingpage/frontend/feature-getting-started/tsconfig.spec.json @@ -0,0 +1,17 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../../../../dist/out-tsc", + "module": "commonjs", + "target": "es2016", + "types": ["jest", "node"], + "moduleResolution": "node10" + }, + "files": ["src/test-setup.ts"], + "include": [ + "jest.config.ts", + "src/**/*.test.ts", + "src/**/*.spec.ts", + "src/**/*.d.ts" + ] +} diff --git a/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html b/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html index 970fb82..7d9df1c 100644 --- a/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html +++ b/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.html @@ -20,6 +20,9 @@
Quick Start
+

+ Create your first TSEF workspace in under 2 minutes. +

/bin/bash -c "$(curl -fsSL @@ -31,8 +34,9 @@
npx nx g @forepath/devkit:frontend my-app
-

- Create your first TSEF workspace in under 2 minutes. +

+ Learn more about installing, updating and using TSEF in the + getting started guide.

diff --git a/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.ts b/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.ts index a0a0c0b..f5c88be 100644 --- a/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.ts +++ b/libs/domains/landingpage/frontend/feature-home/src/lib/page/get-started/get-started.component.ts @@ -1,10 +1,11 @@ import { CommonModule } from '@angular/common'; import { Component } from '@angular/core'; +import { RouterLink } from '@angular/router'; @Component({ selector: 'landingpage-get-started', standalone: true, - imports: [CommonModule], + imports: [CommonModule, RouterLink], templateUrl: './get-started.component.html', styleUrls: ['./get-started.component.scss'], }) diff --git a/libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts b/libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts index 07e6132..07e6ab6 100644 --- a/libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts +++ b/libs/domains/landingpage/frontend/feature-home/src/lib/page/home.component.ts @@ -12,7 +12,7 @@ import { WhoBenefitsComponent } from './who-benefits/who-benefits.component'; import { WhyTsefComponent } from './why-tsef/why-tsef.component'; @Component({ - selector: 'landingpage-landingpage-frontend-feature-home', + selector: 'landingpage-frontend-feature-home', imports: [ ComparisonComponent, HowItWorksComponent, diff --git a/libs/domains/landingpage/frontend/index.ts b/libs/domains/landingpage/frontend/index.ts index 7c01a85..44a1cdb 100644 --- a/libs/domains/landingpage/frontend/index.ts +++ b/libs/domains/landingpage/frontend/index.ts @@ -1,3 +1,4 @@ // landingpage domain frontend exports export * from './ui-components/src'; export * from './feature-home/src'; +export * from './feature-getting-started/src'; diff --git a/libs/domains/landingpage/frontend/ui-components/src/lib/header/header.component.html b/libs/domains/landingpage/frontend/ui-components/src/lib/header/header.component.html index 37d819b..4bf3f3e 100644 --- a/libs/domains/landingpage/frontend/ui-components/src/lib/header/header.component.html +++ b/libs/domains/landingpage/frontend/ui-components/src/lib/header/header.component.html @@ -27,6 +27,9 @@ class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start gap-5 w-100" >