Before starting your coding journey I suggest it is best you learn how version control tools work.
The purpose of a version control system is to store and keep track of your code to ensure reverting back to previous versions if the current source code does not function as expected.
It also ensures easy collaboration among developers.
Open-source version control software tools such as GuitHub or GitLab will not only assist you in landing a job in the future but will also document your coding journey from the very beginning.
This should be done in conjunction with learning HTML so you have files to store on GitHub.
Most of the time you will hardly ever use that HTML element or CSS property in the future so why spend hours trying to memorize them.
Just make sure you go over the fundamentals.
Do not just read over it or watch tutorials explaining concepts but you should also understand the content.
Programming also involves consistent practice.
Nevertheless, when going over HTML make sure you familiarize yourself with HTML semantic tags, attributes associated with these tags and values that apply to them.
Before starting with Cascading Style Sheets (CSS) it is important for you to understand the concept of responsive web design.
Responsive web design not only ensures your website looks good across all devices but is also one of the main ranking factors used by Google in their search results.
Therefore, it is of utmost importance you familiarize yourself with media queries, box-model, flexbox and grid layouts.
Ideally, I would suggest going over flexbox and grid layouts before other CSS properties such as HTML element transformations, transitions or positioning because outlining the layout of your website at the start sets the tone for the rest of your project.
CSS Framework (optional)
Learning a CSS framework allows making beautifully styled websites much quicker than custom styles and easier.
I would suggest you go over at least two frameworks to deduce which frameworks classes you understand and best suits your coding practices.
Bootstrap and Tailwind CSS are good shouts in my opinion.
This ensures that you have a high-level overview of the programming languages and topics usually encountered in that specific programming language.
TIP: Familiarize yourself with ES6 features such as variable declarations, template literals, arrow functions, object destructuring, classes as well as promises.
TIP: Make sure you do not fall into the trap of "tutorial hell".
Building projects are the best way to put what you've learned into practice.
Finally, just like CSS frameworks, jQuery is another optional library to learn in your web development journey.
Once you have gone over all these technologies then learning and building projects in React JS will sure be a breeze.
I am aware the roadmap might not be suit all developers since version control systems could be overwhelming at the start of your coding journey or even learning grid layouts and flexbox before going over other CSS properties.
However, I can assure you it would benefit you in the tech space if you focus on key concepts because time is your most valuable resource in this industry.