.NET CORE + ANGULAR
Jesús Rodríguez
.NET CORE + ANGULAR
¿Por qué Angular?
Single Page Application
Aplicación independiente
Componentes y WebComponents
<sequel-calendar
[date]="date"
[options]="options">
</sequel-calendar><div id="calendar"></div>Separación de conceptos
.NET CORE + ANGULAR
Typescript e inyección de dependencias
Ventajas para usuarios .NET
@Injectable()
export class ClientsService {
constructor(private http: Http) { }
getClients(): Observable<IClient[]> {
return http.get('/api/clients')
.map(c => c.json());
}
}.NET CORE + ANGULAR
Bundles muy grandes que descargar en cliente
¿Desventajas?
.NET CORE + ANGULAR
¿Previews? ¿Seo? ¿Qué seo?
¿Desventajas?
.NET CORE + ANGULAR
¿Cómo combinarlos? Opción 1
localhost:5000
localhost:4200
dominio.com
http.get('localhost:5000/api/clientes');
Array<Cliente>
.NET CORE + ANGULAR
¿Cómo combinarlos? Opción 2
localhost:5000
.NET CORE + ANGULAR
Aplicación clásica
Respuesta
inicial
Descargando
assets
Init
Pidiendo
datos
Renderizado
.NET CORE + ANGULAR
Aplicación con Server Side Rendering
Respuesta
inicial
Descargando
assets
Init
Pidiendo
datos
Renderizado
Página
estática
.NET CORE + ANGULAR
DEMO
.NET CORE + ANGULAR
- Angular Essentials
Tuneando Visual Studio Code
- Auto Import
- C#
- C# Extensions
.NET CORE + ANGULAR
- https://github.com/Foxandxss/lenguajes-core
Enlaces
- https://webpack.js.org/
- https://docs.microsoft.com/en-us/aspnet/core/client-side/spa-services
- https://github.com/aspnet/JavaScriptServices
- https://github.com/MarkPieszak/aspnetcore-angular2-universal
- https://github.com/aspnet/templating
- https://github.com/angular/universal