Add readme

This commit is contained in:
Arti Zirk 2017-06-07 11:42:28 +03:00
parent c97290c13b
commit 2da320d262

116
README.md Normal file
View File

@ -0,0 +1,116 @@
TypeScript ja AngularJS
Kloonige https://bitbucket.org/mkalmo/i399exng1ts repo ja importige see IDE-sse.
1. Laadige teegid
> npm install
2. Uurige TypeScripti tüüpide käitumist (failis sample.ts). Enne IDE-sse
kopeerimist ja käivitamist arvake, kas kood on õige ja kuidas see käitub.
Koodi käivitamiseks:
> npm run build-sample
käivitab webpack-i, mis loob faili build/bundle.js
> node build/bundle.js
käivitab kompileeritud (transleeritud) koodi.
a)
let a: number = 3;
a = '3';
b)
let c: any;
c = 1;
c = '1';
c)
let post = new Post('title 1', 'text 1');
console.log(post.getTitle());
let object = {};
post = <Post> object;
console.log(post.getTitle());
d)
let a = 1;
let b = '1';
a = <number> b;
e)
let dao = new Dao();
let post = dao.getPost();
post.date = new Date();
f)
let dao = new Dao();
let post = dao.getPostTyped();
post.date = new Date();
g) Uurige build/bundle.js faili sisu.
3. Käivitage webpack-dev-server
> npm run serve
See peaks serveerima rakenduse aadressilt: http://localhost:3001
Koodi muutes peaks rakendus ennast ise värskendama.
4. Tõlkige rakendus TypeScrpit-i.
function AddCtrl($location: any, dataService: any) {
...
}
saab olema
export class AddCtrl { ...
kontrollerite registreerimine läheb app.ts faili.
Tüübid:
$location: ILocationService
$routeProvider: angular.route.IRouteProvider
$locationProvider: ILocationProvider
$q: IQService
5. Kasutage MemDataService klassi asemel RestDataService klassi.
a) Määrake app.ts failis andmete teenuseks RestDataService.
b) käivitage back-end teenus
> npm run back-end
c) lisage webpack-i konfiguratioonile (webpack.config.js) proxy
back-end teenusele:
devServer: {
proxy: {
'/api': {
target: 'http://localhost:3000',
secure: false
}
}
}
6) Ehitage rakendus ja serveerige see staatiliselt.
a) sulgege webpack-dev-server
b) ehitage rakendus
> npm run build
tekkis fail build/bundle.js, milles on kogu rakendus
c) lugege rakendus läbi back-end teenuse aadressilt http://localhost:3000
ja kontrollige, et kõik, töötab.
Lahendused: https://youtu.be/2Ncy50LWCK4