All posts

Learn to code · Projects · Getting started

12 coding projects for beginners — build these.

The single fastest way to learn to code is to build, finish, and ship small things — not to watch one more tutorial. Here are 12 projects ordered from your very first hour to a portfolio that gets you hired, each with what you’ll learn and how to build it the AI-native way.

Deric YeeDeric Yee Updated 10 June 2026 8 min read

I’ve watched hundreds of beginners learn to code, and the ones who make it have one habit in common: they build things. The ones who stall are almost always stuck in “tutorial hell” — endlessly watching, never shipping. Watching feels productive. It isn’t. Skill is built by making decisions and hitting errors, and you only do that when you build.

So here’s the list I’d hand a beginner today, in order. The order matters: each tier unlocks the next. Don’t skip to Tier 3 — and don’t get stuck polishing Tier 1 forever either.

First week — touch real code

Tiny, finishable in a sitting. The goal is momentum, not polish.

  • 1

    A personal profile page

    What you’ll learn: HTML structure, CSS layout, deploying a live URL. Your first “I made this and it’s on the internet” moment.

    AI-native tip: Write the HTML yourself, then ask AI to explain one CSS property you don’t understand — not to generate the whole page.

  • 2

    A tip / bill-split calculator

    What you’ll learn: JavaScript basics: variables, the DOM, click events, simple maths. Interactivity for the first time.

    AI-native tip: Get it working by hand. When stuck, ask AI “why isn’t my event firing?” and read the explanation rather than copy-pasting a fix.

  • 3

    A to-do list

    What you’ll learn: Arrays, adding/removing items, and saving to localStorage so it survives a refresh. The classic for a reason.

    AI-native tip: Build the add/delete logic yourself; use AI only to learn how localStorage works, then implement it from memory.

Building confidence — real features

A week or two each. Now you’re fetching data and modelling information.

  • 4

    A weather app (using a free API)

    What you’ll learn: Calling an API, async/await, handling JSON, and showing loading and error states. The skill behind half of all web work.

    AI-native tip: Read the API docs yourself first. Use AI to demystify async — then explain back to it how your code works to check you actually get it.

  • 5

    An expense tracker

    What you’ll learn: CRUD (create, read, update, delete), modelling data, and rendering a simple chart. Your first “app-shaped” app.

    AI-native tip: Sketch the data shape on paper before coding. Let AI suggest a chart library, but wire the data in yourself.

  • 6

    A quiz app

    What you’ll learn: State, conditional logic, scoring, and moving between “screens.” Great for understanding how UIs change over time.

    AI-native tip: Design the question/answer data structure yourself — that’s the actual learning. AI can help with the timer if you add one.

  • 7

    A markdown notes app

    What you’ll learn: Text input, rendering, and working with a small third-party library. A taste of real tooling.

    AI-native tip: Use AI to understand how a markdown parser works, not to hide it. Being able to explain your dependencies is a hiring signal.

Portfolio-grade — what actually gets you hired

A few weeks each. These are the projects you put at the top of your CV.

  • 8

    A full-stack app with login + a database

    What you’ll learn: Next.js, authentication, a real database (Supabase/Postgres), and deploying it. This is the project most junior interviews are really about.

    AI-native tip: Use AI heavily here — that’s realistic. The bar is that you can explain every decision: why this auth flow, why this table, what each route does.

  • 9

    An AI-powered feature

    What you’ll learn: Calling an LLM API (Claude/OpenAI), prompt design, handling streaming responses. The single most in-demand beginner skill in 2026.

    AI-native tip: Ironically, build the AI feature the disciplined way: understand the API, handle the failure cases, and don’t ship a prompt you can’t reason about.

  • 10

    A product that solves your own problem

    What you’ll learn: Scoping, cutting features, shipping, and getting one real user (you). This teaches more than the previous nine combined.

    AI-native tip: Direct AI like a junior teammate: you decide what to build and review everything it writes. That’s exactly the 2026 job.

  • 11

    A clone of an app you love (one feature deep)

    What you’ll learn: Reading other people’s patterns, reverse-engineering UX, and the humility of “this is harder than it looks.”

    AI-native tip: Pick ONE feature (e.g. just the feed, or just the cart). Use AI to learn the pattern, then rebuild it without looking.

  • 12

    A small contribution to an open-source project

    What you’ll learn: Reading a real codebase, Git/PR workflow, and working to someone else’s standards. The closest thing to a real job before a real job.

    AI-native tip: Use AI to understand the unfamiliar code, then make the smallest useful change. A merged PR is real-world proof.

The honest part: how to do these so they actually count

A project only teaches you something if you struggle with it a little. The most common way beginners waste these is by letting AI write the whole thing — it compiles, it looks done, and nothing stuck. That’s the new tutorial hell. The fix is a simple rule: never ship code you can’t explain. Use AI to learn faster, not to skip the learning. We wrote a whole guide on this: how to learn coding with AI without becoming useless.

The other trap is doing these in a vacuum. Projects teach you to build; they don’t tell you whatto build next, and they don’t review your code. If you want a sequence to follow, our free AI Developer Roadmap lays out the order, and the free 6 Projects in 6 Days crash course is literally the first few projects above, guided.

And if you’re building toward a career: in skills-first markets like Malaysia, this portfolio is your qualification. Two or three of the Tier 3 projects, deployed and explainable, do more for a junior application than any certificate. See how that translates into hiring and pay in how to learn to code in Malaysia and the no-degree path.

FAQ

  • What is a good first coding project for a complete beginner?

    A personal profile page, then a tip/bill-split calculator, then a to-do list — in that order. Each is small enough to finish in a sitting, and together they cover HTML, CSS, JavaScript, the DOM, events, and saving data. Finishing tiny things builds the momentum that finishing tutorials never does.

  • Why are projects better than tutorials for learning to code?

    Tutorials create the illusion of progress — you follow along, it works, and almost none of it sticks (“tutorial hell”). Projects force you to make decisions, hit real errors, and figure things out, which is exactly what builds skill. The rule we drill into our students: watch one tutorial, then build three things without one.

  • Should I use AI to build my beginner projects?

    Yes — but as a tutor and a teammate, not a vending machine. The trap is letting AI write code you can’t read, which feels like learning but isn’t. Build the core logic yourself, use AI to explain what confuses you, and make sure you can explain every line back. By the portfolio tier, using AI heavily is realistic and expected — the bar is that you own and understand the output. We cover this fully in our guide to learning to code with AI.

  • How many projects do I need for a junior developer portfolio?

    Quality over quantity: two or three real, deployed projects beat a dozen tutorial clones. Ideally at least one full-stack app (login + database) and one with an AI-integrated feature. In skills-first markets like Malaysia, a live URL a hiring manager can click and a clear explanation of how you built it outperform any certificate.

  • What coding projects actually help you get a job?

    The Tier 3 ones: a full-stack app with authentication and a database, an AI-powered feature, and a product that solves a real problem. These show you can ship working software and explain your decisions — which is the whole interview. Junior developers in Malaysia start around RM 3,500–6,500/month, and AI-fluent ones closer to RM 6,500–9,000, and the portfolio is what gets you in the room.

Stop watching. Start building.
Six real projects, six days, free.

6 Projects in 6 Days walks you through your first few builds from this list — guided, free, one hour a day. The fastest way to break out of tutorial hell.