Elektronica-ICT
WEB FRAMEWORKS
No matter what JavaScript framework you choose, you will regret it
,Web Frameworks Elektronica-ICT
Inhoudstabel
H1: Inleiding ..................................................................................................................... 3
1.1 DOM .............................................................................................................................................. 3
1.2 AJAX ............................................................................................................................................... 3
1.3 Web Frameworks .......................................................................................................................... 3
H2: TypeScript .................................................................................................................. 4
2.1 Origine ........................................................................................................................................... 4
2.2 Type system ................................................................................................................................... 6
2.3 Functies ......................................................................................................................................... 7
2.4 Object Oriented Programming ...................................................................................................... 8
2.5 Modules ......................................................................................................................................... 9
2.6 Decorators ................................................................................................................................... 10
H3: Angular – intro.......................................................................................................... 10
3.1 Voordelen van Angular ................................................................................................................ 10
3.2 Project maken.............................................................................................................................. 11
3.3 Structuur ...................................................................................................................................... 11
3.4 Component maken ...................................................................................................................... 13
H4: Angular – interpolation & pipes ................................................................................ 13
4.1 Interpolation................................................................................................................................ 13
4.2 Pipes ............................................................................................................................................ 14
H5: Angular - directives ................................................................................................... 15
5.1 Structural directives .................................................................................................................... 15
5.2 If-directive ................................................................................................................................... 15
5.3 For-directive ................................................................................................................................ 15
H6: Angular – property & event binding .......................................................................... 16
6.1 Property binding .......................................................................................................................... 16
6.2 Event binding ............................................................................................................................... 17
H7: Angular - two-way binding ........................................................................................ 18
7.1 Two-way binding ......................................................................................................................... 18
7.2 Parent-child componenten.......................................................................................................... 20
H8: Angular – modules & routing .................................................................................... 21
8.1 Angular modules.......................................................................................................................... 21
8.2 Angular routing............................................................................................................................ 21
H9: Angular - services...................................................................................................... 23
9.1 Concept........................................................................................................................................ 23
1
, Web Frameworks Elektronica-ICT
9.2 Implementatie ............................................................................................................................. 23
9.3 Http service ................................................................................................................................. 24
9.4 Observables ................................................................................................................................. 24
9.5 Component lifecycle .................................................................................................................... 25
9.6 Promises ...................................................................................................................................... 25
H10: MEAN stack ............................................................................................................ 26
10.1 Concept MEAN stack ................................................................................................................. 26
10.2 NodeJS ....................................................................................................................................... 26
10.3 Express....................................................................................................................................... 26
10.4 MongoDB ................................................................................................................................... 26
2
WEB FRAMEWORKS
No matter what JavaScript framework you choose, you will regret it
,Web Frameworks Elektronica-ICT
Inhoudstabel
H1: Inleiding ..................................................................................................................... 3
1.1 DOM .............................................................................................................................................. 3
1.2 AJAX ............................................................................................................................................... 3
1.3 Web Frameworks .......................................................................................................................... 3
H2: TypeScript .................................................................................................................. 4
2.1 Origine ........................................................................................................................................... 4
2.2 Type system ................................................................................................................................... 6
2.3 Functies ......................................................................................................................................... 7
2.4 Object Oriented Programming ...................................................................................................... 8
2.5 Modules ......................................................................................................................................... 9
2.6 Decorators ................................................................................................................................... 10
H3: Angular – intro.......................................................................................................... 10
3.1 Voordelen van Angular ................................................................................................................ 10
3.2 Project maken.............................................................................................................................. 11
3.3 Structuur ...................................................................................................................................... 11
3.4 Component maken ...................................................................................................................... 13
H4: Angular – interpolation & pipes ................................................................................ 13
4.1 Interpolation................................................................................................................................ 13
4.2 Pipes ............................................................................................................................................ 14
H5: Angular - directives ................................................................................................... 15
5.1 Structural directives .................................................................................................................... 15
5.2 If-directive ................................................................................................................................... 15
5.3 For-directive ................................................................................................................................ 15
H6: Angular – property & event binding .......................................................................... 16
6.1 Property binding .......................................................................................................................... 16
6.2 Event binding ............................................................................................................................... 17
H7: Angular - two-way binding ........................................................................................ 18
7.1 Two-way binding ......................................................................................................................... 18
7.2 Parent-child componenten.......................................................................................................... 20
H8: Angular – modules & routing .................................................................................... 21
8.1 Angular modules.......................................................................................................................... 21
8.2 Angular routing............................................................................................................................ 21
H9: Angular - services...................................................................................................... 23
9.1 Concept........................................................................................................................................ 23
1
, Web Frameworks Elektronica-ICT
9.2 Implementatie ............................................................................................................................. 23
9.3 Http service ................................................................................................................................. 24
9.4 Observables ................................................................................................................................. 24
9.5 Component lifecycle .................................................................................................................... 25
9.6 Promises ...................................................................................................................................... 25
H10: MEAN stack ............................................................................................................ 26
10.1 Concept MEAN stack ................................................................................................................. 26
10.2 NodeJS ....................................................................................................................................... 26
10.3 Express....................................................................................................................................... 26
10.4 MongoDB ................................................................................................................................... 26
2
