Lessons · Coding · beginner · Programming with Mosh

Claude Code Tutorial - Build Apps 10x Faster with AI

The video “Claude Code Tutorial - Build Apps 10x Faster with AI” by Programming with Mosh as 8 lessons, with the idea explained, the code from the screen, steps to try in the practice terminal, practice problems with solutions and a quiz that leads back to the moment.

8lessons
5pieces of code
16exercises
21questions
58min of video
Open the lessons →Lesson 1 is free · Beyond Pass opens all
Claude Code Tutorial - Build Apps 10x Faster with AI, video by Programming with Mosh▶ 58:10 · Programming with Mosh
12345678
0:008 lessons across the whole video58:10

You will be able to

  • Install and log in to Claude Code in a terminal
  • Start a Claude Code session inside a project folder and give it clear build instructions
  • Review, run, and approve the files and commands Claude Code produces
  • Use a CLAUDE.md file and plan mode to guide Claude Code on larger changes
  • Find and fix bugs by pasting error output back into a Claude Code session
  • Build a small working app end to end with AI assistance

Good to know first

  • Basic command line navigation (cd, ls, running commands)
  • A code editor and a working install of Node.js or Python
  • A Claude account or API key

Syllabus

8 lessons and a final project

  1. 1

    What Claude Code is and how it works Free

    0:00–4:004 min of video

    Claude Code is an AI coding assistant that works inside your project folder: it reads your code, edits files, and runs commands on your behalf. This lesson introduces what it is, what you need before starting, and the basic loop of asking, reviewing, and building.

    2 exercises3 questions
  2. 2

    Installing Claude Code and logging in Beyond Pass

    4:00–10:006 min of video

    This lesson shows how Claude Code is an AI coding assistant you run from your terminal, and how it is installed and logged in before you start a project. You will see what the first session looks like so you know what to expect.

    4 build steps2 exercises3 questions
  3. 3

    Starting your first session in a project folder Beyond Pass

    10:00–16:407 min of video

    You will learn how to start Claude Code inside a project folder so it works on your real files. You will see what the first screen shows and how to give it a first request.

  4. 4

    Building your first app from a prompt with Claude Code Beyond Pass

    16:40–26:4010 min of video

    You will clone a starter project, open it in VS Code, and ask Claude Code in the terminal to run the app for you. You will see how Claude Code reads your project, asks permission before running commands, and starts a local development server.

    1 code7 build steps2 exercises3 questions
  5. 5

    Reviewing diffs, approving commands, and running the app Beyond Pass

    26:40–35:008 min of video

    You learn how to read what Claude Code wants to do before you approve it, how to have it commit its own work with git, and how to write a clear, specific prompt to fix a bug and then check the result in the browser. The video shows this on a small expense tracker built with React and Vite.

    2 code5 build steps3 exercises3 questions
  6. 6

    Guiding Claude with CLAUDE.md and Plan Mode Beyond Pass

    35:00–43:208 min of video

    You will learn how a CLAUDE.md file gives Claude Code a standing map of your project, so it stops guessing about structure and conventions. You will also learn plan mode, which makes Claude think and propose a plan before it edits any files.

    4 build steps2 exercises3 questions
  7. 7

    Debugging errors and adding features with Claude Code Beyond Pass

    43:20–51:408 min of video

    You will see how Claude Code turns a feature request into a plan, edits several files to add a Delete button, and how to check the result in the browser. You will also learn to read a diff and use /context to see how full the assistant's memory is.

    2 code5 build steps3 exercises3 questions
  8. 8

    Wrap-up: cost, usage, and next steps with Claude Code Beyond Pass

    51:40–58:107 min of video

    This closing chapter shows how to keep an eye on what Claude Code costs and how much you use it, and how MCP servers connect Claude to outside tools like GitHub. It ends with tips for using Claude Code well and where to go next.

    2 exercises3 questions

Final project

Ship a Small Feature with Claude Code

Take a small React and Vite expense tracker and use Claude Code to run it, document it, plan a new feature, fix a bug and commit the work. The project shows the full loop: ask, review, approve, test and save.

Its 7 tasks open with Beyond Pass.

Free preview · Lesson 1 in full

What Claude Code is and how it works

Claude Code is an AI coding assistant that works inside your project folder: it reads your code, edits files, and runs commands on your behalf. This lesson introduces what it is, what you need before starting, and the basic loop of asking, reviewing, and building.

0:00 to 4:00 in the video

Scratchpad

Draw and write next to the video.

The idea

Claude Code is an AI assistant that helps you build software. Unlike a chat window where you copy and paste code back and forth, Claude Code lives in your project. It can look at the files you already have, create new ones, change existing ones, and run commands such as installing packages or starting a server. You describe what you want in plain language, and it does the typing.

The video opens with a small, realistic example. A helpdesk app has a ticket about a PDF export that cuts off the right side of a table. Without an AI tool, a developer would find the export code, read it, change it, and test it. With Claude Code, you point it at the problem and it works through the same steps: find the relevant code, propose a fix, make the change, and let you check the result.

The chapter also makes clear who this course is for. Mosh lists the prerequisites: at least three months of React experience, JavaScript and TypeScript, HTML and CSS, components, state, props and hooks, working with APIs, and Express (helpful but not required). Claude Code speeds up building, but it does not replace understanding. You still need to read what it produces and judge whether it is right.

The video also addresses hype. Online you will see claims like 'Next.js is garbage' or that AI makes developers obsolete. The honest view is in between: Claude Code is a powerful tool that saves a lot of time on routine work, but the person directing it must know what good code looks like. Mosh's promise is that the tutorial will show you how to use it well, not that it will do everything for you.

Key points

  • Claude Code works inside your project folder: it reads files, edits them, and runs commands for you. 0:45
  • You describe the goal in plain language; Claude Code finds the relevant code and proposes changes. 1:01
  • The helpdesk example shows the workflow: locate the problem, make the fix, then test it yourself. 1:01
  • You need solid React, JavaScript or TypeScript, and component knowledge to judge the output. 3:20
  • Claude Code speeds up building but you must still review and understand the code it writes. 2:41

Practice

Explain Solution checked

In your own words, explain why Claude Code still needs a skilled developer to review its work.

Solution
  1. Claude Code writes code quickly, but it can make mistakes or pick an approach that does not fit your project.
  2. A developer who understands React and JavaScript can read the proposed change, test it, and decide whether to accept it.
  3. So the human judges the result, while the AI handles the routine typing and searching.

Claude Code can produce wrong or poorly fitting code, so a developer must read, test and judge its output; the AI saves time but does not replace understanding.

Do it Solution checked

Write down the three steps the helpdesk example follows: find, fix, check. Then, for a bug of your own choice, write the same three steps in one sentence each.

Solution
  1. Find: locate the code related to the problem.
  2. Fix: describe the change you want and let Claude Code propose and make it.
  3. Check: run the app and confirm the bug is gone.

Find the relevant code, make the fix, then check the result yourself.

On your scratchpad

Draw three boxes labelled Your project, Claude Code, and You. Draw arrows showing that you describe the goal, Claude Code reads and edits files, and you check the result.

Quiz

  1. What is the main difference between Claude Code and a plain chat window?

    1. It only answers questions about React
    2. It works inside your project folder, reading and editing files and running commands
    3. It replaces the need to write any code ever
    4. It runs only on web browsers without a terminal
    Show the answer

    B. It works inside your project folder, reading and editing files and running commands · Claude Code acts on your project directly: it reads files, edits them and runs commands, instead of you copying code back and forth.

    0:20 watch the moment

  2. In the helpdesk example, what is the bug the ticket describes?

    1. The login page does not load
    2. PDF export cuts off the rightmost columns of tables
    3. Replies are sent to the wrong email
    4. The dashboard shows no data
    Show the answer

    B. PDF export cuts off the rightmost columns of tables · The ticket title is 'PDF export cutting off right side of tables' and the body says the rightmost columns are cut off on every page.

    1:01 watch the moment

  3. Which prerequisite does Mosh say is helpful but not required?

    1. React experience
    2. TypeScript
    3. Express
    4. Hooks
    Show the answer

    C. Express · The prerequisites slide marks Express as helpful but not required.

    3:20 watch the moment

Open lesson 1, with the video →

Lessons 2–8 and the final project

They open with Beyond Pass: every lesson of every course, in full. One payment: $14.99 for 90 days or $29 for a year. No subscription.

Get Beyond Pass →Start lesson 1 free

Made by Beyond from the video “Claude Code Tutorial - Build Apps 10x Faster with AI” by Programming with Mosh. The video plays in YouTube's own player. Watch it on YouTube · All lessons