Learn to code from zero: a free step-by-step roadmap

The biggest beginner mistake is starting many courses at once and finishing none. The fix is a clear map: finish each step, then move to the next. Every course here is free, and the links are in the buttons below, in the same order.

Step 1: HTML and CSS HTML builds the structure of a page: headings, images, buttons, forms. CSS gives it the look: colors, spacing, fonts, and making it work on phones. Course: Responsive Web Design by freeCodeCamp, with a free certificate. Reference: MDN. Project: a personal page about you that works on mobile. You are done when you can rebuild a page of a site you like without copying code.

Step 2: JavaScript This is what makes a site think and react: a button that opens a menu, a form that checks its data, a page that loads data without a refresh. It is the most important step, do not rush it. Course: JavaScript by freeCodeCamp. Reference: javascript.info. Projects: a calculator, a small game, and a weather page that reads from an API. You are done when you understand functions, arrays and objects, and can fetch and show data from an API.

Step 3: Git and GitHub Git saves every version of your work, so when something breaks you go back. GitHub is your portfolio, the first thing a company opens. Course: GitHub Skills, interactive exercises inside GitHub. Reference: the free Pro Git book. Project: push all your projects to GitHub and publish your personal page on GitHub Pages.

Step 4: Choose your path Like design and visuals: Frontend with React. Like logic and data: Backend with Node or Python. Pick one and stick with it. Frontend: Full Stack Open from the University of Helsinki, or the official react.dev tutorial. Backend: The Odin Project's Full Stack JavaScript path for Node, or Harvard's CS50 Python. Detailed maps for each path are on roadmap.sh.

Step 5: Real projects Not a To-Do list. Something people can actually use: a small store, a dashboard, or a bot that solves a problem. Three projects like these matter more than any certificate. Need ideas with ready designs? Frontend Mentor has free challenges.

3 mistakes to avoid 1. Watching courses without typing the code yourself. 2. Copying code without understanding each line. 3. Waiting until you feel "ready" to build. Start a small project in week one.