SPEAKER: This is CS50, and this is CS50 Explained, Behind the Pedagogy. So many of you have probably taken CS50 or heard of CS50 in some form already. And so that then is what of CS50, if you've actually gone through the courses, lectures, and/or problem sets, that is programming assignments. But this session during our educator workshop is meant to be a glimpse at the why. Why, for better or for worse, have I, have we, CS50's team, made some of the pedagogical and curricular decisions that we have. 

Ultimately, it's up to you as a teacher in your own classroom, whether to adopt or adapt or neither of those when it comes to each of these ideas. But at least we thought we would share with you some of the thinking behind our own conscious decisions. 

So CS50 itself is a fairly traditional undergraduate class here in person. It's among Harvard's largest. So pictured here is beautiful Sanders Theater, this old building on campus in which we're fortunate to be able to give our lectures. But the course is structured with other resources as well. And everything that we do nowadays, curricularly, technologically is freely available as open courseware, so to speak. That is to say it costs teachers nothing to use any and all of these materials and these tools as well. 

CS50x, now in terms of nomenclature, is essentially what we call the free version of CS50. So they are one in the same curricularly and technologically. But whereas we might say a Harvard or Yale student takes CS50 on campus, anyone online would take CS50x off campus. But curricularly and technologically they are the same. And all of the courses materials live at this URL, as well as on other platforms that you might know, like edX and YouTube, Apple TV, Google TV, and other platforms over the time as well. 

Now, in terms of other nomenclature, there's an adaptation of the class called CS50 AP, which for those of you in the United States in particular is an endorsed implementation of the AP Computer Science Principles curriculum framework, which is to say that high school students can take CS50 either online or through their own school for AP credit, if their school will administer ultimately the exam so that they can get that credit. 

All of those materials are available at this URL on CS50's own website. And in essence, CS50 AP includes CS50x, plus some additional materials from a course that we have long called CS50T, an introduction to technology, more broadly, that has additional material that the AP test might expect of students. 

Pictured here is one of my favorite photos over the years whereby we gathered in New York City with a number of public and private schools years ago with some of our teachers and our network to have a hackathon for our high school students. Pictured here just a few weeks back are about 300 teachers from Indonesia who teach middle school and/or high school and are going to be teaching now introductory computer science in their own classrooms. So some of CS50's team and I flew to Indonesia to lead a workshop like this one in person for those teachers in Jakarta. 

And lastly, pictured here are some of our students in Nicaragua. So where they have been taking CS50 largely in Spanish with some of their own teachers there, as well as working their way through the courses, problem sets, final projects, ultimately to exhibit their own CS50 certificate at the end of the course. And most recently, as CS50 actually begun giving talks and professional development in companies, like General Electric and others, whereby the goal is to really uplift people more broadly when it comes to understanding, technology, computing, and programming in particular. 

Now, for those of you unfamiliar, besides CS50x, and in turn CS50 AP, CS50 has a whole curriculum now of courses that you can take either before CS50 or after CS50 in either of those forms. So, for instance, just to rattle these off, we have a course that focuses particularly on programming with Python, a course that focuses on web programming with Python and Javascript, a course that focuses on game development, one that focuses on artificial intelligence with Python, one of which is an introduction to computer science for lawyers or for business professionals or for technologists, really consumers, or citizens more generally. 

Hot off the press is a new course on programming with R, very popular language for data science that's about to launch in just a few days. A course on programming with Scratch, particularly for younger students a course on databases with SQL, a language via which you can manipulate data. And then lastly, for now, a course on cyber security specifically. 

So even though today and tomorrow we will focus primarily on CS50x, and in turn CS50 AP, is really the computer science backbone that these courses, either lead to or extend from after you've taken them, all of these courses, all of these resources and tools are similarly available to you for free as indeed open courseware. 

But there's a lot. In those courses in CS50 itself, indeed, you might recall if you've watched CS50's own lectures, we display this picture here, which is a fire hydrant connected to a drinking faucet. And the idea is, and this is a photograph down the road from MIT, that taking CS50, like getting an education from MIT, is like drinking from a fire hose. It's really going to hit you with a lot of material, a lot of water that you might not be able to take down all at once. 

But that's not really the goal ultimately. Rather, the goal is that exposure. And that reality that over time there's going to be so much more to learn, and among the goals of CS50 is to teach students and in turn teachers how to teach themselves this material, which is never going away insofar as it's only going to continue to change. 

Now, as for the language, the programming languages that we use in CS50, we actually do start with Scratch, a very student friendly graphical programming language that many kids around the world nowadays are even using in middle school, if not younger. But we use it to talk about programming fundamentals, like functions and loops and arguments and conditionals and other programming constructs that are still going to be present in most every other language we talk about. But in Scratch, there's no semicolons, there's no parentheses, there's no sort of syntactic stupidity that just tends to get in the way and gets very frustrating when students are confused. So we get rid of that early on, spending just a day, maybe a week or slightly more on this particular domain. 

For those unfamiliar, it's indeed this drag and drop programming interface that really isn't too young of a platform, even for the oldest of students. Indeed, we use this with our own university students here. It allows us to implement Hello, World as quite simply as a couple of puzzle pieces like that. 

But then we do transition in CS50 fairly quickly to a more traditional text based language, an older language called C, which is not very common nowadays. It looks a little something like this. Much of the world, I daresay, has moved to use Java, or most recently Python, perhaps other languages as well. But the appeal of something like C to us is, one, we can actually pretty readily make an analogy between Scratch and C, even by color coding it, as I have done the code here. 

Even though there's a lot more syntax going on here, of course this program is functionally the same and just prints out Hello, World. And so when we go from Scratch to C, among my favorite things to do pedagogically is to show students these very user friendly puzzle pieces in Scratch, and say in C, it just looks a little different, like this here on the right. 

Yes, it looks scarier. Yes, it's harder to memorize at first with all of this punctuation, but it's the exact same idea. And we try to give students early on this mental hook, this mental comfort, so that even if they're frustrated by or struggling with some of the syntax, it's the same darn ideas as they were the previous week with respect to functions and loops and conditionals and so much more. 

Indeed, here is a conditional that starts to look even more cryptic on right, but is the exact same thing as the puzzle pieces at left. But C now educationally also allows us to go at a lower level and pretty quickly. And in fact, among the most empowering things I hope about CS50 is that we actually don't abstract that much away. At the end of the day, what's nice about C, I do think pedagogically, is that there's no magic. 

You don't just write one line of code and a whole lot of functionality happens for free for you. If you want to have a list of information, if you want to have a hash table of data, you have to implement that yourself. Now, that's not necessarily something you're going to want to do or even have to do professionally long term. 

But the fact that in this course, we give students this bottom up understanding of what is going on underneath the hood of the computer, we do think intellectually is incredibly empowering. So we present students, for instance, this grid of memory, RAM, so to speak, inside of your computer. And we propose to them that if we want to maintain some kind of ordering and association among these data, we can, of course, implement the scary old linked lists like this using pointers. 

But at the end of the day, there's no magic. This is just numbers. And those numbers are just bits, zeros and ones. And because we try in the course to scaffold things from building blocks to building block to building block, layering ideas on top of one another, the hope is that when students transition thereafter to a higher level language like Python, they still understand what is actually going on, and they appreciate now what tools they've been provided with. 

And they're not just kind of mimicking what they've seen on the screen. They know what Python, they know what their own code is doing. So one of my favorite exercises, in fact, is this. This is a bit of a spoiler, if you've not finished CS50x yourself. But this code here in about a dozen lines of code in Python is essentially an implementation of problem set 5 in CS50x currently, which is to implement a spell checker in C and implement your very own hash table for like 100,000 plus words in English that daresay takes most students 5 hours, 10 hours, 15, 20 hours to implement and get right. 

But in Python, and I do this deliberately in class, 60 seconds, type, type, type, done implementing the same spell checker in Python, because that entire hash table, of course, is reduced to that one line of code at the very top there, where we use a Python set that we could use even a list or a dictionary or some other structure to implement that data structure containing all of those words. 

And it's that moment where students see and appreciate and sort of shake their fist metaphorically in class when they realize, oh my God, why did we just spend 10 to 20 hours implementing it in C. But the difference is that our students, we do hope, understand now at a very real level what all of this code is actually doing for them. 

We transition toward the end of the CS50, of course, to web programming. And this too is motivated by the reality nowadays that it's just useful to be able to write code for web contexts. It's not even the actual web necessarily. Increasingly, do mobile devices, for instance, have applications written in them using languages like HTML, CSS, and JavaScript for cross-platform support across Android and iOS in particular. 

So we introduced students, of course, to this structure of HTML, the bones that allow you to structure a page. But we very quickly transitioned to Flask, which for those unfamiliar is a micro framework. It's code that standardizes how you implement a web application, but it's fairly lightweight. There's fairly little Flask-specific stuff that students have to master in order to make their very own web application, unlike something like Django or other frameworks that just tend to be heavier weight. 

And indeed, this too is a pedagogical decision. We want students to become familiar with a framework. We want them to get exposure to some real world web applications. But we don't want to spend a week, a month, a course teaching them a specific framework, something like Django or the like, which might be very useful and very applicable professionally. But that's not the point, right? 

That's the point at which you should be going and reading the documentation is needed. What we care about in the context of web programming is what is the browser doing, what is the server doing, what is HTTP, what is the framework doing to facilitate all of that. And how are HTML, CSS, JavaScript and Python all solving different problems in this case. 

Now, ultimately, the software that we have students use in the course has evolved over time. And if you've been with us as a teacher in some form over the years, you'll know that the technology, the platforms we ourselves use has been evolving. Most recently, we have students using Visual Studio Code or VS Code, which is a very popular text editor, increasingly really an IDE, or integrated development environment, because with things called extensions or plugins, you can really add a lot more functionality to the environment. 

And so what we ourselves do for students is we can figure this for them in the cloud using a third party tool called GitHub Codespaces. What's nice about GitHub Codespaces is that whether you're using it for CS50 or any of your own classes, any verified teacher can use GitHub Codespaces and related tools completely for free. 

So if you're using this through CS50 or on your own, you can use these tools in the cloud. And this too is a very pedagogical decision. All too often in introductory technical courses, students might have to download some piece of software or install it and configure it. Sometimes that works out well, but the reality is there's so many darn versions of Mac OS and Windows and even other operating systems that you're going to run into technical difficulties, certainly if you have a medium number of students. 

If you have just a handful, might not be such a big deal to get everyone up and running on their own Macs or PCs, especially if they need offline access. But if you're fortunate to have pretty good internet access in school, at home or at work, more generally, using something in the cloud is certainly very turnkey and convenient. So we use this so we can standardize students' programming environments. 

And for those of you who teach not just introductory courses, but perhaps higher level, more advanced courses as well, we'll talk over the coming days. And we have documentation online via which you can actually use Codespaces and customize it yourself for courses even unrelated to CS50 as well. 

But within the classroom, and what we really wanted to share in this first session today is like what the point is of a lot of the demonstrations, a lot of the decisions that we make on camera or really in class itself. And the goal for me as a teacher now has been to create as best I can, as many as I can of these memorable moments, sort of visual memories that stick in students' head long after the course itself is over, so that for the most sophisticated topics, complicated, difficult topics in the class, they have some kind of mental framework that they can fall back on that just gives them greater comfort an understanding of some topic that might otherwise be far too abstract or complex to recall. 

So, for instance, binary search is perhaps one of the first that we introduced in class. And you might remember scenes like this here. It's getting increasingly hard to find these here phone books. And I think quite soon, we might solicit via the internet that if you have phone books of your own that you don't need or colleagues or friends, please do mail them to us. 

They're also getting fairly thin. So it's not all that compelling to tear these things in half. But what's nice about phone books is that they're still with us in digital form. Whether you have an iPhone or Android device, you have a contacts or address-book app that still has people's names from A to Z sorted alphabetically. A phone book, then, is just a physical incarnation of that same idea. 

I hope you won't mind. I don't think I'm going to tear this one today because I kind of need it in the fall. So we're going to hang on to this one here. But you can see a dramatically torn in any of our videos online. We, of course, talked with students about binary and indeed try to give them a sense of really at the end of the day, what is a computer doing, how is it storing information. 

And so even though we function, of course, in the human world with decimal primarily, among our goals with teaching binary is also to create one of these memorable moments after that same phone book. So pictured here, for instance, is some of our students in a prior year holding up their hand to represent a one or just standing there with their hand down to represent a zero. 

Now, we do this with sheets of paper. In this case, I print 1 on some of the sheets or 0 on the other sheets as a sort of visual cue to tell them or the audience what it is they're representing. You don't even need that. Sometimes we use light bulbs that are on or off. 

I went on amazon.com one year and found some plastic light up numbers which we can similarly use as well to ultimately have students represent the ones place, the twos place, the fours place, eights, 16s, 32, 64 128s place. The tension, I think, ultimately, is, how many minutes, how much class time do you actually spend on these demonstrations when you could have just written it on the board in chalk or marker? 

But that's really left to you, to me, the teacher, to decide to read the room as to what feels like an appropriate balance of spending good time on these to create memorable moments versus taking too much time at the expense of other discussions. Now, when it comes to debugging too, you might recognize or might wonder why rubber ducks seem to be everywhere in CS50. 

We've actually been giving these little rubber ducks out to students for quite a bit of time now in class physically, and they also line the stage in this photograph here. Here is simply a much bigger version of the same, because there's this thing in programming called rubber-duck debugging, whereby if you or a student are struggling to solve some problem or understand something, you're encouraged to have a conversation with a rubber duck and sound it out. 

Tell the duck what problems you're having. Ask the duck any questions. Odds are it won't actually reply. But through that process of talking through the problem, the presumption is that light bulb will go off and you'll realize some illogic in your thinking, and you will have solved the problem just by verbalizing it. 

Well, nowadays we do this digitally. We've had a chat bot that will quack back at students, and most recently, one that will speak English or even other human languages back to the student. And indeed, more on that over the course of today and tomorrow, because now underlying these ducks is artificial intelligence. 

But at a lower level, of course, we introduce students to data structures, among the simplest being an array. We try to remind students that an array is really just leveraging that same model we discussed in the context of memory. But technically, a computer can only look at one location at a time, typically. And so we liken locations in memory to doors, like lockers in a gym or in the hallway where students might keep their books in their backpacks. 

We have been fortunate to find at a local store a whole bunch of tiny gym lockers that aren't very convenient to move around. But we nonetheless set them up on stage and allow students to then visualize and hear all the more what we mean when we say a computer can only look at one location at a time as we go from left to right opening those same doors. 

We talk about sorting information. And here too, a fun opportunity to have students come up on stage and sort themselves. Pictured here are some of our students holding plastic light up numbers that represent a number from 0 to 7 in this case. And it's a fun exercise to, one, have them just go sort themselves. And usually it's a little chaotic. But as smart humans, they figure it out. 

But then I ask them, well, what was the algorithm you used. And really, no one can kind of put their finger on what just happened chaotically on the stage. So we try to formalize it with something like selection sort or bubble sort or more advanced algorithm as well. 

When we get two pointers, we try to, again, to give students these memorable moments and these mental models by likening it to pointing from one thing to another. So I picked up from a local hardware store, called Home Depot here, a couple of mailboxes physically that you get postal mail in. But we set them up on stage here. 

So Carter and I were playing the roles of actually accessing the contents of these memory locations represented by mailboxes. And because we're at a university, we have access to a lot of those foam fingers. So I had a Harvard foam finger or a Yale foam finger that allows me even more visibly and dramatically to point from one location to another. 

But of course, ultimately under the hood, it's just this grid of memory locations, which we again remind students of. And even though this kind of story seems to escalate quickly, because suddenly it gets very complicated, I'm looking at hexadecimal and grids of memory, it's just the same idea. And so just like with Scratch and C, with memory and mailboxes, we try to give students this very comfortable, familiar, memorable moment and mental model, but use that to allow them to better understand what's going on underneath the hood so they really can appreciate and understand these so-called abstractions. 

We do this again and again. With hashing, for instance, it's common to say that you put values into buckets. So we literally pick up some buckets from, again, the hardware store. And in this case, we had some jumbo playing cards that we found on Amazon. But you could make these yourself out of paper and markers. And we bucketize the values by hashing based on the suit of these here cards. 

But it's important to recognize, too, especially since we are fortunate to teach a class like CS50 in this beautiful theater on campus, that none of this theatricality, none of this creation of memorable moments actually requires much in the way of those resources. And it certainly doesn't require a theater. 

Indeed, several of those examples and all of my own earliest examples didn't have buckets, didn't have plastic numbers that light up. They just had sheets of paper that I grabbed from a printer drawn on with a marker to just make more real and more visual what it is that we're trying to present to our students. 

So the problem sets are what ultimately is where students spend most of their time in the class. It's an opportunity to assess their understanding of the material, but more importantly, for them to apply the material to actually problems and actually learn how to master it. We try to draw inspiration from familiar aspects of culture, pop culture and technology. 

Mario, for instance, has become fairly canonical. And as you yourself are a teacher, perhaps a new teacher, I keep a lookout in my own life for things like this that I could use as a hook, a way of enticing students into caring about a problem, but reducing it really to something that we want to teach. 

So here is a fairly involved picture from the 1980s of the original Nintendo and Super Mario Brothers. But what caught my attention there is, wait a minute, this pyramid is a fairly standard structure. There's some kind of loop via which you could create it. That's a problem set. 

How do we make it more complicated? Well, later in the game, there's two pyramids, slightly different opposing shapes. That's a slightly harder homework problem. So again, we tend to look for these hooks, be it visually, audibly, experientially, that we use as motivation for the subsequent problem, which at the end of the day, especially for those of us who've been programming for years, might be kind of boring, right? Like writing a for loop or two is not terribly exciting, but it can be the first time and it can be if you know how it's applicable and care why it is. 

We talk about cryptography, which at the end of the day really is just an excuse to-- really is just rather a context in which to discuss string manipulation and treating strings as array of characters in C, and manipulating the underlying characters as though they're numbers because of that equivalence between chars and ints in a language like C. So this, of course, is the plain text that might correspond to the so-called ciphertext here in. But again, that context, that hook is meant to get students thinking about and caring about the material at hand. 

Photographs and videos nowadays are everywhere. And so here's a picture of a popular location here on campus that we apply some Instagram-like filters to make it black and white or detect all of the edges. At the end of the day, what we really care about with this homework assignment, so-called Problem Set 4 in CS50 of late, is that we want them to understand file input and output. We want them to understand bitmap files and grids of pixels and structs via which you represent colors. But again, we use this hook of Instagram-like filters to get students caring about and excited about what problem they're trying to solve. 

Here, we introduce them to hexadecimal as a hook to get rather in the context of data recovery, to get students interested in actually recovering photos by really just looking for patterns of bits pictured there into their hexadecimal equivalents. We introduce students to a bit of biology in the context of DNA and a sort of mystery with DNA really to get them thinking about string processing, which at a glance, is not nearly as exciting until we say, this is Alice's DNA and this is Bob, and we ask him a question like who done it. 

And then toward the end of the course, of course in the context of web programming, we introduce them of late to CS50 Finance, a full fledged web application that talks to a lightweight API, a third party service to get live data so that students, really, by the end of the course have built something within the context and support structure of CS50, but in a way that they can then use as a stepping stone to making their own final project, if not a web application or mobile app as well. 

But now, here on campus and perhaps in your own schools or communities as well, we focus also on CS50's community. I dare say we've tried to make it more than just a course, more than just a set of homework assignments, but really this shared collective experience. In part, because it's meant to be fairly intense and it is indeed rigorous for so many students. And we want there to be this mix of work and play, but that ultimately really brings students together in a way that they care about. 

And so we have this sequence of events that start with Puzzle Day. And you some of you might have participated in the online version of this. All the better if you can get your students, your classmates together, working on challenge problems, logical problems together. Pictured here is among my favorite photographs of some of our very smart students gathering together to delight in what the solutions are. 

Pictured here are some of those same students struggling with those problems collaboratively before the solutions were revealed. And these puzzles have nothing to do deliberately with computer science. This is not a hackathon per se. It has nothing to do with programming or CS, but about problem solving collaboratively, and especially drawing in those students less comfortable at the school so that they might even follow their CS50 friends to this event, learn a little something about problem solving, and get interested perhaps in the field itself. 

Now, toward the end of the semester, as you might know, here at Harvard, as well as at Yale, do we-- once students have a programming background, we do have a proper hackathon, a 12-hour event, in our case, during which students can work, ideally excitedly, on their final projects, their capstone experience. 

We have a tradition of ending the evening, which for us starts at 7:00 PM at night and ends at 7:00 AM in the morning. But any students who are still awake with enough energy, we invite to a local pancake place, the International House of Pancakes, where such memories as these await ultimately after a long night of actual problem solving. And then, lastly, do we end our semester with the so-called CS50 Fair, which is really inspired by what some of your own schools back in the day might have held as middle school science fairs, where you show off the volcano that you built at home demonstrating some chemical concept from class. 

Well, we have students bring their laptops and we invite friends, alumni, recruiters from industry. We turn on some music, we serve some popcorn and candy, and we invite students and faculty and staff across campus to exhibit and see our students' final projects. And so scenes like this are not uncommon. 

Every CS50 student has their same laptop or phone on which they're displaying the work that they created. We use this too, as an opportunity to potentially recruit new students to get them interested in what their friends have clearly created over the course of just three months, in our case. We include typically a raffle, whereby we give all of our CS50 students a sheet of paper that has some placeholders for stickers, and we also give our CS50 students some stickers. 

And the idea is that for any person who's attending that asks them about their final project, the student should give that person a sticker. And every sticker represents one entry in a raffle with fabulous prizes, whatever those might be. And the goal, honestly, of this raffle is just to grease the wheels socially, break the ice for students and attendees to give them a fun excuse to go up and ask about this project and this one and this one, so that students, again, care and take an interest engaging with their fellow classmates, staff and students. 

So this then was an overview, ultimately, we hope, of the course's curriculum and some of the why behind it, some of the technical and curricular decisions behind the languages, behind the problem sets and more, as well as a look behind the motivation for so many of CS50's events that we host here in person and/or online. 

Ultimately, again, the goal in explaining all of this is to enable you as a teacher to make your own informed decision as to whether to adapt or adopt or neither of all of these various resources. But allow us to conclude officially here. I'll take a-- we have a few minutes of break ahead via which we can now transition to the next session. So thank you so much for joining us this morning. We will be back in just five minutes for our next session. 

I'm going to hop off camera, but hop into the chat room. So if you have any questions for me, I will appear momentarily in the chat. But we'll see you in five. This was CS50 Explained.