The Rabbit Hole

Chromebook, FlashESP & ESP32 Project Workflow

STEM Club — Startup Procedure Chromebook, FlashESP & ESP32 Project Workflow Student Quick-Start and Troubleshooting Guide

1. At a Glance — The Full Sequence

Follow these nine stages in order. Each has its own detailed section below with cautions and recovery steps. Do not skip ahead — a failure in an early stage is the most common cause of trouble later.
# Stage You are done when…
1 Start & sign in to the Chromebook You see your desktop and the Wi-Fi icon shows connected.
2 Join / confirm the school network A web page loads in Chrome.
3 Open FlashESP The FlashESP editor page is on screen.
4 Create an account (first time) OR sign in (returning) Your name/email shows in the top corner.
5 Create or open your project Your project sketch is open in the editor.
6 Enter code (type or upload) Your code fills the editor pane.
7 Build / compile & debug You see “compilation successful” with no red errors.
8 Connect & flash the ESP32 You see “flash / upload complete.”
9 Open Serial Monitor or the project’s web page Live output or the project web page appears.
Rule of thumb: green means go, red means stop and read the message. Almost every error prints a clue — read it before asking for help, then check the “IF IT FAILS” box for your stage.

2. Detailed Steps

Stage 1 — Start Up and Sign In to the Chromebook

  1. Open the lid, or press the power button (top-right of the keyboard) if the screen stays dark.
  2. Wait for the sign-in screen. Click your name if it is listed, or click “Add person” / “Next.”
  3. Enter your school Google account (usually name@yourschool.org) and your password. Ask a mentor if you don’t know it.
  4. Wait for the desktop (the shelf of icons at the bottom) to finish loading.
CAUTION: Use only your own school account. Personal Gmail accounts are usually blocked by school policy and cannot install what the projects need. Chromebooks may auto-update on first boot — if the screen says “Updating,” let it finish; do not force a shutdown.
IF IT FAILS: Screen stays black: hold the power button 8 seconds, release, then press once to restart. “Password incorrect”: check Caps Lock (a light on the key) and that you typed the full @school.org address. After several failures the account may lock — see a mentor. “This account is not allowed on this device”: you are using a personal account. Sign out and use your school account.

Stage 2 — Connect to the School Network

  1. Click the clock/status area in the bottom-right, then click the Wi-Fi icon.
  2. Choose the school network name your mentor gives you (for example, “SCHOOL-Student”).
  3. If asked, enter the network password or your student credentials.
  4. Open Chrome and load any page (such as the school home page) to confirm you are online. If a login/agreement page appears, accept it.
CAUTION: Some school networks block outside sites. FlashESP must be reachable — if it is blocked, your IT/mentor must allow it before you continue. Do NOT use a personal phone hotspot unless a mentor approves it; it may violate school policy.
IF IT FAILS: No networks listed: toggle Wi-Fi off and on in the same menu, or move closer to an access point. Connected but no web pages load: click the network, choose “Forget,” then reconnect. A sign-in/“captive portal” page may need to be completed first. FlashESP won’t load but other sites do: the site is likely firewalled. Report the exact blocked address to your mentor.

Stage 3 — Open FlashESP

  1. Open Chrome and go to the FlashESP web address your mentor provides (write it here: ________________________ ).
  2. Bookmark it (star icon in the address bar) so you can find it quickly next time.
  3. Wait for the editor page to fully load before clicking anything.
CAUTION: FlashESP flashes the ESP32 from the browser using Web Serial. This only works in Chrome/Chromebook when serial access is allowed by school policy. If your Chromebook is school-managed, an administrator may need to enable USB/serial access for the STEM lab devices before Stage 8 will work.
IF IT FAILS: Page won’t load: re-check the address for typos; confirm Stage 2 (you are online). Page loads but looks broken: refresh with Ctrl+Shift+R (hard reload). A warning about serial/USB permissions appears now or later: this is expected — you will allow it in Stage 8.

Stage 4 — Account: Create (First Time) or Sign In (Returning)

4a. First-Time Account Creation

  1. On the FlashESP page, click “Sign up” / “Create account.”
  2. Enter the email your mentor tells you to use (often your school email). Choose a password you can remember.
  3. If a verification email is sent, open it and click the confirmation link, then return to FlashESP.
  4. Write your login somewhere safe (a class password sheet), never on the Chromebook’s desktop.
CAUTION: Use a class-approved email. Verification links sometimes land in Spam/Junk — check there before assuming it failed. Never reuse a password from a personal or banking account.

4b. Returning Sign-In

  1. Click “Sign in / Log in.”
  2. Enter your FlashESP email and password. If offered “Remember me” on a shared device, leave it UNchecked.
  3. Confirm your name or email appears in the top corner — that means you’re signed in.
IF IT FAILS: Forgot password: use “Forgot password?” to email a reset link, then check Spam. “Email already in use” when signing up: you already have an account — switch to 4b and sign in instead. Verification email never arrives: wait 5 minutes, check Spam, then ask a mentor to re-send or verify the address.

Stage 5 — Create or Open Your Project

  1. For a new project: click “New Project” (or “+”). Give it a clear name, e.g. Blink_YourName or Sonar_Radar.
  2. If asked, choose your board — for our club select ESP32 (the exact model your mentor names, e.g. “ESP32 Dev Module”).
  3. To continue earlier work: open your project list and click the project you want.
CAUTION: Choosing the wrong board is the #1 cause of “it compiled but the board does nothing.” Match the board setting to your physical ESP32. Name projects clearly. “Untitled3” today becomes a mystery next week.
IF IT FAILS: Can’t find an old project: confirm you’re signed into the same account (Stage 4). Projects are tied to the account that made them. No “ESP32” board option: tell your mentor — the board package may need to be selected in settings first.

Stage 6 — Enter Your Code

There are two ways to get code into the editor. Use whichever your lesson calls for.

6a. Type Directly in the Editor

  1. Click inside the code pane and type (or carefully copy-paste) your sketch.
  2. Keep every { paired with a }, and end statements with a semicolon ;.

6b. Upload an Existing File

  1. Look for “Open,” “Import,” or an upload/folder icon.
  2. Choose your .ino (or .cpp/.h) file from Downloads or Google Drive.
  3. Confirm the code now fills the editor and matches what you expected.
CAUTION: Paste code as plain text. Copying from a website or PDF can bring in “smart quotes” (“ ” instead of ” “) that break compilation. Save often. Use the Save button or Ctrl+S; a browser tab that closes can lose unsaved typing.
IF IT FAILS: Upload button greyed out: make sure a project is open first (Stage 5). Wrong file type: FlashESP expects source code (.ino/.cpp/.h), not a .zip or image. Weird symbols after paste: delete the pasted quotes and retype them by hand, or paste into a plain-text step first.

Stage 7 — Build / Compile and Debug

  1. Click “Verify,” “Build,” or “Compile.” FlashESP will check and compile your code (this does not touch the board yet).
  2. Watch the output/console area at the bottom for progress messages.
  3. If it finishes green (“compilation successful” / “done compiling”), go to Stage 8.
  4. If it finishes with a red error, read the FIRST error and its line number — fix that one, then compile again.
CAUTION: Fix errors top-down. One early mistake (a missing ; or }) often triggers a cascade of later errors that vanish once the first is fixed. Compiling is normal to take 20–90 seconds, especially the first time. “Slow” is not “broken.”
IF IT FAILS: “expected ‘;’” or “expected ‘}’”: a semicolon or brace is missing just before the line number shown. “’xyz’ was not declared”: a spelling mismatch, or a missing #include / library at the top of the sketch. “No such file … .h”: a required library isn’t installed/selected — ask your mentor which library the lesson needs. Same error after edits: make sure you saved (Stage 6 caution) before re-compiling.

Stage 8 — Connect and Flash the ESP32

  1. Plug the ESP32 into the Chromebook with a good USB DATA cable (not a charge-only cable).
  2. Click “Connect” (or the flash/upload button). A small browser window lists serial ports.
  3. Pick the port for your board (often shown as CP210x, CH340, or USB Serial). Click “Connect.”
  4. Click “Flash” / “Upload.” Watch the progress bar and console.
  5. If your board has a BOOT button and flashing stalls at “Connecting…,” press and hold BOOT until it starts, then release.
  6. Wait for “flash complete” / “upload done.” The board may reset by itself — that’s normal.
CAUTION: A charge-only cable is the most common flashing failure — the board powers on (LED lights) but no port appears. If in doubt, swap cables. Do NOT unplug the board while the progress bar is moving. Wait for “complete.” On a managed Chromebook the serial permission prompt must be Allowed. If no prompt and no port ever appears, serial access may be disabled by policy — see your mentor/IT.
IF IT FAILS: No port in the list: try a different USB cable, then a different USB port; confirm the board’s power LED is on. Stuck at “Connecting…” / “Failed to connect”: hold BOOT (and tap EN/RST if present), then retry the flash. “Port already in use” / “access denied”: close any other Serial Monitor or tab using the board, then reconnect. Flashes to ~99% then fails: usually a weak cable/port or power dip — swap the cable and retry. Prompt never appears on managed device: report to mentor/IT that Web Serial/USB access needs enabling for the STEM lab devices.

Stage 9 — Open the Serial Monitor or the Project’s Web Page

9a. Serial Monitor (text output projects)

  1. After a successful flash, click “Serial Monitor” (or the monitor/terminal icon).
  2. Set the baud rate to match your code — for our projects usually 115200.
  3. Press the board’s EN/RST button once to restart it and watch the messages from the start.

9b. Web-Server Projects (e.g., the Sonar Radar)

  1. Read the Serial Monitor after reset — the board prints an IP address like 192.168.x.x.
  2. Open a NEW Chrome tab and type that IP address into the address bar.
  3. The project’s web page (dashboard, radar plot, controls, etc.) should appear.
CAUTION: Only ONE program can hold the serial port. If Serial Monitor shows nothing, make sure flashing (Stage 8) has fully finished and no other tab has the port. For web projects the Chromebook and the ESP32 must be on the SAME network. On many school networks devices are isolated and cannot see each other — check with your mentor if the page won’t load.
IF IT FAILS: Serial Monitor is blank: confirm the baud rate matches the code (115200) and press EN/RST. Serial Monitor shows garbled symbols: wrong baud rate — set it to the value in the code. IP address never prints: the board may not be joining Wi-Fi — check the network name/password in the code with your mentor. Web page times out: verify the IP was typed exactly, that you’re on the same network, and that device isolation isn’t blocking you.

3. Summary Checklist

Tick each box as you go. If any step won’t complete, stop and use that stage’s “IF IT FAILS” box before moving on. ☐ Chromebook started and signed in with school account. ☐ Connected to the school network; a web page loads. ☐ FlashESP opened in Chrome (and bookmarked). ☐ Signed in to FlashESP (created account if first time). ☐ Project created or opened; correct ESP32 board selected. ☐ Code entered by typing or upload; work saved. ☐ Compiled successfully — no red errors. ☐ ESP32 connected with a data cable and flashed to “complete.” ☐ Serial Monitor (115200) shows output, or the project web page loads. Golden rules: use your school account; use a real data USB cable; read the first error; wait for “complete” before unplugging; ask a mentor when a stage’s recovery box doesn’t fix it.

4. References for Further Information

Ask your mentor for the exact FlashESP address and any club-specific handouts. The links below give background on the tools and hardware used.
Topic Where to look
FlashESP web flasher Ask mentor for the club URL; general browser-flashing background: web.esphome.io and esp.huhn.me
Chromebook basics & Wi-Fi Chromebook Help — support.google.com/chromebook
Web Serial in Chrome developer.chrome.com — Web Serial API
ESP32 getting started Espressif ESP32 docs
Arduino / ESP32 core Arduino-ESP32 documentation
Serial Monitor & baud rates Arduino Serial reference
USB data vs. charge cables If flashing fails, test with a known-good data cable before anything else (see Stage 8).
Document version: STEM Club Startup Procedure — v1.0. Update the FlashESP address and network names before distributing to students.