Web developer roadmap: what to learn to become a web developer, and in what order

What a web developer does and where to start

A web developer builds what you see in the browser (frontend), what runs on the server and stores the data (backend), or both (full stack). You do not need to pick a specialty at the start: the foundation is the same, and the first stages of this roadmap serve any of the three paths. What is worth deciding early is the order, because skipping stages is the most common reason people spend months watching tutorials without being able to build anything on their own.

This is the roadmap we would recommend to someone who wants to work on a team like ours, where we build custom software with Angular, Node.js and AWS. The timelines assume about ten hours of study per week. If you have five, double them. If you have twenty, they do not shrink by half, because concepts also need rest days between sessions to settle.

• Frontend: interface, interaction and performance in the browser.
• Backend: APIs, business logic, authentication and databases.
• Full stack: both layers, which is common on small teams.

Stage 1: HTML, CSS and how the web works (4 to 6 weeks)

Start by understanding what happens when you type an address into the browser: an HTTP request, a response from the server and an HTML document the browser turns into a page. With that picture clear, learn semantic HTML (headings, lists, links, forms) and CSS until you can lay out pages with Flexbox and Grid without copying and pasting. Responsive design is not an advanced topic: get used to thinking about small screens first from the very first page you build.

A common mistake here is rushing to JavaScript because HTML and CSS look easy. They are easy to start, but accessibility, well-built forms and CSS that does not break when content is added are skills that show in a technical interview and in day-to-day work.

• Your personal page with a projects section you will keep updating.
• A copy of the home page of a site you use, with HTML and CSS only.
• An accessible contact form that works with the keyboard alone.

Stage 2: modern JavaScript and Git (8 to 10 weeks)

This is the longest stage and the one that pays off the most later. Learn variables, functions, arrays and objects, but spend real time on what usually stays weak: working with the DOM, events, promises with async/await and consuming an API with fetch. If you understand why an async function returns a promise, you will diagnose in minutes errors that take other people an afternoon.

In parallel, learn Git from day one: creating a repository, making small commits with clear messages, working with branches and pushing your code to GitHub. Git is also your visible work history. A profile with steady commits over months says more about you than a list of certificates.

• A to-do list that stores its data in the browser.
• A search page that queries a public API and handles network errors.
• A simple game, such as hangman, to practise state and events.

Stage 3: TypeScript and a frontend framework (6 to 8 weeks)

Once JavaScript no longer holds you back, add TypeScript. In professional projects almost all new frontend code is written with types, and learning them before the framework makes the error messages make sense. Then pick a single framework and stay with it until you build something complete: React, Angular and Vue solve the same problem in different ways.

At TintoDev we use Angular for large business applications because it enforces a structure the whole team follows, and React shows up in more job listings. Either one is a good choice. What does not work is switching frameworks every time one gets hard: components, state, routing and forms are shared concepts, and you only really learn them by sticking with one.

• Rebuild the search page from the previous stage with components and routes.
• A dashboard with a mock login, lists, filters and validated forms.

Stage 4: backend with Node.js and databases (8 to 10 weeks)

With Node.js you use the same language on the server, which lowers the mental load at the start. Learn to build a REST API with routes, data validation, error handling and token-based authentication. Also understand what happens around the code: environment variables, HTTP status codes and why passwords are never stored in plain text.

The database deserves its own time. Start with a relational one such as PostgreSQL and learn plain SQL before using an ORM: filtered queries, joins, indexes and transactions. An ORM saves you from writing queries, but if you do not know which query it generates, you will not understand why your application slows down as the table grows.

• An API for your to-do list, with users and authentication.
• A link shortener that counts visits and stores them in PostgreSQL.

Stage 5: deployment and portfolio (3 to 4 weeks)

An application that only runs on your computer does not count as a finished project. Learn to deploy the frontend and the backend to a cloud service, set up a domain and read the logs when something fails in production. With the basics of Docker and a provider such as AWS, you already have an edge over many people who are starting out.

For your portfolio, less is more: two or three complete, published projects, each with a README explaining what problem it solves, which decisions you made and what you would do differently. Whoever reviews your profile usually opens one or two links. That they work and that the code is tidy matters more than how many there are.

Common mistakes when learning web development

The mistake we see most is collecting courses without building anything of your own. A course shows you how to solve a problem the instructor already solved; your own project forces you to make decisions, look things up in the documentation and get things wrong. For every course you finish, build something that is not in its syllabus.

AI assistants are useful for explaining an error or suggesting alternatives, and our team uses them every day. The problem starts when they write the code and you just paste it: you move fast for a few weeks and then cannot debug anything. Use them as someone who explains, not as someone who writes for you.

• Jumping into a framework without a solid grasp of JavaScript.
• Learning three frameworks superficially instead of one in depth.
• Leaving Git and deployment for the end.
• Waiting until you feel ready before showing your work.

How to choose a course for each stage

For each stage, look for a course updated within the last year or two, with a syllabus that includes projects and not only theory, and watch the free preview to check whether the instructor pace suits you. In the reviews, read the recent ones: they are the ones that tell you whether the content still holds up. At TintoDev Academy we group courses by category with that same criterion.

You do not need a course for every topic. The MDN documentation for HTML, CSS and JavaScript is excellent and free, and the official React, Angular and Node.js guides keep up with every release. A course gives you structure and guided projects; documentation gives you precision. Combining both is what works best.

Where the courses are

Frequently asked questions

How long does it take to become a web developer?

With about ten hours of study per week, completing this roadmap usually takes six to twelve months. It depends a lot on how much you practise outside the courses and on whether you already coded before. Landing a first job can take longer, because the local market and your portfolio also play a part.

Do I need a university degree to become a web developer?

Many software companies do not require one, although some do. What carries the most weight in a technical interview is showing that you can build: published projects, tidy code and the ability to explain your decisions.

Is it better to start with frontend or backend?

Start with frontend, because you see results immediately and that helps you stay consistent. The JavaScript you learn there carries over to the backend with Node.js. If you later find you prefer data and APIs, you can specialise without having wasted time.

React or Angular for a first job?

Either one works if you master it in depth. React shows up in more job listings, and Angular is common in companies with large business applications. At TintoDev we use Angular and recommend it for projects with large teams.

Can I learn web development with online courses alone?

Yes, as long as you build your own projects on top of following the courses. Courses give you structure and the official documentation fills in the details. What no course replaces is facing a problem without a guided solution and solving it.