ABCDEFGHIJKLMNOPQR
1
Disclaimer:
- this roadmap is an addition, not a requirement for grading; it also has nothing to do with salary raise

- this is an instrument for TL / manager to help employees to build their hard skills development vector

- it's very important to be honest and objective when evaluating yourself

- the final decision about grading is on the TL / direct manager

- the expected level is M, please don't overuse the L level - it should be rare
2
Technical GradeE? / E?-E?
3
Employee's GradeE?
4
(filled by a manager)
5
(for technical grade you can put E2-E3 "range" grades if you want, the final grade should be strict)
6
7
8
PrimaryE2 - JuniorE3 - MiddleE4 - MiddleE5 - MiddleE6 - Senior
9
JS
10
JS Tutorial articles (80% of them)⬜Floating point numbers in JS⬜Class is a syntax sugar for function constructor and closure⬜Basic FP: pure functions, currying, point-free functions, function composition⬜JS Modules history and specifics⬜
11
Pitfalls of this keyword⬜Async/await, Promise.all, problems with async code⬜Memory management in JS; concept of Garbage Collection; WeakMap (Set)⬜
12
First class citizen concept for functions⬜JS runtime model - event loop; concept of call stack⬜FP advanced: functors, applicative, monad, HKT in fp-ts⬜
13
14
HTML / CSS / Animation
15
CSS Tutorial articles (80% of them)⬜CSS Selectors, their specificity and performance aspects⬜Responsive website, mobile-first approach⬜Graphics in HTML: Canvas and WebGL⬜Accessability: importance, ways to implement, problems⬜
16
The box model and box sizing⬜Difference between raster and vector graphics (PNG vs SVG)⬜
17
Flexbox⬜@keyframes and CSS animations⬜
18
19
ReactIconDescriptionValue
20
State and Lifecycle⬜VirtualDOM and reconciliation⬜Large lists problem and lists virtualization⬜Dynamic imports: as concept, in React or tools like Next.js⬜⬜Blank0
21
Base hooks in React⬜Any UI can be decomposed using React thinking⬜Location / History API in browser and React routing⬜XSHeard about + Dont know0
22
SRead about + Weak Knowledge1
23
MUnderstand + Used in Work3Expected level is M
24
LCan Teach + Deep knowledge4
25
Browsers
26
Events: bubble and capture phases, event delegation⬜ALL types of Web Storage: local, session, cache etc; limits of storage⬜requestAnimationFrame and JS animations with <canvas>⬜DOM, CSSOM, render tree, layout and paint⬜How browsers work: DNS lookup, TCP transmission, parsing HTML, async loading⬜
27
Service workers⬜
28
29
30
Backend connectivity
31
HTTP Basic: methods, headers, body, what is host, port, user-agent⬜Session concept and how HTTP Cookies work⬜Why we need CORS, how to configure it, XSS attach type⬜HTTP compression with gzip⬜HTTP Caching - how it works, ways to configure⬜
32
Typical HTTP session and status codes⬜HTTP Basic Authentication⬜Long polling as a WS alternative⬜Websockets vs HTTP, cons and pros⬜Websockets: AsyncAPI, SocketIO or other ws-client⬜
33
OAuth 2 process, how it works⬜
34
HTTP 2 multiplexing - the benefits and caveats⬜
35
36
TypeScript
37
Everyday types: primitive, function signature, object, interface, union⬜Utility types like Omit<>, Pick<>, Record<>⬜Difference between nominal typing (java) and structured typing (ts)⬜Advanced TS for functional programmers, like discriminated unions ⬜Generics: good examples, and overengineering problem⬜
38
Narrowing features: typeof and exhaustive check⬜
39
40
RxJS
41
Callback hell problem⬜Observer pattern⬜RxJS operators (80% from rxmarbles): debounce / throttle / combineLatest / merge⬜Complex RxJS operators: zip / switchMap, examples when to apply them⬜Pull vs push data transmitting strategy, way to organize data flow⬜
42
Map and filter operators⬜Subject vs BehaviourSubject vs ReplaySubject usages⬜Hot and cold observables, multicasting⬜Backpressure concept and use case in real world⬜
43
RxJS Observables and why we need them⬜
44
45
Architecture and software development
46
There are many ways to organize files and directories in app; (folders structure from internship)⬜Concept of state manager, ability to implement from scratch⬜Tree shaking concept, how it works under the hood⬜SSG (Gatsby) / SSR (Next.js) cons and pros⬜
47
SOLID principles⬜Types of FE Projects⬜Clear architecture (the book or articles)⬜
48
MVC and MVVM⬜
49
50
Performance and optimizations
51
Performance: FPS, CPU / RAM, dropped frames, DevTools and Lighthouse⬜Web Vitals and Optimizing loading sequence techniques⬜
52
53
54
FE Tools
55
Git basics: commit, push, merge⬜CI purpose basics: shadow merge, eslint, code coverage, releases⬜Web bundlers: webpack, vite, rollup: their purpose, how they work under the hood⬜Docker: image, container, volumes, ENV_VARS, ports⬜Transitive dependencies problems⬜
56
Basic testing: jest, react testing library⬜
57
58
59
60
61
62
This section is additional, it's not calculated in formulaS
63
SecondaryCommon
64
9 Tips in JS You Might Not Know⬜Timezones problem in general, and in JS specifically⬜ASCII, UTF-8 and how encodings work⬜Explain purpose of CI/CD, configure from scratch⬜
65
Regular expressions theory and usage in real life⬜Linux knowledge: terminal, permissions, services, package managers, text editors⬜Git flow and trunk-based development⬜
66
Basic DB: SQL SELECT/JOIN//UNION, concept of INDEX, foreign key⬜CDN concept and problem it solves⬜Complex DB: NoSQL, stored procedures, functions, CAP theorem, materialized view⬜
67
Testing pyramid and "write only useful tests" rule⬜OWASP Top-10 awareness⬜
68
Cryptography basics: public key, HTTPS, digital certificate deploy experience⬜Use cases vs user stories⬜
69
PWA and why it's important⬜
70
71
72
Computer science and architecture
73
Can explain the difference between OOP and FP, cons and pros of each (it's not about React)⬜Formal grammar and BNF as example⬜
74
Database normalization 5 normal forms⬜
75
76
Jedi Techniques
77
Dunning-Krueger effect awareness and self-estimation⬜Touch (blind) typing skill
Type speed at least 40 WPM		⬜Personal workflow automation techniques: scripting, visualizing, presentation skills⬜
78
Always use hotkeys for repeated actions in IDE, editors, slack, browser⬜Time management: mark as unread, schedules messages, personal notifications⬜
79
80
Everything else
81
Knows how to generate digital certificate⬜Can explain good balance between code coverage and maintanability⬜
82
Can plan branches based on a release cycle⬜
83
Knows what is a load balancer and reverse proxy⬜
84
TypeScript AST⬜
85
Token-based auth, JWT token; refresh token strategies⬜
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100