Sujay Kundu

React – Frontend Web Developer Roadmap

Blog post thumbnail with title "React JS Frontend Web Developer Interview Guide"

Hi ! In this articles I am sharing all the resources that you can use to prepare for your React Interviews:

  1. HTML
  2. CSS / Sass
  3. CSS Frameworks
  4. Javascript
  5. Website Optomizations
  6. Typescript
  7. Web Accessibility
  8. React
  9. CSS in JS
  10. Redux
  11. Context API
  12. Webpack
  13. SPA vs SSR vs SSG
  14. Nextjs
  15. API Handling
  16. NFR’s (Non Functional Requirements)
  17. GraphQL
  18. Web Architechtures
  19. Web Vitals
  20. Web Security
  21. SEO
  22. Design Principles
  23. Design Patterns
  24. Design Systems

At last, I am also going to share how to create your Frontend focused resume, to easily get shortlisted.

HTML :

  1. HTML Basics
  2. Semantic HTML
  3. Web Accessibility
  4. HTML5 APIs

CSS/Sass :

CSS Frameworks:

Javascript:

Website Optimizations :

  1. Methods to optimize Website Loading
  2. Web storages
  3. Web components
  4. Caching

Typescript:

  1. Typescript – Installing & using Typescript
  2. Typescript – Using Types
  3. Next Generation Javascript and Typescript

React:

  1. React – A deep dive guide
  2. React vs Angular – A comparison guide
  3. React – DOM and Virtual DOM
  4. React – Lifecycle methods (Class Components)
  5. React – Hooks (Functional Components)
  6. React – Design Patterns & Anti-Patterns

Redux:

Context API:

Webpack:

  1. Getting Started with Webpack in JS Projects
  2. Webpack Configuration (part-1) – Setup HTML Webpack Plugin
  3. Webpack Configuration (part-2) – Code Splitting
  4. Webpack Configuration (part-3) – Setup Babel
  5. Webpack Configuration (part-4) – Setup Typescript

Graphql:

  1. GraphQL – Introduction
  2. Setting up GraphQL with React (Client)
  3. Setting up GraphQL with Node Express (Server)

SPA vs SSR vs SSG:

NextJS:

API Handling:

NFR’s (Non Functional Requirements):

Nodejs (optional – for backend)

Web Architectures:

Web Vitals:

Web Security:

SEO:

Design Principles:

Design Patterns:

Design Systems:

Some useful resources:

ES6 compatability table:

https://compat-table.github.io/compat-table/es6/