1
00:00:00,000 --> 00:00:00,457


2
00:00:00,457 --> 00:00:01,540
DAVID MALAN: Hello, world!

3
00:00:01,540 --> 00:00:05,080
And hello to all of CS50's alumni
and friends at Microsoft and GitHub.

4
00:00:05,080 --> 00:00:08,950
My name is David Malan and I teach
CS50, Harvard University's Introduction

5
00:00:08,950 --> 00:00:11,260
to The Intellectual
Enterprises of Computer Science

6
00:00:11,260 --> 00:00:14,410
and The Art of Programming, which
is also offered at Yale University

7
00:00:14,410 --> 00:00:17,230
and freely available to anyone
online via OpenCourseWare

8
00:00:17,230 --> 00:00:19,790
on YouTube, edX, and beyond.

9
00:00:19,790 --> 00:00:23,230
This is a tour of just some of the
software that CS50 students are now

10
00:00:23,230 --> 00:00:25,840
using while learning how to
program, much of it built

11
00:00:25,840 --> 00:00:28,180
to top tools that might be familiar.

12
00:00:28,180 --> 00:00:31,450
A student first logs in
to code.cs50.io, which

13
00:00:31,450 --> 00:00:35,110
is a web app that automates the
process of creating, using GitHub Repos

14
00:00:35,110 --> 00:00:39,820
API, a repository for them in CS50's
Code 50 Organization to which they

15
00:00:39,820 --> 00:00:41,140
have write access.

16
00:00:41,140 --> 00:00:45,220
Using the same API, the web app also
pushes to that repos main branch

17
00:00:45,220 --> 00:00:49,390
an initial .devcontainer.json file,
which includes CS50's recommended

18
00:00:49,390 --> 00:00:52,570
plugins and settings for Visual
Studio code as well as a reference

19
00:00:52,570 --> 00:00:54,070
to CS50's Docker image.

20
00:00:54,070 --> 00:00:56,470
Which ensures that students
have a common environment

21
00:00:56,470 --> 00:01:00,820
for writing and running code in C,
Python, and other languages too.

22
00:01:00,820 --> 00:01:05,260
Using the new code spaces API, the web
app then creates a two core code space

23
00:01:05,260 --> 00:01:10,270
for the student on that branch in that
repo using that .devcontainer.json file

24
00:01:10,270 --> 00:01:13,780
and the web app then redirects the
student to the newly created code space

25
00:01:13,780 --> 00:01:16,180
where they can use Visual
Studio code in their browser.

26
00:01:16,180 --> 00:01:19,080


27
00:01:19,080 --> 00:01:22,260
On subsequent visits to
code.cs50.io, the web app

28
00:01:22,260 --> 00:01:24,295
simply redirects students to the same.

29
00:01:24,295 --> 00:01:27,420
Students can ensure that they always
have the latest environment by running

30
00:01:27,420 --> 00:01:30,690
a command in their code space's
terminal window, update50,

31
00:01:30,690 --> 00:01:34,560
which downloads the latest
.devcontainer.json file and rebuilds

32
00:01:34,560 --> 00:01:36,123
their code space.

33
00:01:36,123 --> 00:01:38,040
More comfortable students,
meanwhile, can even

34
00:01:38,040 --> 00:01:41,640
use a local installation of Visual
Studio code on their own Mac or PC

35
00:01:41,640 --> 00:01:43,800
to connect to the code space remotely.

36
00:01:43,800 --> 00:01:47,130
Once in their code space students
can start writing code right away.

37
00:01:47,130 --> 00:01:50,340
Or if ready to start an
assignment, can visit a URL

38
00:01:50,340 --> 00:01:53,760
to accept the assignment first
via GitHub Classroom, which

39
00:01:53,760 --> 00:01:57,900
has the effect of creating for them
a repository in CS50's classroom 50

40
00:01:57,900 --> 00:02:01,290
organization containing any
starter code for the assignment.

41
00:02:01,290 --> 00:02:05,130
In order to get the assignment into
their code space students run get50,

42
00:02:05,130 --> 00:02:08,460
a command that automates the process of
cloning the assignment into their code

43
00:02:08,460 --> 00:02:12,450
space omitting the .get directory
since their code space is already a Git

44
00:02:12,450 --> 00:02:13,890
Repository.

45
00:02:13,890 --> 00:02:17,730
Within the cloned folder, students
can start writing their code.

46
00:02:17,730 --> 00:02:20,910
If students have trouble understanding
some error message along the way

47
00:02:20,910 --> 00:02:23,460
they can run help50, a
command that translates

48
00:02:23,460 --> 00:02:27,600
using regular expressions, fairly arcane
standard output and error to student

49
00:02:27,600 --> 00:02:29,970
friendly advice.

50
00:02:29,970 --> 00:02:33,270
And if students eventually encounter
bugs they can debug with tools like

51
00:02:33,270 --> 00:02:37,200
printf or Vagrant or they can start
Visual Studio codes built in debugger

52
00:02:37,200 --> 00:02:40,650
using debug50, a command that
essentially automates the process

53
00:02:40,650 --> 00:02:44,490
of creating the requisite launched
.json file and also allows students

54
00:02:44,490 --> 00:02:47,820
to provide command line
arguments at the command line.

55
00:02:47,820 --> 00:02:49,770
For the toughest of
bugs students can even

56
00:02:49,770 --> 00:02:53,340
employ rubber duck debugging, the
process of talking through their logic

57
00:02:53,340 --> 00:02:57,210
with the rubber duck in hopes of
hearing any illogic in their thoughts.

58
00:02:57,210 --> 00:03:00,480
Students without a rubber duck
handy can have that chat virtually

59
00:03:00,480 --> 00:03:03,240
by a CS50 zone plug-in.

60
00:03:03,240 --> 00:03:06,510
When ready to submit their
code students can run submit50,

61
00:03:06,510 --> 00:03:09,030
a command that essentially
automates the process of Git

62
00:03:09,030 --> 00:03:13,480
adding, committing, and pushing students
code to their classroom repository

63
00:03:13,480 --> 00:03:16,080
so that they needn't, at least
in the course's first weeks,

64
00:03:16,080 --> 00:03:19,800
wrestle with Git itself and potential
challenges like merge conflicts.

65
00:03:19,800 --> 00:03:22,770
A problem to solve eventually to
be sure, but not in the same week

66
00:03:22,770 --> 00:03:25,320
we think, is Hello World itself.

67
00:03:25,320 --> 00:03:27,630
The command also pushes
to a student's repo

68
00:03:27,630 --> 00:03:30,450
a doc GitHub directory
containing correctness tests that

69
00:03:30,450 --> 00:03:33,090
will be run on students
code via GitHub actions

70
00:03:33,090 --> 00:03:35,070
using another command
called check50, which

71
00:03:35,070 --> 00:03:40,140
ultimately outputs an autograding.json
file that GitHub Classroom understands.

72
00:03:40,140 --> 00:03:43,890
The student's teaching assistant, or TA,
can then provide qualitative feedback

73
00:03:43,890 --> 00:03:48,540
on that submission via pull request that
GitHub Classroom automatically creates.

74
00:03:48,540 --> 00:03:51,000
And they can input scores
in a standardized format

75
00:03:51,000 --> 00:03:55,410
that a tool of our own can automatically
download and parse via the polls API.

76
00:03:55,410 --> 00:03:58,230
We then download the results of
correctness tests via the actions

77
00:03:58,230 --> 00:03:59,880
API too.

78
00:03:59,880 --> 00:04:02,760
Eventually, we envision students
having multiple code spaces

79
00:04:02,760 --> 00:04:06,660
but just one repository for their
submissions, one assignment per branch.

80
00:04:06,660 --> 00:04:10,120
And we also envision integrating
features like sandboxes and labs

81
00:04:10,120 --> 00:04:13,480
so that a code space could be
customized for a particular exercise.

82
00:04:13,480 --> 00:04:16,260
But this ability to stitch
together a UX that's

83
00:04:16,260 --> 00:04:19,950
tailored to teachers and students
alike using API calls, extensions,

84
00:04:19,950 --> 00:04:22,320
and containers has already
been game changing.

85
00:04:22,320 --> 00:04:24,570
From CS50's whole team
here in Cambridge,

86
00:04:24,570 --> 00:04:28,760
thanks so much for making
all this and more possible.

87
00:04:28,760 --> 00:04:37,000