United States · Grades 8 to 12 · Code.org App Lab

Code.org App Lab help: fixing events, variables and screens

App Lab is where a lot of American students build their first real app: a quiz, a pet poll, a game with a timer, often as part of AP Computer Science Principles. It is friendly, it runs in the browser, and it lets you switch between blocks and JavaScript text. It also has a few rules that are easy to miss, and when one is broken the app does not crash with a clear message. A button simply does nothing, a score stays stuck at 1, or a total of 10 plus 5 comes out as 105. Every one of these has an explanation in the official App Lab documentation, and this page walks through them with small examples of our own.

Live teaching since 2020 · 10,000+ students · JavaScript and AP CSP

In short

Most App Lab bugs break one of four documented rules: an onEvent must come after the element it listens to, with an id typed exactly; variables that must keep their value are created once with var at the top, never inside onEvent; getText returns text, so use getNumber for arithmetic; and data callbacks finish later, so never put them in a loop. Modern Age Coders teaches this live online for US students, in a batch or one to one, and the first class is free.

Learn it with a teacher

Three courses for students building apps in App Lab

Each is taught live, starting from the app your student already has open.

What App Lab is

App Lab at a glance, from its own pages

Before fixing anything, it helps to know what App Lab is designed for and what it expects of the device you use. This is what its makers publish.

App Lab facts, from code.org/en-US/tools/app-lab and the App Lab documentation (read 17 October 2026)
PointWhat the page says
What it isApp Lab “is a programming environment where you can make simple apps right in the browser.”
LanguageJavaScript, written “with either blocks or text”
Ages listed13 to 18, level Beginner
Devices listedLaptop, Chromebook, Tablet; all modern browsers
Device advice in the editor“App Lab works best on a desktop or laptop computer with a mouse and keyboard.”
Courses that use itIntro to App Lab (grades 8 to 12) and Computer Science Principles (grades 9 to 12)

Code.org or CodeAI?

If the site looks different from what your teacher showed you, that is not your imagination. The footer of the App Lab page, read on 17 October 2026, says the organization is now CodeAI and that "Code.org" is a former trademark of CodeAI.

App Lab itself still lives at studio.code.org, your projects are where they were, and the documentation pages still carry the familiar function names. We use the name Code.org here because that is what students search for.

What language is App Lab?

It is JavaScript. The blocks are a visual way of writing the same JavaScript, and you can switch between the two views. That is why the skills transfer: an onEvent block is the same idea as an event listener on any website.

It also explains some surprises. JavaScript happily adds text and numbers together by joining them, which is the cause of one of the commonest App Lab bugs, covered below.

Sources: App Lab tool page and App Lab documentation, read 17 October 2026. Code.org’s support site returned an access error to our request, so no help-desk article is quoted here. We are not connected with Code.org or CodeAI.

Find your symptom

What your app is doing, and the documented reason

App Lab rarely stops with a red error for these bugs. It just behaves strangely. Match the behavior to a row, then read the rule behind it.

App Lab symptoms and the rule behind each, from the App Lab documentation (read 17 October 2026)
What you seeThe rule the docs giveWhat to check
Clicking a button does nothingThe UI element must be defined in your code before the matching onEvent() event handlerThe element exists first, and the id in onEvent matches it exactly
An id is rejected or never matchesAn id must begin with a letter, contain no spaces, and may contain letters, digits, - and _Rename ids like my button or 2ndScreen
A score or counter stays at 1Create variables once, at the top, outside any function or onEventRemove var from inside the handler
10 plus 5 shows 105getText returns a string; with a number, arithmetic will not be possibleUse getNumber for numeric input
A screen’s buttons do nothing after switching screensOnly one screen can be visible at a time, and each has its own elementsCall setScreen with the right screen id; the default is screen1
A sound will not playThe sound URL requires the full http:// prefixUse a complete URL, or upload the file and pick it with Choose
Data from a table arrives late or out of ordercreateRecord and readRecords have callbacks and will not finish immediatelyUse the data inside the callback; never put these calls in a loop
A warning that event is defined but not calledThe documentation says you can ignore itNothing to fix

Where things go in the code

The onEvent documentation suggests an order for every program: screen elements at the top, event handlers in the middle, other code and functions at the end. Following it prevents the first two rows of the table almost by itself.

If you build the screen in Design Mode, the elements already exist when the code runs, and the id dropdown in the onEvent block lists them, which removes typing mistakes.

Tables are per app

The createRecord documentation adds a detail that confuses students sharing projects: data is only accessible to the app that created the table. A second app, even one you made yourself, cannot read it. To look at what your app has stored, the docs point to the View data button.

Column names matter too. The docs say the object property names must match the table’s column names, and that both are case sensitive, so score and Score are different columns.

Sources: App Lab documentation for onEvent, getNumber, setScreen, playSound and createRecord, read 17 October 2026.

Variables and events

Why your score keeps resetting: var inside onEvent

This is the App Lab bug teachers see most, and the documentation has a page devoted to it. Here is the bug in a few lines, then the fix.

The bug: a new variable on every clickjavascript
// ours: a score that never climbs past 1
onEvent("addButton", "click", function() {
  var score = 0;            // a new local score, every click
  score = score + 1;
  setText("scoreLabel", score);
});

// our check, with stand-in functions in Node:
// click 1: scoreLabel shows 1
// click 2: scoreLabel shows 1
// click 3: scoreLabel shows 1

Ours. We checked the logic in Node 22 with stand-in versions of onEvent and setText that behave as the documentation describes; this was not a run inside App Lab. Each click creates a brand-new local score set to 0, adds 1, and throws it away.

The fix: create it once, outsidejavascript
// ours: the counter pattern, variable created once
var score = 0;              // global: created once, at the top

onEvent("addButton", "click", function() {
  score = score + 1;        // no var here
  setText("scoreLabel", score);
});

// click 1: 1   click 2: 2   click 3: 3

Ours, same check. This is the shape the documentation calls the counter pattern with an event: the variable gets its first value once, and each event updates it.

What the documentation says

The App Lab concept page on variable scope gives three rules: use var only once, create your variables at the top of your program, and create them outside any function or onEvent block.

It describes the broken version exactly: although it looks like one variable, there are actually two, one local and one global, both named count, and changing one has no effect on the other.

The habit that prevents it

The documentation’s updateScreen pattern helps here too: keep the app’s state in global variables, have every event handler change those variables, then call one function, updateScreen, that redraws everything from them.

Students who adopt that shape write handlers that are three lines long and almost never have this bug again.

Text that looks like a numberjavascript
// ours: the user types 10 into priceInput
var a = getText("priceInput") + 5;     // "10" + 5
console.log(a);                        // 105

var b = getNumber("priceInput") + 5;   // 10 + 5
console.log(b);                        // 15

Ours, same check in Node. The getNumber documentation warns that getText can read a text input too, but a number will be converted to a string and arithmetic will not be possible with the result. The console.log page gives the same lesson: "5" + "3" displays 53.

Sources: App Lab concepts, Debugging Variable Scope: Functions, Counter Patterns with Event and The updateScreen() Pattern; console.log. All read 17 October 2026.

Debugging routine

An eight-step routine for an App Lab app that misbehaves

Our order, built on the documentation’s rules. It moves from the cheapest checks to the ones that take longer.

  1. Say what should happen. One sentence: “When I click Next, the question should change.” If you cannot say it, the bug may be in the plan, not the code.
  2. Check the ids. Compare the id in Design Mode with the one in your code, letter by letter. The docs say ids are a letter first, no spaces, then letters, digits, hyphens or underscores.
  3. Check the order. Every element must exist before its onEvent. Elements at the top, handlers in the middle, functions at the end.
  4. Add console.log lines. The documentation calls console.log a debugging tool, and notes the user of your app will not see its messages. Log a short message when each handler runs.
  5. Print the variables you care about. Log the value right after you change it. A value that is always the same points at var inside a handler.
  6. Check the type. If a sum looks like two numbers stuck together, you used getText where you needed getNumber.
  7. Check the screen. If buttons stop working after a screen change, confirm setScreen used the right id and that the element belongs to the screen now showing.
  8. Check the timing. For data and timers, move the code that uses the result inside the callback. The docs warn that a loop will not wait for a callback, or for a timer, to finish.
App Lab variable naming rules, from the documentation (read 17 October 2026)
RuleBreaks itFollows it
Labels cannot include spaceswidth of rectanglewidthOfRectangle
Labels cannot begin with a number2morrowtomorrow2
Labels are case-sensitivesize and Size used as one variablesize used everywhere
Be consistentMixing camelCase and underscoresOne style throughout

The same routine works in any language with events, which is why it is the first thing we teach in JavaScript basics. For a wider method that also covers languages without events, see how to debug code.

AP Computer Science Principles

App Lab and the AP CSP Create performance task

Many AP Computer Science Principles classes build the Create performance task in App Lab. College Board’s rules for that task are strict, and every App Lab student in an AP class should know them.

AP CSP exam and Create task facts, from AP Central and the AP CSP Course and Exam Description (read 17 October 2026)
PointWhat College Board says
Create task deadlineFri, Apr 30, 2027, 11:59 PM ET, submitted as final in the AP Digital Portfolio
End-of-course examFri, May 14, 2027, in the Bluebook app
Section I70 multiple-choice questions, 120 minutes, 70% of score
Section IIThe Create task and two written responses, 30% of score; 9 hours of in-class time for the task
Errors on the examWritten Response 2(b), Errors and Testing, includes CRD-2.I.a: Identify the error, and CRD-2.I.b: Correct the error
PlagiarismUsing code or media created by someone else or with generative AI tools, without acknowledgment, scores 0 on the Create task, including the written responses
Generative AIPermitted as supplementary resources for understanding coding principles, assisting in code development, and debugging; the student must review, understand and be able to explain any such code

Why debugging your own App Lab code matters for the exam

On exam day, students answer written questions about the code in their own Personalized Project Reference, including identifying and correcting an error. A student who fixed their own App Lab bugs during the 9 hours can answer those from experience.

A student whose code was fixed by someone else has nothing to draw on. That is the practical reason, beyond the rules, to do your own debugging.

What we will and will not do

We never write, fix or review a student’s Create task code, and we do not provide answers to any graded App Lab assignment. In class we teach the concepts with separate examples of our own, like the ones on this page, so the work stays the student’s.

We also do not point under-18 students to general AI chatbots whose terms are for adults. If a school allows AI help under College Board’s policy, that is between the student, the teacher and the tool’s own age rules.

Sources: AP Computer Science Principles Exam and the AP CSP Course and Exam Description (Guidelines for Completing the Performance Task), read 17 October 2026. AP is a trademark of College Board, which is not connected with us. For course choices, see AP CSP or AP CSA first.

From blocks to builder

Four stages of an App Lab student

Where students usually are when they first get stuck, and where they can head next.

Stages of building in App Lab (ours)
StageWhat it looks like
1. DesigningPlaces buttons and labels in Design Mode, little code yet
2. ReactingWrites onEvent handlers that change text on screen
3. RememberingKeeps state in global variables and updates the screen from them
4. StructuringUses functions, lists and stored data, and debugs with console.log

For parents

An app that misbehaves without an error message is genuinely harder to fix than one that crashes. Being stuck here is normal.

Ask your child what the app should do and what it does instead. That gap is where the bug is.

For students

Put var at the top, once. It fixes more App Lab bugs than anything else.

Log first, guess later. One console.log line beats ten minutes of staring.

The catalogue

Nine courses for students who like making apps

Live, with one regular teacher, and in a group or one to one: whichever suits the student.

I

Web and apps

Teens

COAL / WEB / 01

JavaScript for teens

The language beneath App Lab.

Open the syllabus

COAL / WEB / 02

App development for teens

Real phone apps with React Native.

Open the syllabus

COAL / WEB / 03

HTML and CSS

Pages that look the way you designed.

Open the syllabus
II

AP and beyond

High school

COAL / AP / 01

AP Computer Science Principles

The course App Lab often belongs to.

Open the syllabus

COAL / AP / 02

AP Computer Science A

The Java AP course that follows.

Open the syllabus
III

Starting younger

Ages 6 to 12

COAL / KID / 01

App making for kids

Apps from blocks, before text.

Open the syllabus

COAL / KID / 03

Web development for kids

First websites, step by step.

Open the syllabus

How lessons run

Live lessons around a US school schedule

Weekdays or weekends, flexible: choose your batch, or for a very personalised plan choose 1-on-1 at your convenience, weekend mornings or weekdays.

Weekdays

After-school slots across Eastern to Pacific time.

Weekends

For students who prefer a quiet weekly hour.

1-on-1

Planned around project and exam dates.

A regular teacher

One person who knows your progress.

Screen sharing

Your App Lab project, seen live.

Concepts first

We teach with examples of our own.

Create task stays yours

We never touch graded code.

Online, any state

From home, wherever you live.

Batch or one to one

Fifteen to twenty, or just one student.

Student work

Apps and games by our students

Built by learners who began with buttons and events too. The student labs page has more.

NutriLife AI nutrition coach project screenshot

AI and ML

NutriLife

An AI nutrition coach that reads what you eat and works you toward a target.

by Bhavya · Open it

Misti AI chatbot for maths and coding screenshot

AI and ML

Misti

A chatbot that answers mathematics and programming questions, built and deployed by a student.

by Harshit · Open it

GuardianX AI internet safety assistant screenshot

AI and ML

GuardianX

An assistant that helps a young person recognise unsafe situations online.

by Vivaan · Open it

SkyCast weather forecast application screenshot

Web app

SkyCast

A weather forecasting site with live conditions for any location.

by Krish

Fees

Fees

App Lab is free to use, and our lessons are a separate choice. Teaching is paid one month at a time, with the fee shown in US dollars, no term contract, and nothing to pay for stopping once a month is done.

Free first class

USD 0

no card required

  • A free first lesson
  • Show us the app you are building
  • No card details
Book it

Group batch

USD 100

a month, billed in US dollars

  • Fifteen to twenty learners
  • A regular teacher
  • Choose your batch
  • Month by month
Start here

One to one

USD 150

a month, billed in US dollars

  • Private lessons
  • At times you pick
  • Shaped around your class
Enquire

What families say

Rated 4.9 across 547 Google reviews

Families in their own words, exactly as posted on Google.

★★★★★

"The one step solution for my son. Modern Age Coders make learning coding so simple that kids love it. The teachers explain complex concepts clearly with practical exercises and interactive content."

Ria Mukherjee

Parent

★★★★★

"Modern Age Coders has been a game-changer for me. I struggled to grasp IT concepts and coding before joining, but their classes transformed everything. I can now confidently write complex programs with ease."

Samriddha Mondal

Student

★★★★★

"One of the most wonderful education centres out there. Education is not limited to school syllabus but focuses on skill development."

Vansh Agarwal

Student

★★★★★

"My child Dhairya is really enjoying the Modern Age Coders classes. This is his first online class and he eagerly looks forward to it. I can already see his improvement, and the teachers are very cooperative."

Sonam Oswal

Parent of Dhairya

★★★★★

"Modern Age Coders have wonderful teachers who teach in a clear, easy and practical way. The teacher boosts students' confidence and inspires them to learn without hesitation."

Sonu Goyal

Parent

★★★★★

"I highly recommend this computer coding class! The teachers are incredibly knowledgeable and passionate about coding."

Ritu Kedia

Parent

Questions from students

App Lab help: common questions

Why does my App Lab button not do anything?

The App Lab documentation says the UI element must be defined in your code before its onEvent handler, and the id must match exactly. Check the id letter by letter against Design Mode, and make sure the handler comes after the element.

Why does my App Lab score stay at 1?

Usually because var score = 0 is inside the onEvent handler, which creates a new variable on every click. The App Lab documentation says to use var only once, at the top of the program, outside any function or onEvent.

Why does App Lab add 10 and 5 to get 105?

getText returns text, so the plus sign joins the two values together. The documentation says arithmetic is not possible with that result. Use getNumber to read numbers from a text input or slider.

What language does Code.org App Lab use?

JavaScript. App Lab lets you write it with either blocks or text and switch between them, according to the App Lab tool page.

How do I add sound in App Lab?

Use playSound with the address of an MP3 file. The documentation says the sound URL needs the full http:// prefix, or you can upload your own file and choose it, in which case the file name is enough.

How do I switch screens in App Lab?

Use setScreen with the id of the screen you want. The documentation says the default screen id is screen1, and that only one screen can be visible at a time.

Does App Lab work on a Chromebook or tablet?

The App Lab tool page lists laptop, Chromebook and tablet. The editor itself recommends a desktop or laptop computer with a mouse and keyboard for building apps.

Is Code.org now called CodeAI?

The footer of the App Lab page, read on 17 October 2026, says the organization is CodeAI and that Code.org is a former trademark of CodeAI. App Lab is still at studio.code.org.

Can you help me with my AP CSP Create task in App Lab?

We teach the concepts the task needs with our own examples, but we never write, fix or review Create task code. College Board says plagiarism, including unacknowledged AI-generated code, scores 0 on the Create task.

When are classes for US students?

Weekdays or weekends, flexible. Choose your batch, or for a very personalised plan choose 1-on-1 at your convenience, weekend mornings or weekdays.

How much do the classes cost?

The first lesson is free. After that, lessons are paid month by month, and the fees section on this page shows the amount in US dollars.

Elsewhere on this site

Related pages

More for US students who build apps at school.

Coding classes in the USA

All of our pages for American students.

AP CSP coaching

Live preparation for AP Computer Science Principles.

AP CSP or AP CSA first?

Which AP course to take first.

JavaScript basics

The language App Lab is built on.

How to debug code

A general method for any bug.

Web project ideas

What to build after App Lab.

Java cannot find symbol error

Java cannot find symbol, decoded: real javac output, eight causes, numbered fixes.

BlueJ not working: fixes

BlueJ not working? Official fixes for install, VM errors, output and frozen runs.

Eclipse Java help for students

Eclipse for Java students: install, run, read errors, fix Java version and memory.

Start here

Book a free first lesson

Tell us what your app should do and what it does instead. The teacher picks the idea behind the gap and teaches it with an example, so you can go back and fix your own app.

To find out what a lesson is like, read how we teach; you can also browse every course with its syllabus.

WhatsApp us · +91 91233 66161 · connect@modernagecoders.com

We are an online school with teachers in India, so every lesson is a live video class rather than a visit to a local center. WhatsApp is how US families usually reach us fastest.

The first lesson is free; we do not take card details.

Want a class sooner? Book a priority demo

A priority demo is a full class of about 45 to 60 minutes. After the class the mentor sends a written skill report and a personal learning roadmap on WhatsApp. If you enrol, the demo fee is adjusted against your first month's fee. Share your demo Order ID with us on WhatsApp and we take it off.

Book a priority demo

Keep exploring Modern Age Coders

Related courses and guides

Free resources

From the blog

Start here

Free classPriority demoCall us