forked from duffleit/duffleit.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
/
ngtraining.html
336 lines (334 loc) · 11.3 KB
/
ngtraining.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
---
layout: page
title: NGTraining
---
<section class="ngtraining-detail ngtraining">
<div class="container">
<div class="row">
<div class="col-12 text-center">
<img src="{{ site.baseurl }}/public/images/ngtraining.png" />
</div>
<div class="container">
<div class="row">
<div class="col-12 intro">
I <b>support teams</b> in the Enterprise Environment to build
Angular Applications <b>that scale</b>:
</div>
</div>
<div class=" ng-items row">
<div class="col-md-4">
<div class="item">
<i class="fa fa-users" aria-hidden="true"></i>
<div class="header">Trainings</div>
<div class="info">
Advanced workshops about <b>Angular Architectures</b>,
<b>Best Practices</b>, <b>Design Concepts</b> and
<b>Performance Patterns</b>.
</div>
</div>
</div>
<div class="col-md-4">
<div class="item">
<i class="fa fa-code" aria-hidden="true"></i>
<div class="header">Code Reviews</div>
<div class="info">
A <b>codebase deep-dive</b> to make sure that you’re on the
<b>right track</b>, combined with lots of
<b>knowledge sharing</b>.
</div>
</div>
</div>
<div class="col-md-4">
<div class="item">
<i class="fa fa-briefcase" aria-hidden="true"></i>
<div class="header">Consulting</div>
<div class="info">
Supporting <b>your teams and projects</b> for a longer period to
get things done and to guide you to
<b>future-proof solutions</b>.
</div>
</div>
</div>
</div>
<div class="row text-center button-row">
<div class="col-12">
<a class="button" href="#contact">
<i class="fa fa-comments-o" aria-hidden="true"></i>Let's talk
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="ngtraining-topics">
<div class="container">
<div class="row intro">
<div class="col-12">
<h1>Architecture Trainings</h1>
<div>
The purpose of this advanced training is to give
<b>a deep-dive into the Architectural Concepts of Angular</b>, by
being strongly focused
<b>on real-world-scenarios and hands-on exercises</b>.
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<i class="fa fa-object-group" aria-hidden="true"></i>
<h3>Application <br />Structure</h3>
<ul>
<li>Microfrontends and Microapps</li>
<li>Full-verticalized Feature Modules</li>
<li>Mono-Repos</li>
<li>Structuring and Slicing Strategies</li>
<li>Set-up of Cross-Cutting Concerns</li>
<li>Consistent Linting and Formatting</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-cubes" aria-hidden="true"></i>
<h3>Reusability <br />Patterns</h3>
<ul>
<li>Reusable Component Libraries</li>
<li>Component Design Patterns</li>
<li>Extensible Libraries with NPM</li>
<li>Design Systems</li>
<li>Isolation with Web Components</li>
<li>Scaffolding with Schematics</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-exchange" aria-hidden="true"></i>
<h3>
Integration &<br />
Dependencies
</h3>
<ul>
<li>Dependency Management</li>
<li>Approaches for UI-Integration</li>
<li>Backend Integration Patterns</li>
<li>Dependency-Graph Validations</li>
<li>Different Versions of Angular</li>
<li>Architectural Checks</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-random" aria-hidden="true"></i>
<h3>Reactive <br />UI-Architectures</h3>
<ul>
<li>The Reactive Manifesto</li>
<li>
Streams and Subjects as a central part of the Application
Architecture
</li>
<li>Advanced Observables</li>
<li>Reactive and Optimistic UIs</li>
<li>Event-Based Architectures</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-tachometer" aria-hidden="true"></i>
<h3>
Performance &<br />
Compilation
</h3>
<ul>
<li>Change Detection Strategies</li>
<li>Zone-less Angular</li>
<li>Lazy-loading Best-Practices</li>
<li>Tree-shakable applications</li>
<li>The new compiler features of IVY</li>
<li>AOT and JIT compilation</li>
<li>Server-Side Rendering</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-archive" aria-hidden="true"></i>
<h3>
Deployment &<br />
Operations
</h3>
<ul>
<li>Logging, Tracing and Analytics</li>
<li>Operation Platforms</li>
<li>Feature Toggles and A/B Testing</li>
<li>Partial Deployments</li>
<li>Resilience and Error Handling</li>
<li>The <i>12 Factors</i> for the Frontend</li>
<li>Immutable Web Apps</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-database" aria-hidden="true"></i>
<h3>State<br />Management</h3>
<ul>
<li>Distribution and Centralization</li>
<li>Long-Lasting and Transient State</li>
<li>NGRX, NGXS, and Akita</li>
<li>Handling Side effects</li>
<li>State immutability</li>
<li>Slicing substores correctly</li>
<li>Complex selects and memorizing</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-shield" aria-hidden="true"></i>
<h3>
Authentication &<br />
Authorization
</h3>
<ul>
<li>OAuth 2 and OpenId Connect</li>
<li>Authorization Flows</li>
<li>Using JWT Tokens</li>
<li>Integrating existing Identity‑Providers</li>
<li>Security Concepts for Developers</li>
<li>State-of-the-art Tooling</li>
</ul>
</div>
<div class="col-md-4">
<i class="fa fa-check-square" aria-hidden="true"></i>
<h3>Testing<br />Best Practices</h3>
<ul>
<li>Different Types of Testing</li>
<li>Keys of a maintainable Testbase</li>
<li>Testbed-Tests and pure Unit-Tests</li>
<li>Integration Testing and E2E testing</li>
<li>Snapshot Testing</li>
<li>Tests for Asynchronous Code</li>
<li>Mocking Strategies</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-12 additional-topics">
<i class="fa fa-plus-circle" aria-hidden="true"></i>Optional Modules are
<b>Internationalisation</b>, <b>Progressive-Web-Apps</b>, and
<b>AngularJS-Migration</b>.
</div>
</div>
<div class="row languages">
<div class="col-12 text-center">
This training can be held in
<img src="{{ site.baseurl }}/public/images/germany.png" />
<b>German</b> or
<img src="{{ site.baseurl }}/public/images/en.png" />
<b>English</b>.
</div>
</div>
<div class="row text-center button-row">
<div class="col-12">
<a class="button" href="#contact">
<i class="fa fa-comments-o" aria-hidden="true"></i>Contact me for
further information
</a>
</div>
</div>
</div>
</section>
<section class="trainer">
<div class="container">
<div class="row">
<div class="col-md-4 image-col">
<div class="image-border">
<div class="image"></div>
</div>
</div>
<div class="col-md-8 text-center text-md-left">
<h1>About David</h1>
<p>
David is working as a
<b>consultant for modern web-development in enterprise area</b>
for multiple years now. By starting with AngularJS,
<b>he was part of this movement from the very first second</b>. David
enjoys sharing his knowledge as a <b>trainer</b>, <b>speaker</b> or
<b>lecturer</b> for post-diploma courses at the University of Applied
Sciences Technikum Vienna.
</p>
<p>
<a class="button" href="{{ site.baseurl }}/about">
<i class="fa fa-arrow-right"></i><span>More About Me</span>
</a>
</p>
</div>
</div>
</div>
</section>
<section class="quotes">
<div class="container">
<div class="row">
<div class="col-12">
<h2>What others think about this training</h2>
<div class="quote-box">
<div class="quote">
This was exactly the deep-dive we needed, to move our codebase into
the right direction.
</div>
<div class="origin">
Workshop-Attendee, Austria (<i>translated from German</i>)
</div>
</div>
<div class="quote-box">
<div class="quote">
It was really intensive and also fast, but packed with lots of
learnings for me.
</div>
<div class="origin">
Workshop-Attendee, Austria (<i>translated from German</i>)
</div>
</div>
<div class="quote-box">
<div class="quote">
I really appreciate the power of David as a trainer. This guy seems
to be on fire 24/7.
</div>
<div class="origin">Workshop-Attendee, Germany</div>
</div>
<div class="quote-box">
<div class="quote">
I really like that we always took the time, to discuss specific
problems of our projects and figure out possible solutions.
</div>
<div class="origin">
Workshop-Attendee, Austria (<i>translated from German</i>)
</div>
</div>
</div>
</div>
<div class="row twitter">
<div class="col-12">
<blockquote class="twitter-tweet" data-lang="en">
<p lang="en" dir="ltr">
We just had this great
<a
href="https://twitter.com/hashtag/Angular?src=hash&ref_src=twsrc%5Etfw"
>#Angular</a
>
Advanced Workshop with
<a href="https://twitter.com/duffleit?ref_src=twsrc%5Etfw"
>@duffleit</a
>
here at
<a href="https://twitter.com/Mettenmeier?ref_src=twsrc%5Etfw"
>@Mettenmeier</a
>! This was fun! 😊 And we learned quite a lot very useful
practices! Thank you David!
<a href="https://t.co/UfQ95yT43V">pic.twitter.com/UfQ95yT43V</a>
</p>
— Stefan Kley (@Kleywalker)
<a
href="https://twitter.com/Kleywalker/status/1106570997870854145?ref_src=twsrc%5Etfw"
>March 15, 2019</a
>
</blockquote>
<script
async
src="https://platform.twitter.com/widgets.js"
charset="utf-8"
></script>
</div>
</div>
</div>
</section>