Framework Angular

De Wikijoan
(Diferència entre revisions)
Dreceres ràpides: navegació, cerca
(Es crea la pàgina amb «=Introducció= *https://angular.io/ Tutorial: Tour of Heroes *https://angular.io/tutorial».)
 
(Introducció i instal.lació)
 
(Hi ha 2 revisions intermèdies sense mostrar fetes per un usuari)
Línia 1: Línia 1:
=Introducció=
+
=Introducció i instal.lació=
 
*https://angular.io/
 
*https://angular.io/
Tutorial: Tour of Heroes
+
*https://angular.io/guide/quickstart
 +
 
 +
'''Step 1'''. Set up the Development Environment
 +
<pre>
 +
$ npm install -g @angular/cli
 +
</pre>
 +
'''Step 2'''. Create a new project
 +
<pre>
 +
$ ng new my-app
 +
</pre>
 +
'''Step 3''': Serve the application
 +
<pre>
 +
$ cd my-app
 +
$ ng serve --open
 +
</pre>
 +
The ''ng serve'' command launches the server, watches your files, and rebuilds the app as you make changes to those files.
 +
 
 +
Using the ''--open'' (or just ''-o'') option will automatically open your browser on ''http://localhost:4200/''.
 +
 
 +
'''Step 4''': Edit your first Angular component
 +
 
 +
Editar ''src/app/app.component.ts'':
 +
<pre>
 +
export class AppComponent {
 +
  title = 'My First Angular App!';
 +
}
 +
</pre>
 +
=Project file review. ''src/ folder''=
 +
Your app lives in the src folder. All Angular components, templates, styles, images, and anything else your app needs go here. Any files outside of this folder are meant to support building your app.
 +
<pre>
 +
 
 +
src
 +
...app
 +
......app.component.css
 +
......app.component.html
 +
......app.component.spec.ts
 +
......app.component.ts
 +
......app.module.ts
 +
...assets
 +
......gitkeep
 +
...environments
 +
......environment.prod.ts
 +
......environment.ts
 +
...browserslist
 +
...favicon.ico
 +
...index.html
 +
...karma.conf.js
 +
...main.ts
 +
...polyfills.ts
 +
...styles.css
 +
...test.ts
 +
...tsconfig.app.json
 +
...tsconfig.spec.json
 +
...tslint.json
 +
</pre>
 +
Veure la funció de cadascun dels fitxers a:
 +
*https://angular.io/guide/quickstart
 +
 
 +
=Tutorial: Tour of Heroes=
 
*https://angular.io/tutorial
 
*https://angular.io/tutorial
 +
{{Autor}}, abril 2018

Revisió de 18:41, 9 maig 2018

Introducció i instal.lació

Step 1. Set up the Development Environment

$ npm install -g @angular/cli

Step 2. Create a new project

$ ng new my-app

Step 3: Serve the application

$ cd my-app
$ ng serve --open

The ng serve command launches the server, watches your files, and rebuilds the app as you make changes to those files.

Using the --open (or just -o) option will automatically open your browser on http://localhost:4200/.

Step 4: Edit your first Angular component

Editar src/app/app.component.ts:

export class AppComponent {
  title = 'My First Angular App!';
}

Project file review. src/ folder

Your app lives in the src folder. All Angular components, templates, styles, images, and anything else your app needs go here. Any files outside of this folder are meant to support building your app.


src
...app
......app.component.css
......app.component.html
......app.component.spec.ts
......app.component.ts
......app.module.ts
...assets
......gitkeep
...environments
......environment.prod.ts
......environment.ts
...browserslist
...favicon.ico
...index.html
...karma.conf.js
...main.ts
...polyfills.ts
...styles.css
...test.ts
...tsconfig.app.json
...tsconfig.spec.json
...tslint.json

Veure la funció de cadascun dels fitxers a:

Tutorial: Tour of Heroes


creat per Joan Quintana Compte, abril 2018

Eines de l'usuari
Espais de noms
Variants
Accions
Navegació
Institut Jaume Balmes
Màquines recreatives
CNC
Informàtica musical
joanillo.org Planet
Eines