-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
416 lines (412 loc) · 28.9 KB
/
index.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
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<script type="text/javascript" src="js/main.js"></script>
</head>
<div style="margin-left: auto; margin-right: auto; border: 1px solid #6690bc; color: #333399; width: 80%; text-align: center; background-color: #dfe8f8;">
<a style="font-variant: small-caps; font-size: 16px;">Functional Competencies: JavaScript Front-end Developer</a></div>
<div style="margin-left: auto; margin-right: auto; border: 1px solid #6690bc; width: 80%; text-align: center;">
<span style="text-align: center; line-height: 30px; font-variant: small-caps; color: #6690bc; font-size: 17px;">Aptitude Evaluation by Functional Competencies</span>
<table style="border: 2px solid #ffffff; margin: 0px auto; width: 100%;">
<tbody>
<tr>
<td colspan="3" style="width: 28px; text-align: left; padding-left: 30px;">
<table border="1" class="jiveBorder" style="border: 1px solid #e3a521; margin: 0px auto; width: 98%;">
<tbody>
<tr>
<th colspan="8" valign="middle" style="border: 1px solid #e3a521; font-variant: small-caps; text-align: center; color: #ffffff; padding: 2px; background-color: #fcc78e;">
<span style="color: #000000;"><strong>Functional Competencies</strong></span></th>
</tr>
<tr>
<td style="width: 8%; text-align: center;">
<span style="color: #000000; width: 15%;">Category</span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Junior</strong></span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>J2M</strong></span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Middle</strong></span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>M2S</strong></span></td>
<td style="width: 23%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Senior</strong></span></td>
<td style="width: 25%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Tech Lead</strong></span></td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<span style="color: #000000;">Code Quality</span></td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Writes well-commented, logically structured, maintainable and accurate code: splits code into functional blocks;<br/> (2). Refrains from code repetition.</span></p>
<p>
<span style="color: #000000;">(3). Uses techniques for increasing readability (follows guidelines).</span></p>
<p>
<span style="color: #000000;">(4). Follows and supports other’s style while making corrections in their code: conforms to Dev team \ Client coding style.</span></p>
</td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(5). Uses <a target="_blank" href="https://bitbucket.org/gamingteam/">patterns and control structs</a>: </span>
<span style="color: red">Observer, Deferred \ Promise, MVC (effectively separates data, templates and the logic, i.e. HTML templating), etc.</span></p>
<p>
<span style="color: #000000;">(6).</span><span style="color: #000000;">Uses fastest algorithms.</span></p>
<p>
<span style="color: #000000;">(7). Effectively applies algorithms for sorting, loops, function calls, handling DOM, etc.</span></p>
<p>
<span style="color: #000000;">(8). Minimizes obvious logical and coding errors.</span></p>
<p>
<span style="color: #000000;">(9). Effectively Communicates with QCs on most problematic areas to be tested.</span></p>
</td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Develops highly maintainable code that is easy to understand, compliant to accepted standards, best practices and guidelines.</span></p>
<p>
<span style="color: #000000;">(2). Envisions errors.</span></p>
<p>
<span style="color: #000000;">(3). Runs code review sessions.</span></p>
<p>
<span style="color: #000000;">(4). Uses fallbacks.</span></p>
<p>
<span style="color: #000000;">(5). Provides the best testing practices.</span></p>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<span style="color: #000000;">JavaScript and DOM</span></td>
<td colspan="2" style="text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Modifies DOM with pure JS.</span></p>
<p>
<span style="color: #000000;">(2). Effectively applies knowledge of working principles of DOM event(s) handlers, intervals, closures and AJAX.</span></p>
<p>
<span style="color: #000000;">(3). Applies main\basic functions in jQuery: append(), html(), prop(), etc.</span></p>
<p>
<span style="color: #000000;">(4). Uses basic regular expressions.</span></p>
<p>
<span style="color: #000000;">(5). Applies working principles of cookies.</span></p>
<p>
<span style="color: #000000;">(6). Distinguishes between GET and POST queries.</span></p>
<p>
<span style="color: #000000;">(7). Effectively troubleshoots code of other developers.</span></p>
<p>
<span style="color: #000000;">(8). Has basic mmapi understanding.</span>
</p>
</td>
<td colspan="2" style="text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Re-defines client functionality according to tasks, uses algorithms to achieve the goals.</span></p>
<p>
<span style="color: #000000;">(2). Successfully applies OOP approaches (constructors, objects-initializers, proto- inheritance, etc.).</span></p>
<p>
<span style="color: #000000;">(3). Effectively applies such methods as: call(), apply().</span></p>
<p>
<span style="color: #000000;">(4). Effectively learns and applies any JS library\necessary frameworks.</span></p>
<p>
<span style="color: #000000;">(5). Uses feature and browser detection respectively.</span></p>
<p>
<span style="color: #000000;">(6). Applies regular expressions optimally.</span></p>
<p>
<span style="color: #000000;">(7). Uses and understands principles of delegation.</span>
</p>
<p>
<span style="color: #000000;">(8). Applies image optimization principles</span>
</p>
<p>
<span style="color: #000000;">(9). Masters full mmapi understanding.</span>
</p>
</td>
<td colspan="2" style="text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Uses in-depth understanding of interpreter's work (i.e. optimizes code in relation to execution speed), knowledge and
expertise of the order of execution and optimisation of specific events -> first byte, dom ready, load, draw, redraws, etc.
</span></p>
<p>
<span style="color: #000000;">(2). Uses knowledge of principles of page loading and rendering (reflow, repaint, page resources loading order, etc.)</span></p>
<p>
<span style="color: #000000;">(3). Supports and develops templates.</span></p>
<p>
<span style="color: #000000;">(4). Provides code re-factoring for own and others' code.</span>
</p>
<p>
<span style="color: #000000;">(6). Upholds coding standards for code review.</span>
</p>
<p>
<span style="color: #000000;">(7). Writes code with safety fallbacks.</span>
</p>
<p>
<span style="color: #000000;">(8). Write cross-browser code with good understanding of cross-browser peculiarities.</span>
</p>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<span style="color: #000000;">HTML / CSS</span></td>
<td colspan="2" style="text-align: justify; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Codes HTML / CSS according to standards (W3C).</span></p>
</td>
<td colspan="2" style="text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Effectively applies CSS.</span></p>
<p>
<span style="color: #000000;">(2). Does the most part of tasks with HTML / CSS.</span></p>
<p>
<span style="color: #000000;">(3). Understands difference in image formats, techniques to optimize them.</span></p>
</td>
<td colspan="2" style="text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Excels in cross-browser web-development peculiarities (including 3rd-party cookies, iFrames, Flash, AJAX, Forms, XML pages, etc.)</span></p>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<span style="color: #000000;">Task Resolving \ Time Mgmt.</span></td>
<td colspan="2" style="text-align: left;">
<p>
<span style="color: #000000;">(1). Chooses applicable solutions for each type of task, templates, snippets, etc.</span></p>
<p>
<span style="color: #000000;">(2). Meets requirements, guidelines, standards.</span></p>
<p>
<span style="color: #000000;">(3). Completes tasks and goals on time, notifies if not.</span></p>
<p>
<span style="color: #000000;">(4). Effectively interacts with QCs and PMs.</span></p>
<p>
<span style="color: #000000;">(5). Changes / redefines standard methods: show-hide functionality, IsDefaultArrived, etc.</span></p>
<p>
<span style="color: #000000;">(6). Excels in mmcore.js / CG API knowledge.</span></p>
</td>
<td colspan="2" style="text-align: left;">
<p>
<span style="color: #000000;">(1). Correctly estimates tasks.</span></p>
<p>
<span style="color: #000000;">(2). Identifies potential issues and logical errors on estimation stage.</span></p>
<p>
<span style="color: #000000;">(3). Escalates specification / estimation gaps.</span></p>
<p>
<span style="color: #000000;">(4). Uses XP practices in production.</span></p>
<p>
<span style="color: #000000;">(5). Contributes to knowledge base on related topics.</span></p>
<p>
<span style="color: #000000;">(6). Effectively re-uses coding techniques for different classes of tasks.</span></p>
<p>
<span style="color: #000000;">(7). Has in-depth knowledge of mmcore / CG functionality, participates in authoring of mmcore.js snippets, functional extensions per Client.</span></p>
<p>
<span style="color: #000000;">(8). Shares experience by keeping database of acceptable methods and necessary skills in working with specific clients, usual pitfalls and workarounds.</span></p>
</td>
<td style="text-align: left;">
<p>
<span style="color: #000000;">(1). Estimates complex tasks against personal / others' experience.</span></p>
<p>
<span style="color: #000000;">(2). Writes comprehensive estimation summary with reasonable suggestions, technical and logical risks identified.</span></p>
<p>
<span style="color: #000000;">(3). Ensures quality and objectives are met.</span></p>
<p>
<span style="color: #000000;">(4). Implements optimal solutions based on Client's goals understanding.</span></p>
<p>
<span style="color: #000000;">(5). Splits tasks into blocks to change the task's difficulty level.</span></p>
<p>
<span style="color: #000000;">(6). Proficient in methods of mmcore.js, can change them for adding new possibilities with backward compatibility.</span></p>
</td>
<td style="text-align: left;">
<p>
<span style="color: #000000;">(1). Consults and assists on highly technical issues. Provides final sayso in campaign development questions related to pitfalls, possible errors, complex system interactions, product module interactions, cross-browser issues and alternative content compatibility served by CG.</span></p>
<p>
<span style="color: #000000;">(2). Detects whether specifications contradict product functionalities or implementation logic. Negotiates questionable points in specifications, resolves inconsistent requirements. Bridges communication gaps. Initiates talks with Client Services concerning additional requirements or changes needed for successful campaigns coding.</span></p>
</td>
</tr>
<tr>
<td rowspan="2" style="text-align: center; vertical-align: middle; background-color: #e8e8e8;">
<span style="color: #000000; text-align: center;">
Related Induction Plan Component:
</span></td>
<td colspan="6" style="padding: 2px; text-align: left; vertical-align: top; background-color: #e8e8e8;">
<p style="">
All Positions: <br/>
<ol>
<li>Follow <a href=""#">Guidelines</a></li>
<li>Passes <a href="#">practical exercises</a> with good readable code</li>
<li>Applies the <a href="https://bitbucket.org/gamingteam/" target="_blank">above coding patterns</a> in the <a href="#">practical exercises</a></li>
</ol>
</p>
</td>
</tr>
<tr>
<td colspan="2" style="padding: 2px; text-align: center; vertical-align: middle; background-color: #e8e8e8;">
<p>
<span style="color: red;">List other additional criteria for completing of the
<a href="https://drive.google.com/file/d/0ByTeA0PZj6sbWU9JVzh4ejhobUU/view">practical exercises</a> for Jr. Position
</span>
</p>
</td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: top; background-color: #e8e8e8;">
<p>
<span style="color: red;">List other additional criteria for completing of the
<a href="https://drive.google.com/file/d/0ByTeA0PZj6sbWU9JVzh4ejhobUU/view">practical exercises</a> for Sr. Position.
</span>
</p>
</td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: top; background-color: #e8e8e8;">
<p>
<span style="color: #000000;">Uses fallbacks in doing the <a href="https://drive.google.com/file/d/0ByTeA0PZj6sbWU9JVzh4ejhobUU/view">practical exercises</a></span>
</p>
<span style="color: red;">List other additional criteria for completing of the
<a href="https://drive.google.com/file/d/0ByTeA0PZj6sbWU9JVzh4ejhobUU/view">practical exercises</a> for Middle \ Middle 2 Sr. Positions.
</span>
</td>
</tr>
</tbody>
</table>
</td>
<td colspan="3">
</td>
</tr>
<tr>
<td colspan="3">
</td>
</tr>
</tbody>
</table>
<div style="height: 20px;">
</div>
</div>
<div style="margin-left: auto; margin-right: auto; border: 1px solid #6690bc; color: #333399; width: 80%; text-align: center; background-color: #dfe8f8;">
<a href="/" style="color: #333399; font-variant: small-caps; font-size: 16px;">Core Knowledge:<span style="color: #333399; text-align: center; background-color: #dfe8f8;">JavaScript Front-end Developer</span></a></div>
<div style="margin-left: auto; margin-right: auto; border: 1px solid #6690bc; width: 80%; text-align: center;">
<span style="text-align: center; line-height: 30px; font-variant: small-caps; color: #6690bc; font-size: 17px;">Aptitude Evaluation by Core Knowledge</span>
<table style="border: 2px solid #ffffff; margin: 0px auto; width: 100%;">
<tbody>
<tr>
<td colspan="3" style="width: 28px; text-align: left; padding-left: 30px;">
<table border="1" class="jiveBorder" style="border: 1px solid #d0e9a0; margin: 0px auto; width: 98%;">
<tbody>
<tr>
<th colspan="8" valign="middle" style="border: 1px solid #d0e9a0; font-variant: small-caps; text-align: center; color: #ffffff; padding: 2px; background-color: #d0e9a0;">
<span style="color: #000000;"><strong>Core Knowldge</strong></span></th>
</tr>
<tr>
<td style="width: 8%; text-align: center;">
<span style="color: #000000; width: 15%;">Category</span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Junior</strong></span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>J2M</strong></span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Middle</strong></span></td>
<td style="width: 10%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>M2S</strong></span></td>
<td style="width: 23%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Senior</strong></span></td>
<td style="width: 25%; padding: 2px; text-align: center; vertical-align: middle;">
<span style="color: #000000;">
<strong>Tech Lead</strong></span></td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<span style="color: #000000;">Product \ Platform Knowledge</span></td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). Knows Product enough for campaign development.</span></p>
</td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">(1). <span style="color: red;">Knows Product limitations and possible ways to overcome them by using specific use-cases, mmcore.js extensions</span>. Excels in CG functionality knowledge to provide campaigns of any complexity unassisted.</span></p>
</td>
<td style="padding: 2px; text-align: left; vertical-align: middle;">
<span style="color: #000000;">(1). Suggests product functionality changes and the toolbox for implementing them, provides extensions.</span></td>
<td>
<p>
<span style="color: #000000;">(1). Provides advanced analytics for functionalities and products modules optimal interactions.</span></p>
<p>
<span style="color: #000000;">(2). Advises best product usage for non-standard use-cases and prevents worst-cases scenarios;</span></p>
<p>
<span style="color: #000000;">(3) Knows detailed technicalities of product functionalities realization and architectural design;</span></p>
<p>
<span style="color: #000000;">(4). Participates in high-level counselling sessions concerning new product features implementation, provides well-grounded sayso.</span></p>
<p>
<span style="color: #000000;">(5). Reconceptualizes design and re-design to best suit product changes, taking campaign coding peculiarities and systemic workload.<br/> (6) Assumes ownership for tasks related to product analytics, modules compatibility and features advancement, provides substantiated feasibility pros and cons, assumes responsibility over extensions
<span style="color: #000000;">implementations</span> per team.</span> </p>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle; background-color: #e8e8e8;">
<span style="color: #000000;"><strong>Product \ Platform Knowledge: Induction Specific Realisation</strong></span></td>
<td colspan="2" style="padding: 2px; text-align: left; vertical-align: top; background-color: #e8e8e8;">
<p>
<span style="color: #000000;">
(1). Successfully passes <a href="http://grinchakandrew.github.io/InductionQuestionnaire/" target="_blank">questionnaire</a>.
</span></p>
</td>
<td colspan="6" style="padding: 2px; text-align: left; vertical-align: top; background-color: #e8e8e8;">
<p>
<span style="color: #000000;">
(1). Successfully passes <a href="http://grinchakandrew.github.io/InductionQuestionnaire/" target="_blank">questionnaire</a>.
</span></p>
<p>
<span style="color: #000000;">
(2). Uses snippets and mmcore.js extensions that cover specific use-cases. Successfully applies and understands those in context of campaigns.
</span>
</p>
<p><span style="color: red;">2 Bartek:
is this point necessary?
if so, provide the names of the extensions and use-cases to cover.
</span></p>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<span style="color: #000000;">Specification Estimation</span></td>
<td colspan="6" style="text-align: left; vertical-align: middle;">
<p>
<span style="color: #000000;">Provides time estimations and complexity level of the tasks.</span></p>
<p>
<span style="color: #000000;">Understands the logic of implementing different types of tests</span></p>
<p>
<span style="color: #000000;">Clarifies information needed for Task estimations with more experienced colleagues</span></p>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle; background-color: #e8e8e8;">
<p>
<span style="color: #000000;">
<strong>Specification Estimation:</strong></span></p>
<p>
<span style="color: #000000;">
<strong>Induction Specific Realisation</strong><br/></span></p>
</td>
<td colspan="6" style="text-align: left; vertical-align: middle; background-color: #e8e8e8;">
<p><span style="color: #000000;">Provides time estimations and complexity level of the tasks: Dev Lead will provide a real hands-on specification to estimate.</span></p>
<p><span style="color: #000000;">Understands the logic of implementing different types of tests: is shown those types by the Mentor and provided examples of differing logic for campaign implementation.</span></p>
<p><span style="color: red;">2 Bartek: there should be examples of Specifications of different levels of complexity here.</span></p>
</td>
</tr>
</tbody>
</table>
</td>
<td colspan="3">
</td>
</tr>
<tr>
<td colspan="3">
</td>
<td>
</td>
</tr>
</tbody>
</table>
<div style="height: 20px;">
</div>
</div>
</html>