Angular Rebuild #3

2025-07-07T07:07:40Z

FrauJulian commented

2025-07-07 07:07:40 +00:00

(Migrated from github.com)

This pull request introduces several changes across multiple files to improve configuration, remove legacy code, and set up a new Angular project. Below is a summary of the most important changes grouped by theme.

Configuration Updates:

.editorconfig: Added a new editor configuration file to enforce consistent coding standards, including UTF-8 encoding, 2-space indentation, and trimming of trailing whitespace. Specific rules for .ts and .md files were also added.
configs/Production.json: Created a new production configuration file specifying the server port as 3004.

Project Setup:

angular.json: Added configuration for a new Angular project (angular-portfolio-seite) with support for SCSS styles, SSR (server-side rendering), and production/development build configurations. Included Angular Material theme and polyfills.

Removal of Legacy Code:

IMPRINT/index.html: Removed the entire HTML file containing imprint information, including contact details, disclaimers, and copyright statements.
LICENSE.md: Deleted the license agreement file outlining terms of use, limitations, and legal compliance.
Resources/Javascript.js: Removed JavaScript code responsible for dynamic loading of GitHub projects, age calculation, and various UI functionalities.

This pull request introduces several changes across multiple files to improve configuration, remove legacy code, and set up a new Angular project. Below is a summary of the most important changes grouped by theme. ### Configuration Updates: * [`.editorconfig`](diffhunk://#diff-0947e2727d6bad8cd0ac4122f5314bb5b04e337393075bc4b5ef143b17fcbd5bR1-R17): Added a new editor configuration file to enforce consistent coding standards, including UTF-8 encoding, 2-space indentation, and trimming of trailing whitespace. Specific rules for `.ts` and `.md` files were also added. * [`configs/Production.json`](diffhunk://#diff-78c72fb123259c9943b38f263fc4b233c9fce38ea92c4291fb52e9ae31a72048R1-R5): Created a new production configuration file specifying the server port as 3004. ### Project Setup: * [`angular.json`](diffhunk://#diff-2d2675bb4687601a5c7ccf707455132f90f3516a33716185687e5c41df59ac7dR1-R128): Added configuration for a new Angular project (`angular-portfolio-seite`) with support for SCSS styles, SSR (server-side rendering), and production/development build configurations. Included Angular Material theme and polyfills. ### Removal of Legacy Code: * [`IMPRINT/index.html`](diffhunk://#diff-94aaafde6ef361762de8516a47577849a1000d67ea02f50a6f53756c8a6df2c0L1-L122): Removed the entire HTML file containing imprint information, including contact details, disclaimers, and copyright statements. * [`LICENSE.md`](diffhunk://#diff-4673a3aba01813b595de187a7a6e9e63a3491d55821606fecd9f13a10c188a1dL1-L58): Deleted the license agreement file outlining terms of use, limitations, and legal compliance. * [`Resources/Javascript.js`](diffhunk://#diff-7ba15ed3a2e650b319901fdf6b70115e36da8e938c53925a4a53a44fc6edd8beL1-L262): Removed JavaScript code responsible for dynamic loading of GitHub projects, age calculation, and various UI functionalities.

copilot-pull-request-reviewer[bot] (Migrated from github.com) reviewed 2025-07-07 07:10:26 +00:00

copilot-pull-request-reviewer[bot] (Migrated from github.com) left a comment

Pull Request Overview

This PR rebuilds the project as a modern Angular application with server-side rendering, SCSS styles, and removes legacy static assets.

Introduces new TypeScript configs and an Angular CLI setup with SSR and SCSS support
Adds global SCSS styling, an Express server for SSR, and centralizes personal constants
Removes outdated HTML/CSS/JS and license files in favor of Angular components and routing

Reviewed Changes

Copilot reviewed 36 out of 46 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
.editorconfig	Enforces consistent code formatting and trimming rules
tsconfig.app.json & tsconfig.spec.json	Adds base TS configs for application build and tests
angular.json	Configures Angular CLI project with SCSS, SSR, and build targets
src/styles.scss	Defines global SCSS variables and base styles
src/server.ts	Sets up Express server for Angular SSR using ProductionConfig
src/global.fields.ts	Centralizes personal contact and display constants
src/app/home/home.component.ts	Implements HomeComponent logic with GitHub API integration
(Legacy) static assets and license files removed	Deletes old HTML, CSS, JS, and LICENSE files

Comments suppressed due to low confidence (2)

src/global.fields.ts:1

[nitpick] Class names should use PascalCase. Rename globalFields to GlobalFields to match TypeScript conventions.

export class globalFields {

src/app/home/home.component.ts:160

The fillProjects method encompasses multiple API calls and transformations but lacks unit tests. Consider adding tests that mock fetch and verify sorting, filtering, and mapping logic.

  private fillProjects(): void {

## Pull Request Overview This PR rebuilds the project as a modern Angular application with server-side rendering, SCSS styles, and removes legacy static assets. - Introduces new TypeScript configs and an Angular CLI setup with SSR and SCSS support - Adds global SCSS styling, an Express server for SSR, and centralizes personal constants - Removes outdated HTML/CSS/JS and license files in favor of Angular components and routing ### Reviewed Changes Copilot reviewed 36 out of 46 changed files in this pull request and generated 5 comments. <details> <summary>Show a summary per file</summary> | File | Description | | ------------------------------------------------ | ---------------------------------------------------------------- | | .editorconfig | Enforces consistent code formatting and trimming rules | | tsconfig.app.json & tsconfig.spec.json | Adds base TS configs for application build and tests | | angular.json | Configures Angular CLI project with SCSS, SSR, and build targets | | src/styles.scss | Defines global SCSS variables and base styles | | src/server.ts | Sets up Express server for Angular SSR using ProductionConfig | | src/global.fields.ts | Centralizes personal contact and display constants | | src/app/home/home.component.ts | Implements HomeComponent logic with GitHub API integration | | (Legacy) static assets and license files removed | Deletes old HTML, CSS, JS, and LICENSE files | </details> <details> <summary>Comments suppressed due to low confidence (2)</summary> **src/global.fields.ts:1** * [nitpick] Class names should use PascalCase. Rename `globalFields` to `GlobalFields` to match TypeScript conventions. ``` export class globalFields { ``` **src/app/home/home.component.ts:160** * The `fillProjects` method encompasses multiple API calls and transformations but lacks unit tests. Consider adding tests that mock `fetch` and verify sorting, filtering, and mapping logic. ``` private fillProjects(): void { ``` </details>

angular.json

						
				@@ -0,0 +19,4 @@

				          "options": {

				            "outputPath": "dist",

				            "index": "src/index.html",

				            "browser": "src/main.ts",

copilot-pull-request-reviewer[bot] (Migrated from github.com) commented

2025-07-07 07:10:26 +00:00

The build option key should be main, not browser. Update to "main": "src/main.ts" to align with Angular CLI schema.

            "main": "src/main.ts",

The build option key should be `main`, not `browser`. Update to `"main": "src/main.ts"` to align with Angular CLI schema. ```suggestion "main": "src/main.ts", ```

src/app/app.component.spec.ts

						
				@@ -0,0 +26,4 @@

				    fixture.detectChanges();

				    const compiled = fixture.nativeElement as HTMLElement;

				    expect(compiled.querySelector('h1')?.textContent).toContain('Hello, Angular-Portfolio-Seite');

				  });

copilot-pull-request-reviewer[bot] (Migrated from github.com) commented

2025-07-07 07:10:26 +00:00

The AppComponent template only contains <router-outlet>, so querying for an h1 will always fail. Update or remove this assertion to match the actual markup.

  // Removed test case for rendering title as the AppComponent template does not contain an h1 element.

The AppComponent template only contains `<router-outlet>`, so querying for an `h1` will always fail. Update or remove this assertion to match the actual markup. ```suggestion // Removed test case for rendering title as the AppComponent template does not contain an h1 element. ```

src/app/home/home.component.ts

						
				@@ -0,0 +179,4 @@

				      })

				      .then((allProjects: any): void => {

				        allProjects = allProjects.sort(sortOnKey("stargazers_count", true));

				        allProjects.sort(sortOnKey("stargazers_count", true)).forEach((currentProject: any): void => {

copilot-pull-request-reviewer[bot] (Migrated from github.com) commented

2025-07-07 07:10:26 +00:00

You’re sorting allProjects twice in a row. Remove the redundant sort call in the forEach so the array is only sorted once.

        allProjects.forEach((currentProject: any): void => {

You’re sorting `allProjects` twice in a row. Remove the redundant sort call in the `forEach` so the array is only sorted once. ```suggestion allProjects.forEach((currentProject: any): void => { ```

src/global.fields.ts

						
				@@ -0,0 +3,4 @@

				  public static readonly lastname: string = 'Lechner';

				  public static readonly contactMail: string = 'contact@fraujulian.xyz';

				  public static readonly contactPhone: string = '+43 (0) 660 9254001';

				  public static readonly hrefContactPhone: string = 'contact@fraujulian.xyz';

copilot-pull-request-reviewer[bot] (Migrated from github.com) commented

2025-07-07 07:10:25 +00:00

The hrefContactPhone value is set to an email address instead of a phone URI. It should be a phone link (e.g., tel:+436609254001).

  public static readonly hrefContactPhone: string = 'tel:+436609254001';

The `hrefContactPhone` value is set to an email address instead of a phone URI. It should be a phone link (e.g., `tel:+436609254001`). ```suggestion public static readonly hrefContactPhone: string = 'tel:+436609254001'; ```

src/server.ts

						
				@@ -0,0 +34,4 @@

				      providers: [{provide: APP_BASE_HREF, useValue: baseUrl}],

				    })

				    .then((html: string): Response => res.send(html))

				    .catch((err: Error): void => next(err.stack));

copilot-pull-request-reviewer[bot] (Migrated from github.com) commented

2025-07-07 07:10:25 +00:00

Passing err.stack (a string) into next() will lose error context. Instead, pass the original Error object: .catch(err => next(err));

    .catch((err: Error): void => next(err));

Passing `err.stack` (a string) into `next()` will lose error context. Instead, pass the original Error object: `.catch(err => next(err));` ```suggestion .catch((err: Error): void => next(err)); ```

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: fraujulian/Personal-Portfolio-Website#3