Introducción a
Angular 2
Yo
{
"name": "Diego Coy",
"description": "A JavaScript developer",
"job": {
"company": "T̶a̶p̶p̶s̶i̶",
"title": "F̶r̶o̶n̶t̶ ̶E̶n̶d̶ ̶D̶e̶v̶e̶l̶o̶p̶e̶r̶"
},
"contact": "@UnJavaScripter",
"otherStuff": [
"AngularJS Colombia organizer/speaker",
"Plays DOTA2",
]
}
Built on TypeScript
RIP controladores
RIP *
Binding
https://docs.google.com/presentation/d/1XoizA8Dm_S3SU1jYPERmgWVIbqjGOXolpF3Jm2b8xKA/edit#slide=id.g14433fbf582a474620
Directivas nativas
ng-value,
ng-show,
ng-hide,
ng-src,
ng-href,
...
Directivas nativas
ng-click,
ng-change,
ng-blur,
ng-submit,
ng-checked,
...
Annotations
@Component({
selector: 'mi-app',
styleUrls: './app/index.css',
template: `
<div>
<h2>Bla</h2>
<a href="#">Link</a>
<p>Lorem ipsum bla bla blebla bloblu</p>
</div>
`
})
export class MiApp {
}
Bla bla bla
¿Código?
Demo time!
Angular-CLI
github.com/angular/angular-cli
Proyecto "terminado"
github.com/UnJavaScripter/listaDeCosasPorHacer-angular2
Crear un proyecto nuevo
$ sudo npm install -g angular-cli
$ mkdir carpetaParaMiProyectoDeEjemploHechoEnAngularJS2
$ cd carpetaParaMiProyectoDeEjemploHechoEnAngularJS2
$ ng new listaDeCosasPorHacer
// Esperar a que npm descarge el 75% de Internet. Idea: un npm p2p
$ ng serve
...
La forma de escribir código cambia
- Mucho -
Pero trae ventajas
- Mantenible
- Probable
- Extensible
NativeScript
Integrates with Angular 2.0
Eso fue todo
http://forums.forzamotorsport.net/turn10_postst379_-APEX---BlueReaper--Metalworks.aspx
@AngularjsCO
slackengine-angularjs-ee.appspot.com
Angular 2 Intro
By Diego Coy
Angular 2 Intro
- 926