Scribd
Upload
100 views

2022 FE Roadmap

This document provides a checklist and roadmap for frontend development. It outlines essential HTML, CSS, and JavaScript concepts. It also covers web fundamentals, BOM & DOM, React, React ecosystem tools, recommended tools, frontend concepts, and a recommended learning roadmap from beginner to advanced levels. The roadmap suggests initially building projects while learning fundamental concepts before progressing to more advanced topics.

Uploaded by

Anil Dange
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
100 views

2022 FE Roadmap

This document provides a checklist and roadmap for frontend development. It outlines essential HTML, CSS, and JavaScript concepts. It also covers web fundamentals, BOM & DOM, React, React ecosystem tools, recommended tools, frontend concepts, and a recommended learning roadmap from beginner to advanced levels. The roadmap suggests initially building projects while learning fundamental concepts before progressing to more advanced topics.

Uploaded by

Anil Dange
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

2022 Frontend Development

Interview Checklist & Roadmap


HTML
Elements + Attribute Web storag
Forms + Input type Images & Multimedi
Imports + META tag iFram
Lists & ancho Canvas & WebG
Table Worker
Events Sematic HTML

CSS
Selectors (basic, complex Shadow
Psuedo selector Colors + Gradient
Specificity & inheritanc Transforms & Transition
Box mode Animation
Typograph Media querie
Positioning, Units, Displa CSS variable
Layouts: Flex, Grid BEM standards

JavaScript
Variables & Primitive “this” keywor
Scopes & Hoistin callbacks + Promis
Operators & type conversion Async awai
Closure Set & Map
Objects + methods & rege Module
Arrays + method Classes & Proxie
Functions & Arrow function ES6+ syntaxe
timeout & interva Prototype
destructuring & spread Iterators & Iterables
Web Fundamentals

HTTP & RES Cookies & Session

Headers & Method CSP, XSS, COR

Polling & Web Socke Cachin

JSON HTTP 2.0

BOM & DOM

Element selector AJAX & fetc

DOM manipulatio Event bubbling & delegatio

Iterating nodelis Event loo

attribute & style modificatio Shadow DO

CRP + CSSOM Browser APIs

React /
Components & JS Component Compositio

Props & Stat React context AP

Hooks & Lifecycle Advanced & Custom hook

Lists & key HOC + Render prop

Forms + Event handlin Portals + Error boundarie

Refs & optimizations Internals & Reconcilation

React Ecosystem

Redu Axio

React route React Q uer

Styled c omponent React i 18 Nex

Material Reac Framer Motio

React hook Form / Formi Jest + React testing librar

Apollo Client + G raph Q L NextJS


Recommended Tools
Editor: Visual Studio Code

Browser: Chrome & Developer tools

Language: TypeScript

Version control: Git

Task runner: npm / yarn

Linter: ESLint

Formatter: Prettier

Bundler: Webpack / ViteJS

Commit hook: Husky

Frontend Concepts
Responsive Web desig Jam stac
Progressive Web App Test driven developmen
Web Component Search Engine Optimizatio
SSR, SSG, IS Web Performanc
Design Pattern Accessibilit
Reactive & Functional programmin Web Securit
Object Oriented programmin User experienc
Micro frontend CI/CD

Good to know
SASS & PostCS Gatsb
Storyboo TailWind / Bootstra
Cypres StencilJS / Li
D3j Electro
Docke Threej
AW Babe
Firebas Web Assembl
Protocol Buffers / gRP NodeJ
RxJS Web 3.0
Recommended Roadmap

HTML5 CSS JavaScript

Beginner web

Fundamentals
build projects while learning

Redux React Git Basics

BOM & DOM Intermediate


build projects while learning

Advanced
React

TypeScript in depth
CSS & JS

Intermediate Web performance &

accessibility
build projects while learning

Never
Design

NextJS
ends... patterns

For frontend Materials click here Created by

This document is a guideline based on personal knowledge & opinions Sadanand Akshay Pai

You might also like