@@ -182,7 +182,7 @@ function addServerRoutes(options: AppShellOptions): Rule {
 .filter((node) => node.kind === ts.SyntaxKind.ImportDeclaration)
 .sort((a, b) => a.getStart() - b.getStart());
 const insertPosition = imports[imports.length - 1].getEnd();
-const routeText = `\n\nconst routes: Routes = [ { path: '${APP_SHELL_ROUTE}', component: AppShellComponent }];`;
+const routeText = `\n\nconst routes: Routes = [ { path: '${APP_SHELL_ROUTE}', component: AppShell }];`;
 recorder.insertRight(insertPosition, routeText);
 host.commitUpdate(recorder);
 }
@@ -262,20 +262,15 @@ function addStandaloneServerRoute(options: AppShellOptions): Rule {
 multi: true,
 useValue: [{
 path: '${APP_SHELL_ROUTE}',
-component: AppShellComponent
+component: AppShell
 }]
 }\n `,
 ];
 
 recorder.insertRight(providersLiteral.getStart(), `[\n${updatedProvidersString.join(',\n')}]`);
 
 applyToUpdateRecorder(recorder, [
-insertImport(
-configSourceFile,
-configFilePath,
-'AppShellComponent',
-'./app-shell/app-shell.component',
-),
+insertImport(configSourceFile, configFilePath, 'AppShell', './app-shell/app-shell'),
 ]);
 host.commitUpdate(recorder);
 };
@@ -315,16 +310,11 @@ function addServerRoutingConfig(options: AppShellOptions, isStandalone: boolean)
 }
 
 recorder = host.beginUpdate(configFilePath);
-recorder.insertLeft(functionCall.end - 1, `, withAppShell(AppShellComponent)`);
+recorder.insertLeft(functionCall.end - 1, `, withAppShell(AppShell)`);
 
 applyToUpdateRecorder(recorder, [
 insertImport(configSourceFile, configFilePath, 'withAppShell', '@angular/ssr'),
-insertImport(
-configSourceFile,
-configFilePath,
-'AppShellComponent',
-'./app-shell/app-shell.component',
-),
+insertImport(configSourceFile, configFilePath, 'AppShell', './app-shell/app-shell'),
 ]);
 
 host.commitUpdate(recorder);

@@ -82,14 +82,14 @@ describe('App Shell Schematic', () => {
 it('should work if server config was added prior to running the app-shell schematic', async () => {
 let tree = await schematicRunner.runSchematic('server', defaultOptions, appTree);
 tree = await schematicRunner.runSchematic('app-shell', defaultOptions, tree);
-expect(tree.exists('/projects/bar/src/app/app-shell/app-shell.component.ts')).toBe(true);
+expect(tree.exists('/projects/bar/src/app/app-shell/app-shell.ts')).toBe(true);
 });
 
 it('should create the shell component', async () => {
 const tree = await schematicRunner.runSchematic('app-shell', defaultOptions, appTree);
-expect(tree.exists('/projects/bar/src/app/app-shell/app-shell.component.ts')).toBe(true);
+expect(tree.exists('/projects/bar/src/app/app-shell/app-shell.ts')).toBe(true);
 const content = tree.readContent('/projects/bar/src/app/app.module.server.ts');
-expect(content).toMatch(/app-shell\.component/);
+expect(content).toMatch(/app-shell/);
 });
 });
 
@@ -117,27 +117,25 @@ describe('App Shell Schematic', () => {
 
 it('should create the shell component', async () => {
 const tree = await schematicRunner.runSchematic('app-shell', defaultOptions, appTree);
-expect(tree.exists('/projects/bar/src/app/app-shell/app-shell.component.ts')).toBe(true);
+expect(tree.exists('/projects/bar/src/app/app-shell/app-shell.ts')).toBe(true);
 const content = tree.readContent('/projects/bar/src/app/app.config.server.ts');
 
-expect(content).toMatch(/app-shell\.component/);
+expect(content).toMatch(/app-shell/);
 });
 
 it(`should update the 'provideServerRouting' call to include 'withAppShell'`, async () => {
 const tree = await schematicRunner.runSchematic('app-shell', defaultOptions, appTree);
 const content = tree.readContent('/projects/bar/src/app/app.config.server.ts');
 expect(tags.oneLine`${content}`).toContain(
-tags.oneLine`provideServerRouting(serverRoutes, withAppShell(AppShellComponent))`,
+tags.oneLine`provideServerRouting(serverRoutes, withAppShell(AppShell))`,
 );
 });
 
-it(`should add import to 'AppShellComponent'`, async () => {
+it(`should add import to 'AppShell'`, async () => {
 const tree = await schematicRunner.runSchematic('app-shell', defaultOptions, appTree);
 const filePath = '/projects/bar/src/app/app.config.server.ts';
 const content = tree.readContent(filePath);
-expect(content).toContain(
-`import { AppShellComponent } from './app-shell/app-shell.component';`,
-);
+expect(content).toContain(`import { AppShell } from './app-shell/app-shell';`);
 });
 });
 });

@@ -2,17 +2,17 @@ import { NgModule<% if(experimentalZoneless) { %>, provideExperimentalZonelessCh
 import { BrowserModule } from '@angular/platform-browser';
 <% if (routing) { %>
 import { AppRoutingModule } from './app-routing.module';<% } %>
-import { AppComponent } from './app.component';
+import { App } from './app';
 
 @NgModule({
 declarations: [
-AppComponent
+App
 ],
 imports: [
 BrowserModule<% if (routing) { %>,
 AppRoutingModule<% } %>
 ],
 providers: [<% if (experimentalZoneless) { %>provideExperimentalZonelessChangeDetection()<% } %>],
-bootstrap: [AppComponent]
+bootstrap: [App]
 })
 export class AppModule { }

@@ -1,35 +1,35 @@
 <% if(experimentalZoneless) { %>import { provideExperimentalZonelessChangeDetection } from '@angular/core';
 <% } %>import { TestBed } from '@angular/core/testing';<% if (routing) { %>
 import { RouterModule } from '@angular/router';<% } %>
-import { AppComponent } from './app.component';
+import { App } from './app';
 
-describe('AppComponent', () => {
+describe('App', () => {
 beforeEach(async () => {
 await TestBed.configureTestingModule({<% if (routing) { %>
 imports: [
 RouterModule.forRoot([])
 ],<% } %>
 declarations: [
-AppComponent
+App
 ],<% if(experimentalZoneless) { %>
 providers: [provideExperimentalZonelessChangeDetection()]<% } %>
 }).compileComponents();
 });
 
 it('should create the app', () => {
-const fixture = TestBed.createComponent(AppComponent);
+const fixture = TestBed.createComponent(App);
 const app = fixture.componentInstance;
 expect(app).toBeTruthy();
 });
 
 it(`should have as title '<%= name %>'`, () => {
-const fixture = TestBed.createComponent(AppComponent);
+const fixture = TestBed.createComponent(App);
 const app = fixture.componentInstance;
 expect(app.title).toEqual('<%= name %>');
 });
 
 it('should render title', () => {
-const fixture = TestBed.createComponent(AppComponent);
+const fixture = TestBed.createComponent(App);
 fixture.detectChanges();
 const compiled = fixture.nativeElement as HTMLElement;
 expect(compiled.querySelector('h1')?.textContent).toContain('Hello, <%= name %>');

@@ -9,11 +9,11 @@ import { Component } from '@angular/core';
 %><router-outlet /><%
 } %>
 `,<% } else { %>
-templateUrl: './app.component.ng.html',<% } %>
+templateUrl: './app.ng.html',<% } %>
 standalone: false,<% if(inlineStyle) { %>
 styles: []<% } else { %>
-styleUrl: './app.component.<%= style %>'<% } %>
+styleUrl: './app.<%= style %>'<% } %>
 })
-export class AppComponent {
+export class App {
 title = '<%= name %>';
 }

@@ -1,29 +1,29 @@
 <% if(experimentalZoneless) { %>import { provideExperimentalZonelessChangeDetection } from '@angular/core';
 <% } %>import { TestBed } from '@angular/core/testing';
-import { AppComponent } from './app.component';
+import { App } from './app';
 
-describe('AppComponent', () => {
+describe('App', () => {
 beforeEach(async () => {
 await TestBed.configureTestingModule({
-imports: [AppComponent],<% if(experimentalZoneless) { %>
+imports: [App],<% if(experimentalZoneless) { %>
 providers: [provideExperimentalZonelessChangeDetection()]<% } %>
 }).compileComponents();
 });
 
 it('should create the app', () => {
-const fixture = TestBed.createComponent(AppComponent);
+const fixture = TestBed.createComponent(App);
 const app = fixture.componentInstance;
 expect(app).toBeTruthy();
 });
 
 it(`should have the '<%= name %>' title`, () => {
-const fixture = TestBed.createComponent(AppComponent);
+const fixture = TestBed.createComponent(App);
 const app = fixture.componentInstance;
 expect(app.title).toEqual('<%= name %>');
 });
 
 it('should render title', () => {
-const fixture = TestBed.createComponent(AppComponent);
+const fixture = TestBed.createComponent(App);
 fixture.detectChanges();
 const compiled = fixture.nativeElement as HTMLElement;
 expect(compiled.querySelector('h1')?.textContent).toContain('Hello, <%= name %>');

@@ -11,10 +11,10 @@ import { RouterOutlet } from '@angular/router';<% } %>
 %><router-outlet /><%
 } %>
 `,<% } else { %>
-templateUrl: './app.component.ng.html',<% } if(inlineStyle) { %>
+templateUrl: './app.ng.html',<% } if(inlineStyle) { %>
 styles: [],<% } else { %>
-styleUrl: './app.component.<%= style %>'<% } %>
+styleUrl: './app.<%= style %>'<% } %>
 })
-export class AppComponent {
+export class App {
 title = '<%= name %>';
 }

@@ -1,6 +1,6 @@
 import { bootstrapApplication } from '@angular/platform-browser';
 import { appConfig } from './app/app.config';
-import { AppComponent } from './app/app.component';
+import { App } from './app/app';
 
-bootstrapApplication(AppComponent, appConfig)
+bootstrapApplication(App, appConfig)
 .catch((err) => console.error(err));

@@ -55,10 +55,10 @@ describe('Application Schematic', () => {
 '/projects/foo/src/main.ts',
 '/projects/foo/src/styles.css',
 '/projects/foo/src/app/app.module.ts',
-'/projects/foo/src/app/app.component.css',
-'/projects/foo/src/app/app.component.ng.html',
-'/projects/foo/src/app/app.component.spec.ts',
-'/projects/foo/src/app/app.component.ts',
+'/projects/foo/src/app/app.css',
+'/projects/foo/src/app/app.ng.html',
+'/projects/foo/src/app/app.spec.ts',
+'/projects/foo/src/app/app.ts',
 ]),
 );
 });
@@ -265,10 +265,10 @@ describe('Application Schematic', () => {
 '/src/index.html',
 '/src/main.ts',
 '/src/styles.css',
-'/src/app/app.component.css',
-'/src/app/app.component.ng.html',
-'/src/app/app.component.spec.ts',
-'/src/app/app.component.ts',
+'/src/app/app.css',
+'/src/app/app.ng.html',
+'/src/app/app.spec.ts',
+'/src/app/app.ts',
 ]),
 );
 });
@@ -446,9 +446,9 @@ describe('Application Schematic', () => {
 const files = tree.files;
 [
 '/projects/foo/tsconfig.spec.json',
-'/projects/foo/src/app/app.component.css',
-'/projects/foo/src/app/app.component.ng.html',
-'/projects/foo/src/app/app.component.spec.ts',
+'/projects/foo/src/app/app.css',
+'/projects/foo/src/app/app.ng.html',
+'/projects/foo/src/app/app.spec.ts',
 ].forEach((x) => expect(files).not.toContain(x));
 
 expect(files).toEqual(
@@ -458,7 +458,7 @@ describe('Application Schematic', () => {
 '/projects/foo/src/index.html',
 '/projects/foo/src/main.ts',
 '/projects/foo/src/styles.css',
-'/projects/foo/src/app/app.component.ts',
+'/projects/foo/src/app/app.ts',
 ]),
 );
 });
@@ -472,8 +472,8 @@ describe('Application Schematic', () => {
 '/projects/foo/tsconfig.spec.json',
 '/projects/foo/karma.conf.js',
 '/projects/foo/src/test.ts',
-'/projects/foo/src/app/app.component.ng.html',
-'/projects/foo/src/app/app.component.spec.ts',
+'/projects/foo/src/app/app.ng.html',
+'/projects/foo/src/app/app.spec.ts',
 ].forEach((x) => expect(files).not.toContain(x));
 
 expect(files).toEqual(
@@ -483,8 +483,8 @@ describe('Application Schematic', () => {
 '/projects/foo/src/index.html',
 '/projects/foo/src/main.ts',
 '/projects/foo/src/styles.css',
-'/projects/foo/src/app/app.component.css',
-'/projects/foo/src/app/app.component.ts',
+'/projects/foo/src/app/app.css',
+'/projects/foo/src/app/app.ts',
 ]),
 );
 });
@@ -498,8 +498,8 @@ describe('Application Schematic', () => {
 '/projects/foo/tsconfig.spec.json',
 '/projects/foo/karma.conf.js',
 '/projects/foo/src/test.ts',
-'/projects/foo/src/app/app.component.css',
-'/projects/foo/src/app/app.component.spec.ts',
+'/projects/foo/src/app/app.css',
+'/projects/foo/src/app/app.spec.ts',
 ].forEach((x) => expect(files).not.toContain(x));
 
 expect(files).toEqual(
@@ -509,8 +509,8 @@ describe('Application Schematic', () => {
 '/projects/foo/src/index.html',
 '/projects/foo/src/main.ts',
 '/projects/foo/src/styles.css',
-'/projects/foo/src/app/app.component.ng.html',
-'/projects/foo/src/app/app.component.ts',
+'/projects/foo/src/app/app.ng.html',
+'/projects/foo/src/app/app.ts',
 ]),
 );
 });
@@ -530,10 +530,10 @@ describe('Application Schematic', () => {
 '/projects/foo/src/main.ts',
 '/projects/foo/src/styles.css',
 '/projects/foo/src/app/app.config.ts',
-'/projects/foo/src/app/app.component.css',
-'/projects/foo/src/app/app.component.ng.html',
-'/projects/foo/src/app/app.component.spec.ts',
-'/projects/foo/src/app/app.component.ts',
+'/projects/foo/src/app/app.css',
+'/projects/foo/src/app/app.ng.html',
+'/projects/foo/src/app/app.spec.ts',
+'/projects/foo/src/app/app.ts',
 ]),
 );
 });
@@ -557,7 +557,7 @@ describe('Application Schematic', () => {
 it('should create a standalone component', async () => {
 const options = { ...defaultOptions, standalone: true };
 const tree = await schematicRunner.runSchematic('application', options, workspaceTree);
-const component = tree.readContent('/projects/foo/src/app/app.component.ts');
+const component = tree.readContent('/projects/foo/src/app/app.ts');
 
 expect(component).not.toContain('standalone');
 });
@@ -569,7 +569,7 @@ describe('Application Schematic', () => {
 
 expect(tree.files).toContain('/projects/foo/src/app/app.routes.ts');
 
-const component = tree.readContent('/projects/foo/src/app/app.component.ts');
+const component = tree.readContent('/projects/foo/src/app/app.ts');
 expect(component).toContain(`import { RouterOutlet } from '@angular/router';`);
 expect(component).toContain(`imports: [RouterOutlet]`);
 
@@ -654,7 +654,7 @@ describe('Application Schematic', () => {
 
 const path = '/projects/foo/src/app/app.module.ts';
 const content = tree.readContent(path);
-expect(content).toMatch(/import { AppComponent } from '\.\/app\.component';/);
+expect(content).toMatch(/import { App } from '\.\/app';/);
 });
 
 it('should create all files of an application', async () => {
@@ -671,10 +671,10 @@ describe('Application Schematic', () => {
 '/projects/foo/src/styles.css',
 '/projects/foo/src/app/app-routing.module.ts',
 '/projects/foo/src/app/app.module.ts',
-'/projects/foo/src/app/app.component.css',
-'/projects/foo/src/app/app.component.ng.html',
-'/projects/foo/src/app/app.component.spec.ts',
-'/projects/foo/src/app/app.component.ts',
+'/projects/foo/src/app/app.css',
+'/projects/foo/src/app/app.ng.html',
+'/projects/foo/src/app/app.spec.ts',
+'/projects/foo/src/app/app.ts',
 ]),
 );
 });