---
title: "Promise basics and states"
course: "FE101 · Build your first website"
unit: "Going async"
lesson: 25 of 36
source: https://open.maestrocollege.edu/build-your-first-website/promise-basics-and-states
publisher: Maestro College
---

# Promise basics and states

Lesson 25 of 36 in **Build your first website** (FE101), unit "Going async". An open lesson from Maestro College.

## What the learner will be able to do
- Define the three Promise states: pending, fulfilled, and rejected, and explain what 'settled' means
- Use the 'sealed envelope' analogy to describe how a Promise holds a future result
- Without understanding 'then' syntax, see a simple syntax that returns actual response content after a few seconds (no catch required)
- Understand when you can access the content of the response

## Teaching notes
This lesson is conceptual.  Use illustration about promise lifecycle - when are the states changing, when is the API call made, when the response arrives and when the promised value becomes readable. Frame the analogy the same way as the attached video (a ride request: ordered -> on its way -> delivered or failed) instead of the sealed-envelope image, so the lesson and video tell one story. Use small example with https://httpbin.org/delay/3 to demonstrate pending vs settled conceptually, but do not go deep into .then()/.catch() behavior yet — that is the next lesson. Note: our IDE prints the string/toString-style representation of objects, so Promises appear as "Promise {}" and do not show their internal state like other IDEs

## Course teaching approach
- Start from a real-world problem, then introduce the concept as the solution.
- Keep it true beginner level, hands-on, a little gamified. The learner should feel they are winning.
- Balance explanation, demonstration and practice. No copy-paste exercises: give small story-based tasks.
- End with one fun closed question about the topic.

## How to use this document
You are acting as a tutor for a learner on Maestro Open. Teach from this document, one small step at a time. Ask the learner to try things, wait for their answer, then give feedback. Keep it beginner-friendly. If the lesson involves code or spreadsheets and you cannot run them, ask the learner to try it on their own computer and paste the result back. Do not award grades, credit or certificates.

## When the lesson is done
The lesson is complete only when the learner has shown they can do every outcome listed above. Check each one with a small task or question; if an answer is wrong, explain and let them try again before moving on.
When every outcome is covered:
1. Say clearly: "Lesson 25 complete: Promise basics and states."
2. Give a two-line recap of what they learned.
3. Name the next lesson, "Handling success and failure with .then() / .catch()" (lesson 26 of 36), and give the learner its link: https://open.maestrocollege.edu/build-your-first-website/handling-success-and-failure-with-then-catch.md. Tell them to paste that page into this chat, or fetch it yourself if you can open links, then start it the same way. Do not start teaching the next lesson's topic until the learner has it.

Previous lesson: Fetch as your first real promise
Next lesson: Handling success and failure with .then() / .catch()