diff --git a/src/sections/01-introduction/01-intro/index.md b/src/sections/01-introduction/01-intro/index.md index b308061..84397c5 100644 --- a/src/sections/01-introduction/01-intro/index.md +++ b/src/sections/01-introduction/01-intro/index.md @@ -76,11 +76,8 @@ By the end, you won’t just be picking solutions that feel right, you’ll be a **Class times on zoom Mondays and Wednesdays 5:30-7:30pm** -~~**First class on zoom starts on May 18th**~~ -~~**Last class will be Wednesday, July 22**~~ -** Due to the 2026 winter storm the start and end dates are pushed back by one week:** -**First class on zoom starts on February 2nd Monday 2pm** -**Last class will be April 8th Wednesday 2pm** +**First class on zoom starts on May 18th** +**Last class will be Wednesday, July 22** ## Attendance diff --git a/src/sections/02-what-is-memory/01-learning-objectives/index.jsx b/src/sections/02-what-is-memory/01-learning-objectives/index.jsx new file mode 100644 index 0000000..00aeb22 --- /dev/null +++ b/src/sections/02-what-is-memory/01-learning-objectives/index.jsx @@ -0,0 +1,26 @@ +import { formatObjectives } from "@nss-workshops/nss-core"; + +const data = [ + { category: "Memory", module: "1", name: "Explain what a bit and a byte are and why computers use binary", level: "Remember, Understand" }, + { category: "Memory", module: "1", name: "Describe how RAM stores data as a numbered sequence of bytes", level: "Remember, Understand" }, + { category: "Memory", module: "1", name: "Explain what a memory address is and how the CPU uses it to locate data", level: "Remember, Understand" }, + { category: "Memory", module: "1", name: "Distinguish between storing a value directly and storing a reference to a value", level: "Understand" }, + { category: "Memory", module: "1", name: "Explain why primitive values and objects behave differently when assigned to variables in JavaScript", level: "Understand" }, + { category: "Memory", module: "1", name: "Explain why array index access can be calculated directly from an index, without searching", level: "Understand" }, +]; + +export default { + id: "what-is-memory-learning-objectives", + title: "Learning Objectives", + description: "Goals and outcomes for the What Is Memory? section.", + previousChapterId: null, + nextChapterId: "what-is-memory-binary", + content: `## 🎯 What You Will Learn + +This section builds the mental model behind how computers store and locate data. By the end, you will understand why the data structures you are about to study are designed the way they are. + +${formatObjectives(data)} +`, + exercises: [], + quiz: null +} diff --git a/src/sections/02-what-is-memory/02-binary-language/index.jsx b/src/sections/02-what-is-memory/02-binary-language/index.jsx new file mode 100644 index 0000000..11d17a2 --- /dev/null +++ b/src/sections/02-what-is-memory/02-binary-language/index.jsx @@ -0,0 +1,12 @@ +import content from "./index.md?raw"; + +export default { + id: "what-is-memory-binary", + title: "Binary: The Language of Hardware", + description: "Why computers use 0s and 1s, and what bits and bytes mean.", + previousChapterId: "what-is-memory-learning-objectives", + nextChapterId: "what-is-memory-ram", + content, + exercises: [], + quiz: null +} diff --git a/src/sections/02-what-is-memory/02-binary-language/index.md b/src/sections/02-what-is-memory/02-binary-language/index.md new file mode 100644 index 0000000..080cc3a --- /dev/null +++ b/src/sections/02-what-is-memory/02-binary-language/index.md @@ -0,0 +1,30 @@ +At the lowest level, a computer is made of billions of tiny switches. Each switch is either **off** or **on** β€” and those two states are represented as **0** and **1**. This two-value system is called **binary**. + +This has been true since the beginning of modern computing. The earliest computers, built in the 1940s, used **vacuum tubes** β€” glass bulbs the size of a thumb that could be switched on or off electronically. They were expensive, fragile, and generated enormous heat. A room-sized machine might contain 18,000 of them. By the 1950s, vacuum tubes were replaced by **transistors** β€” smaller, cheaper, and far more reliable. By the 1970s, engineers learned to etch millions of transistors onto a single sliver of silicon, creating the **microchip**. Today, a chip smaller than a fingernail contains billions of transistors. + +The physical technology changed dramatically across those decades. What never changed is the underlying paradigm: **every transistor is still just a switch, and every switch is still just a 0 or a 1.** All the software ever written β€” every app, every database, every algorithm β€” ultimately runs on that foundation. + +## Bits and Bytes + +- A **bit** is a single binary digit: a `0` or a `1`. +- A **byte** is a group of 8 bits. + +With 8 bits you can represent 256 different combinations (2⁸) β€” enough to encode a letter, a small number, or a color value. + +[Here is a podcast episode that covers this concept](https://www.codenewbie.org/basecs/3) + +## Units of Measurement + +You will encounter these units constantly throughout this course and your career: + +| Unit | Approximate Size | +|------|-----------------| +| **Byte (B)** | 8 bits | +| **Kilobyte (KB)** | 1,000 bytes | +| **Megabyte (MB)** | 1,000,000 bytes | +| **Gigabyte (GB)** | 1,000,000,000 bytes | +| **Terabyte (TB)** | 1,000,000,000,000 bytes | + +## Why This Matters + +Every value your program works with β€” a number, a string, an array β€” is ultimately a pattern of bits stored somewhere in memory. When we talk about how much memory a data structure uses, we are talking about how many of those boxes it occupies. diff --git a/src/sections/02-what-is-memory/03-ram-the-workspace/index.jsx b/src/sections/02-what-is-memory/03-ram-the-workspace/index.jsx new file mode 100644 index 0000000..dabf6ff --- /dev/null +++ b/src/sections/02-what-is-memory/03-ram-the-workspace/index.jsx @@ -0,0 +1,12 @@ +import content from "./index.md?raw"; + +export default { + id: "what-is-memory-ram", + title: "RAM: The Computer's Workspace", + description: "What RAM is, how it is structured, and why its layout matters for data structures.", + previousChapterId: "what-is-memory-binary", + nextChapterId: "what-is-memory-addresses-and-references", + content, + exercises: [], + quiz: null +} diff --git a/src/sections/02-what-is-memory/03-ram-the-workspace/index.md b/src/sections/02-what-is-memory/03-ram-the-workspace/index.md new file mode 100644 index 0000000..a49c2b3 --- /dev/null +++ b/src/sections/02-what-is-memory/03-ram-the-workspace/index.md @@ -0,0 +1,29 @@ +When your program runs, it needs a place to keep the data it is currently working with. That place is **RAM** (Random Access Memory). + +## Volatile Storage + +RAM is **volatile**: it only holds data while the computer is powered on. When you shut down or the power goes out, everything in RAM is erased. This is different from a hard drive or SSD, which retains data permanently. + +## The Desk Analogy + +Think of your computer's storage like an office: + +- A **hard drive** is the filing cabinet β€” it holds everything long-term, even when the office is closed. +- **RAM is your desk** β€” you can only actively work on what is currently spread out in front of you. + +When you open a program or load a file, the computer moves it from the filing cabinet to the desk so the CPU can reach it quickly. + +## RAM as a Numbered Grid + +Here is the structural detail that matters most for this course: + +**RAM is a long sequence of boxes. Each box holds exactly one byte and has a unique number β€” its memory address.** + +``` +Address: [ 0 ] [ 1 ] [ 2 ] [ 3 ] [ 4 ] [ 5 ] ... +Value: [ 65] [108] [108] [ 0 ] [ 72] [105] ... +``` + +Every piece of data your program stores β€” every variable, every object, every array β€” lives at one or more of these numbered locations. + +The CPU finds data not by searching for it, but by going directly to its address. This is why the name "Random Access Memory" stuck: any address can be accessed in the same amount of time, regardless of where it is. Values larger than one byte span multiple adjacent boxes. The CPU reads them as a single unit starting at the first box's address. \ No newline at end of file diff --git a/src/sections/02-what-is-memory/04-memory-addresses-and-references/index.jsx b/src/sections/02-what-is-memory/04-memory-addresses-and-references/index.jsx new file mode 100644 index 0000000..0c897e6 --- /dev/null +++ b/src/sections/02-what-is-memory/04-memory-addresses-and-references/index.jsx @@ -0,0 +1,12 @@ +import content from "./index.md?raw"; + +export default { + id: "what-is-memory-addresses-and-references", + title: "Memory Addresses & References", + description: "How the CPU locates data, and the difference between storing a value and storing a reference.", + previousChapterId: "what-is-memory-ram", + nextChapterId: "what-is-memory-bridge", + content, + exercises: [], + quiz: null +} diff --git a/src/sections/02-what-is-memory/04-memory-addresses-and-references/index.md b/src/sections/02-what-is-memory/04-memory-addresses-and-references/index.md new file mode 100644 index 0000000..6727f77 --- /dev/null +++ b/src/sections/02-what-is-memory/04-memory-addresses-and-references/index.md @@ -0,0 +1,39 @@ +Now that you know RAM is a numbered grid of boxes, the next question is: how does a program find its data? + +## Variable Names vs. Addresses + +When you write `let score = 42` in JavaScript, you use the name `score` for your own convenience. Internally, the computer reserves a location in RAM and stores the value `42` there. The variable name is just a human-readable label that the language maps to an address behind the scenes. + +## Values vs. References + +There are two ways a variable can relate to data in memory: + +**Storing a value directly** β€” the variable's memory location contains the actual data. Changing one variable does not affect another. + +```js +let a = 5; +let b = a; // b gets its own copy of 5 +b = 10; +console.log(a); // still 5 +``` + +**Storing a reference** β€” the variable's memory location contains an *address* pointing to where the data actually lives elsewhere in memory. + +```js +const a = [1, 2, 3]; +const b = a; // b holds the same address as a +b.push(4); +console.log(a); // [1, 2, 3, 4] +``` + +`b.push(4)` changed `a` as well β€” because both variables were pointing to the *same location* in memory. There was only ever one array; `a` and `b` were just two different labels for the same address. + +## What Is a Reference? + +A **reference** is a value that stores a memory address rather than data. Instead of saying "the value is 42," it says "the value is at address 1042." + +In JavaScript: +- **Primitive types** (numbers, strings, booleans, `null`, `undefined`) are stored by **value** β€” each variable gets its own copy. +- **Objects and arrays** are stored by **reference** β€” variables hold an address pointing to where the data lives. + +This distinction comes up constantly in programming, and now you know exactly why it exists: copying a large object by duplicating every byte would be slow. Copying an address is always the same small size, and it allows the copied reference to modify the same data as the original (which we may or may not want) \ No newline at end of file diff --git a/src/sections/02-what-is-memory/05-bridge-to-data-structures/index.jsx b/src/sections/02-what-is-memory/05-bridge-to-data-structures/index.jsx new file mode 100644 index 0000000..a298e83 --- /dev/null +++ b/src/sections/02-what-is-memory/05-bridge-to-data-structures/index.jsx @@ -0,0 +1,12 @@ +import content from "./index.md?raw"; + +export default { + id: "what-is-memory-bridge", + title: "Memory & Data Structures", + description: "How memory layout explains the performance characteristics of arrays and other data structures.", + previousChapterId: "what-is-memory-addresses-and-references", + nextChapterId: "what-is-memory-glossary", + content, + exercises: [], + quiz: null +} diff --git a/src/sections/02-what-is-memory/05-bridge-to-data-structures/index.md b/src/sections/02-what-is-memory/05-bridge-to-data-structures/index.md new file mode 100644 index 0000000..50578c0 --- /dev/null +++ b/src/sections/02-what-is-memory/05-bridge-to-data-structures/index.md @@ -0,0 +1,35 @@ +Now that you understand how memory works, you can see *why* data structures are designed the way they are β€” not just *what* they do. + +## Arrays: Contiguous Memory + +When you create an array, the computer reserves a **contiguous** block of memory β€” boxes that are sequential and adjacent, with no gaps. + +Because all elements sit right next to each other and each element is the same size, the computer can calculate any element's exact address with a single formula: + +``` +address of element = start address + (index Γ— element size) +``` + +That is one arithmetic operation, regardless of how large the array is. This is why array index access is constant time. + +```js +const scores = [88, 92, 75, 100]; +console.log(scores[2]); +``` + +Note that this formula depends on every element being the same size. Typed arrays (like `Int32Array`) guarantee this. Regular JavaScript arrays are more loosely typed β€” you can mix numbers, strings, and objects in the same array β€” so the engine handles the memory layout internally. This is complicated and not important for now. What matters is we can still access any element immediately based on its index. + +## References Enable Flexibility + +Not every data structure packs its elements together. Some use **references** to link elements that can live anywhere in memory. Each element holds its data plus the address of the next element β€” a chain rather than a block. + +This is the foundation of data structures you will encounter later in the course, such as linked lists. The elements do not need to be adjacent; they just need to know where the next one is. + +## The Trade-Off You Will Keep Seeing + +| Approach | Strength | Limitation | +|----------|----------|------------| +| **Contiguous storage** (arrays) | Direct access by index, calculated immediately | Inserting or removing elements can be expensive | +| **Reference-based storage** | Flexible structure, efficient insertion | Must follow the chain to reach any element | + +Every data structure you study in this course is an answer to the question: *given how memory actually works, what is the best way to organize this type of data?* The answer always involves this trade-off. You now have the mental model to understand why. diff --git a/src/sections/02-what-is-memory/06-glossary/index.jsx b/src/sections/02-what-is-memory/06-glossary/index.jsx new file mode 100644 index 0000000..9917739 --- /dev/null +++ b/src/sections/02-what-is-memory/06-glossary/index.jsx @@ -0,0 +1,25 @@ +import { formatGlossary } from "@nss-workshops/nss-core"; + +const data = [ + { term: "Binary", definition: "A two-value number system (0 and 1) that reflects the two physical states of a computer's hardware switches β€” off or on.", week: "1" }, + { term: "Bit", definition: "The smallest unit of data in a computer β€” a single binary digit with a value of 0 or 1.", week: "1" }, + { term: "Byte", definition: "A group of 8 bits. A byte can represent 256 distinct values and is the basic addressable unit of RAM.", week: "1" }, + { term: "RAM (Random Access Memory)", definition: "The computer's working memory β€” volatile storage that holds data currently in use. Any address can be accessed in the same amount of time.", week: "1" }, + { term: "Volatile", definition: "Describes storage that requires power to retain data. RAM is volatile; hard drives and SSDs are not.", week: "1" }, + { term: "Memory Address", definition: "A unique number identifying a specific byte's location in RAM. The CPU uses addresses to find data directly, without searching.", week: "1" }, + { term: "Value", definition: "Data stored directly at a variable's memory location. Primitive types in JavaScript (numbers, strings, booleans) are stored by value β€” each variable gets its own copy.", week: "1" }, + { term: "Reference", definition: "A memory address stored in a variable, pointing to where the actual data lives. Objects and arrays in JavaScript are stored by reference β€” multiple variables can point to the same data.", week: "1" }, + { term: "Contiguous Memory", definition: "Memory locations that are sequential and adjacent with no gaps between them. Arrays use contiguous memory, which allows any element's address to be calculated directly from its index, without searching.", week: "1" }, +]; + +export default { + id: "what-is-memory-glossary", + title: "Glossary: What Is Memory?", + description: "Key terms from the memory foundations section.", + previousChapterId: "what-is-memory-bridge", + nextChapterId: "what-is-memory-checkpoint", + content: `These terms describe how computers store and locate data. You will encounter them throughout the course, especially when analyzing why data structures perform the way they do. +${formatGlossary(data)}`, + exercises: [], + quiz: null +} diff --git a/src/sections/02-what-is-memory/07-checkpoint/checkpoint.jsx b/src/sections/02-what-is-memory/07-checkpoint/checkpoint.jsx new file mode 100644 index 0000000..1a202eb --- /dev/null +++ b/src/sections/02-what-is-memory/07-checkpoint/checkpoint.jsx @@ -0,0 +1,77 @@ +import { QUESTION_TYPES } from '@nss-workshops/nss-core'; + +export default [ + { + type: QUESTION_TYPES.RADIO, + questionJsx:

How many bits are in one byte?

, + answers: [ + "4", + "8", + "16", + "32" + ], + correctAnswer: 1 + }, + { + type: QUESTION_TYPES.RADIO, + questionJsx:

What makes RAM "volatile"?

, + answers: [ + "It can only store small amounts of data", + "It is slower than a hard drive", + "Its contents are erased when the power is off", + "It can only be read, not written to" + ], + correctAnswer: 2 + }, + { + type: QUESTION_TYPES.RADIO, + questionJsx:

What is a memory address?

, + answers: [ + "The name you give a variable in your code", + "A unique number identifying a specific byte's location in RAM", + "The size of a data structure in bytes", + "A URL pointing to data on the internet" + ], + correctAnswer: 1 + }, + { + type: QUESTION_TYPES.RADIO, + questionJsx: <> +

What does this code print for a.length, and why?

+
{`const a = [1, 2, 3];
+const b = a;
+b.push(4);
+console.log(a.length);`}
+ , + answers: [ + "3 β€” b is a copy of a, so a is unchanged", + "4 β€” a and b reference the same array in memory", + "undefined β€” you cannot push to a const array", + "0 β€” the array was reassigned" + ], + correctAnswer: 1 + }, + { + type: QUESTION_TYPES.RADIO, + questionJsx:

Why can the computer access any array element immediately, without searching through the array?

, + answers: [ + "Because arrays are always small enough to scan quickly", + "Because the computer searches from the beginning and stops early", + "Because array elements are stored contiguously, so any address can be calculated directly from the index", + "Because JavaScript automatically caches array lookups" + ], + correctAnswer: 2 + }, + { + type: QUESTION_TYPES.CHECKBOX, + questionJsx:

Which of the following are stored by reference in JavaScript? (Select all that apply.)

, + answers: [ + "A number like 42", + "An array like [1, 2, 3]", + "A boolean like true", + "An object like { name: 'Alice' }", + "A string like 'hello'" + ], + correctAnswers: [1, 3] + } +]; diff --git a/src/sections/02-what-is-memory/07-checkpoint/index.jsx b/src/sections/02-what-is-memory/07-checkpoint/index.jsx new file mode 100644 index 0000000..33e62f6 --- /dev/null +++ b/src/sections/02-what-is-memory/07-checkpoint/index.jsx @@ -0,0 +1,16 @@ +import { Checkpoint } from '@nss-workshops/nss-core'; +import questions from "./checkpoint.jsx"; + +export default { + id: "what-is-memory-checkpoint", + title: "Checkpoint: What Is Memory?", + description: "Test your understanding of binary, RAM, memory addresses, and references.", + previousChapterId: "what-is-memory-glossary", + nextChapterId: "what-is-memory-feedback", + content: `Test your understanding of binary, RAM, memory addresses, and references.`, + exercises: [], + quiz: {component: () => <> +

Checkpoint

+ + } +} diff --git a/src/sections/02-what-is-memory/feedback/index.jsx b/src/sections/02-what-is-memory/feedback/index.jsx new file mode 100644 index 0000000..324a708 --- /dev/null +++ b/src/sections/02-what-is-memory/feedback/index.jsx @@ -0,0 +1,16 @@ +export default { + id: "what-is-memory-feedback", + title: "Student Feedback", + description: "Your feedback helps us understand what works, what doesn't, and how we can make each module more effective for you.", + previousChapterId: "what-is-memory-checkpoint", + nextChapterId: null, + content: ` +Please take a moment to share your feedback using this form: +Module Feedback Form. + +First, select the course name **Data Structures and Algorithms**, then choose the module you just completed. + +Your responses are **anonymous**, and your feedback helps us improve the content, pacing, and overall learning experience. +We really appreciate your input.`, + exercises: [], +} diff --git a/src/sections/02-what-is-memory/index.js b/src/sections/02-what-is-memory/index.js new file mode 100644 index 0000000..e0bef94 --- /dev/null +++ b/src/sections/02-what-is-memory/index.js @@ -0,0 +1,18 @@ +/* + Section configuration file +*/ + +// Import all chapter packages +const chapterModules = import.meta.glob('./*/index.jsx', { eager: true }) + +// Section configuration +const config = { + id: "what-is-memory", + title: "What Is Memory?", + order: 25, + description: "How computers store and find data β€” the foundation for understanding data structures.", +} + +const chapters = Object.values(chapterModules).map(chapter => ({ ...chapter.default, sectionId: config.id })) + +export { chapters, config }