As a Junior Frontend Engineer, I struggled so much to find out what things I should learn first. I believe there are many engineers who are dealing with the same problem. Recently, I was mentoring some junior engineers) in my current workplace.

I prepared this topic-wise roadmap for them. But I thought to share it with everyone. Maybe it’ll help someone struggling with proper guidelines.

JS Basic

• Data Types
• Variables
• Constant
• Conditions
• Loop
• Objects
• Arrays
• Functions

JS Object

• Objects & This (call by value, call by reference)
• Methods of object
• Implement built-in methods of js object by yourself

JS Array

• Arrays (Queue, Stack) (call by value, call by reference)
• Methods of Arrays
• Implement built-in methods of js array by yourself

JS Function

• Function & Arrow Function & this (call by value, call by reference, modules)
• Methods of Function
• Implement built-in methods of js function by yourself

ECMAScript

• What is ECMAScript (https://tc39.es/ecma262/)
• ES6
• Implement ES6 features by yourself

Object-Oriented JS (OOJS)

• Prototypes
• Prototypical inheritance
• Prototypes Chain
• Classes
• Constructor
• Super
• Access Modifiers (Private, Protected, Public)
• Getter
• Setter
• Inheritance

Dealing with Network Calls

• API
• HTTP Methods
• API Status Codes
• Ajax
• XMLHttpRequest Object
• Request object
• Response
• Fetch API
  • Headers
  • Request
  • Response
• JSON Web Token (JWT)
• Workflow of JWT

Asynchronous Javascript

• Callback
• Problems with callback
• Promise
• Problems with Promise
• Methods of Promise
• Async-await
• Problems with Promise
• Error Handling (try … catch … finally)
• Throttle
• Debounce
• CORS

Javascript Compilation Flow

• JS is Single-threaded asynchronous and How
• How does JS compile things
• Hoisting
• Closure
• Event loop
• setTimeout
• setInterval

Web storage used in JS

• Session storage
• Methods of Session storage
• Local storage
• Methods of Local storage
• Cookies
• Methods of Cookies
• Indexdb
• Methods of Indexdb

HTML & DOM Manipulation

• Basic HTML Elements
• DOM Events of these elements
• Semantic HTML
• JS Custom Events with HTML Dom events
• Server-sent event (SSE)

Best Coding Practices

• JS Best Practices (https://github.com/airbnb/javascript)
• HTML Best Practices (https://google.github.io/styleguide/htmlcssguide.html)

Advance Concepts

• Web worker
• Methods and properties of Web worker
• Websocket
• Methods and properties of Web socket
• Regex
• JSON

A Spoiler

I am thinking to write articles on each of the topics I’ve given above. I’ll try to use proper illustrations and demonstrations to explain them. Stay tuned 😊