From syntax to asynchronous behaviour, modules and tooling: the JavaScript that makes every framework afterwards feel straightforward.
5 stages
5-8 months part time
Framework independent
Realistic timeline
5-8 months at 10-15 hours per week
Stages
5 in order
Mentorship
Details below
The language itself, in depth - the foundation every framework on this site depends on. Work through the stages in order, finish the milestone for each one before moving on, and treat the project ideas as the evidence that a stage is genuinely complete.
Learning order
The stages, in sequence
Each stage assumes the one before it. Skipping ahead is the most common reason people stall.
1
Syntax and the mental model
4-6 weeks
Write correct small programs and understand why they behave as they do.
Skills
Types, coercion and why == and === differ
let, const and block scope
Functions, parameters, defaults and return values
Conditionals, loops and truthiness
Template literals, destructuring, spread and rest
Reading the console and the debugger properly
Milestone
Predict the output of an unfamiliar snippet before running it, and be right most of the time.
Project ideas
Small exercises: FizzBuzz, string manipulation, array statistics
2
Objects, arrays and functions in depth
6-8 weeks
Work fluently with data structures and treat functions as values.
this, call, apply, bind and arrow function behaviour
Prototypes, classes and inheritance
Error handling with try/catch and custom errors
Milestone
Transform a messy nested data structure into the shape a UI needs, using only array methods.
Project ideas
A data-processing script over a JSON file
A tiny state container in fifty lines
3
The browser and the DOM
4-6 weeks
Make a page respond to people without any framework.
Skills
Selecting, creating and updating elements
Events, bubbling and delegation
Forms, validation and the constraint API
Storage: localStorage, sessionStorage and their limits
Performance basics: reflow, repaint, debouncing and throttling
Accessibility of dynamic content: focus, roles, announcements
Milestone
An interactive application with no dependencies that survives a keyboard-only user.
Project ideas
A to-do app with persistence
A modal and menu system built from scratch
4
Asynchronous JavaScript
5-7 weeks
Understand the event loop well enough to reason about order of execution.
Skills
The call stack, task queue and microtask queue
Callbacks, promises and async/await
Promise.all, allSettled, race and when each applies
fetch, request cancellation with AbortController, and timeouts
Error handling across async boundaries
Race conditions and how to avoid them
Milestone
Explain the output order of a snippet mixing setTimeout, a promise and synchronous code.
Project ideas
A search box with debouncing and cancellation
A retrying API client with backoff
5
Modules, tooling and quality
5-7 weeks
Work on JavaScript the way professional teams do.
Skills
ES modules, import/export and circular dependency pitfalls
npm, semantic versioning and lockfiles
Bundlers and what a build step actually does
Testing with Vitest or Jest, including async tests
ESLint and Prettier as a shared standard
TypeScript fundamentals as the natural next step
Milestone
A published npm package or a library with tests, documentation and a changelog.
Project ideas
Extract a utility from an old project and publish it properly
Mentorship
Mentorship Details Coming Soon
If you want to connect, please WhatsApp: 3265503569
One-to-one mentorship for the roadmaps on Fox Is Happy is being set up. Sessions will cover code review, project feedback, interview preparation and a learning plan matched to where you actually are - not where a generic curriculum assumes you are.
Pricing will be reasonable and listed clearly before you book - pay per session, with student-friendly rates planned. No subscriptions and no bundles you do not need.
Register interest
3265503569
WhatsApp only. Message on WhatsApp to register interest and be told first when places open.
Mention JavaScript Developer Roadmap in your message so the reply matches what you are working on.
Resources
Where to learn each part
References worth keeping open, plus the pages here that go deeper.
Why depth in JavaScript pays for itself repeatedly
Frameworks change every few years. The language underneath does not, and every hour spent on it keeps returning value long after a particular library has been replaced.
The parts people skip, and regret skipping
Three topics account for most of the confusion in intermediate JavaScript: closures, the value of this, and the event loop. All three are skippable in the short term, because you can write working code without understanding them. All three become unavoidable the moment something behaves unexpectedly, which in a real project is roughly weekly.
Closures explain why a variable captured in a callback has the value it does. The rules around this explain why a method loses its context when passed as a handler. The event loop explains why your code ran in an order you did not expect. Spend the time once and a whole category of bugs becomes readable.
Reference versus value
Objects and arrays are handled by reference, primitives by value. That single sentence causes more subtle bugs than any other feature of the language. Copying an array with the spread operator produces a new outer array whose contents are still the same references, so a "copy" of nested data is not independent. Understanding this properly is also what makes immutable update patterns in React feel obvious rather than arbitrary.
Common gotchas worth internalising
Expression
Result
Why
0.1 + 0.2 === 0.3
false
Binary floating point cannot represent 0.1 exactly
typeof null
"object"
A bug from 1995 kept for compatibility
[] == false
true
Loose equality coerces both sides - use === instead
[10, 9, 1].sort()
[1, 10, 9]
Default sort compares strings, not numbers
Asynchronous code is where seniority shows
Anyone can await a fetch call. The distinguishing skills are handling the cases around it: cancelling a request that is no longer needed, running independent requests in parallel rather than in sequence, deciding whether one failure should fail the whole operation, and preventing a slow earlier response from overwriting a fast later one. Those four problems appear in every real application and are almost never covered in an introductory tutorial.
How to practise deliberately
1Before running a snippet, write down what you expect. Being wrong is the useful part.
2Rebuild one small library feature yourself - a debounce, a deep clone, a simple event emitter.
3Read the source of a small open source utility and work out why it is written that way.
4Explain a concept out loud or in writing. Gaps become obvious immediately.
5Solve the same problem twice: once imperatively, once with array methods.
Build a debugging habit early
The fastest-improving learners share one habit: they read the error before they search for it. A JavaScript error message names the type of problem, the value involved and the line it happened on, and three quarters of the time that is enough. When it is not, the debugger beats scattered logging - set a breakpoint, step through, and watch the values change rather than guessing at them from the outside. Learning your browser devtools properly takes an afternoon and saves that time back within a week.
When to move on
You are ready for a framework when you can build an interactive application with no dependencies, debug it from the error message rather than by searching, and explain why your code runs in the order it does. That standard is higher than most tutorials imply and much lower than perfection. After that, the React Developer Roadmap is the usual next step, and the Frontend Developer Roadmap places both in a complete skill set. If the server side appeals, Node.js is the shortest transition and the Backend Developer Roadmap covers it.
Frequently asked questions
Should I learn TypeScript instead of JavaScript?
Learn JavaScript first. TypeScript is a type layer on top of it, so without the underlying language you cannot tell which layer an error comes from. Add it once JavaScript feels comfortable.
How do I know when I am ready for a framework?
When you can build an interactive app with no dependencies, debug it from the error message, and explain the execution order of asynchronous code.
