SAL: I'm here with John Resig, our resident Javascript
and all-things-hardcore guru.
JOHN RESIG: [LAUGHS] Thanks, Sal.
And also the architect behind
what we're looking at right now.
What is this?
JOHN: Yeah. this is really exciting.
This is the new Khan Academy
computer science content.
We've been working on this now for a little while.
and I'm just really excited to get this out now.
SAL: And so, this is a page that we have.
I see a bunch of links right here.
There's an introductory video.
So, what we are doing right now isn't the introductory video.
It's the launch video.
JOHN: Yes.
There is another introductory video
that walks through all of the stuff.
but let's talk a little bit about what this computer science is.
So, fundamentally you've created a kind of a neat environment.
Here's some of the example programs
that people have done already on this platform that you've made.
So, here's some of the getting started ones.
Let’s play with—
So this is the most basic one, Winston.
JOHN: Yeah, yeah.
You’ve got some ellipses—[INDISTINCT]
SAL: And it’s an environment where you have, right over here—
You have your coding pane on the left.
And then you have a canvas to draw [the results].
So it’s immediately visual.
So this is something that’s pretty basic,
even for an early programmer.
And, what I find very exciting is some of this action—
that you can change things in real time.
JOHN: Yeah.
SAL: So—And there’s tutorials that go into more depth.
I can make Winston closer to my complexion.
JOHN: [LAUGHS]
SAL: [LAUGHS] There you go
And we can change things in real time
So, even for a beginning programmer,
they can start to play around with things.
But obviously this is actually—
What’s surprising is it’s a fairly powerful environment.
JOHN: Yeah. Being able to have that responsiveness,
I feel like it allows you to just, kind of, better understand
how things interact with each other,
at a pretty fundamental level.
SAL: Yeah. We have things like this,
which is a little bit more involved.
And we can change, we can change in real time,
some of the core variables right over here.
So, [in] the initial spiral configuration—
Well, let’s see what happens if we change it a little bit.
We can see how it immediately changes everything
JOHN: Mmm hmm.
SAL: Maximum radius—
What is this? How do you know what that does?
It does something.
JOHN: It seems to get larger—
SAL: Oh yeah. It’s the radius of the circle,
Number of points in spiral itself.
We can reduce it.
JOHN: Looks like you're getting less and less—thinner.
SAL: Yeah, we get thinner—thicker.
Yeah, so this is fascinating.
JOHN: Yeah.
SAL: There’s all of these—
Leave this page— [Sal reading the prompt on the screen.]
And so, there is a ton of examples
of what people have already done
all the way to this expert level. You have—
This is a—
Ben Kamens wrote this [??].
It’s literally a bird-flocking simulator.
JOHN: Yeah. Yeah.
SAL: But you can actually—
(Maybe this is less realistic.)
—hit the birds with rocks.
JOHN: Yes. [LAUGHING] SAL: [INDISTINCT]
But this was all done—
I mean, what’s neat is this was done all in this environment
It’s all Javascript right over here.
And anyone can go and look at these — and change them.
JOHN: Yeah.
And then you can save it as your [own].
You can “save as,” and it will save it,
actually, in your profile.
JOHN: Yeah. The big thing we want to do is
we want everyone to be able to see the code
and the thing that’s running—simultaneously.
SAL: Yeah.
JOHN: And you should always feel willing and excited
to change what’s there and make it your own.
And so, we want to really heavily encourage
exploration and experimentation.
And I think this platform is going to do that.
SAL: Yeah, this is neat.
And you can collect the stuff.
And so, if you go to your profile,
it shows up there,
and then you can share it with other people, too.
JOHN: Mmm hmm.
SAL: So these are the things that I’ve been working on.
I still have a little work left to do.
[INDISTINCT] I wanted to do an Ulam spiral.
I can actually show the current version of it.
JOHN: Mmm hmm.
I’[ve] — made a little video on it, too.
But yes, you just plot the prime numbers, things like that.
JOHN: Mmm hmm.
SAL: Let’s see. How do we get here?
So, regardless—
So, you go to Watch—
JOHN: Mmm hmm.
SAL: —Computer Science
JOHN: Yep.
SAL: —and then you just click there.
And it takes you to that main “Computer Science” page.
JOHN: Yep.
SAL: And what if—
So, we just looked at a bunch of examples.
And obviously, people can look at
the code for those examples.
They can tweak it.
They can save their own versions,
and maybe create derivative versions of them.
What if someone’s a complete beginner?
JOHN: Mmm hmm.
SAL: What should they do?
JOHN: So, I mean, probably the best way to go about it is
to look at some things
that you think are kind of are interesting—
like looking at some of the introductory explorations.
Some of these programs here,
where it’s just basic drawing, for example.
If you never programmed before,
this is a great way to get started.
Start to look at what is being done there
and see if you can’t kind of intuitively know how
those function calls work.
But even so, we have a whole bunch of tutorials.
So if you go up to the drawing tutorials there—
We have a number of tutorials—
We have a few tutorials on drawing,
along with some of these programs
that you can learn drawing from.
Then, if you go up to—
If you want to learn some of the basics of programming,
as well, you can view the programming basics.
And we go even into more depth
about some of these topics
that you might want to understand better.
SAL: And they also have an audio component.
JOHN: Yes.
SAL: Our now soon-to-be-famous intern,
Jessica, recorded many of these.
JOHN: Yes. [LAUGHS]
SAL: But if you press play here,
you’ll actually have here talking through what she’s doing here.
And she’ll change the code in the canvas as she speaks
JOHN: Yeah.
SAL: And then, you can interact with that code.
JOHN: Yeah.
SAL: Which is pretty neat—
JOHN: Yeah.
—almost magical,
JOHN: [LAUGHS]
in my opinion
And one thing that I’ve found really valuable,
even for myself is to—
It’s sometimes fun to tweak other people’s code.
But once you feel comfortable,
to actually just look at what they did,
and try to build ityourself—from scratch.
Because that’s really how you really learn to program,
is get inspired, see what’s possible,
and then try to build it yourself.
And if you get really stuck,
then you see how other people have implemented things.
And yeah—so this is really exciting.
Did we miss anything?
JOHN: No.
I mean, yeah, this is the big thing.
I think the big thing we want to encourage here is,
we want you to make your own things;
not only building off of what we have,
but create something original.
You can take components from what we’ve written,
or just write stuff that’s completely new.
Mercury Subspace, there, is a pretty awesome one.
That one, I think people will get a big kick out of that one.
SAL: And so this whole game was written right here.
JOHN: Yeah. Yep.
That was done by David, one of our interns.
SAL: Oh, this is a real game.
JOHN: Yeah. [LAUGHS]
SAL: This is—
Yeah, David kind of overdoes things sometimes.
JOHN: [LAUGHS]
This is pretty good.
JOHN: [LAUGHS]
SAL: This is—
Oh, oh. Yeah. Yeah.
And this is all written there.
And someone can change—
How do I pause it?
JOHN: Just click over right inside of it.
SAL: Oh, Okay.
JOHN: So like, for example there,
you got your max_Health.
So why don’t you try changing max_Health.
And look at the hearts in the display up there.
SAL: So if I change my max_Health to 10—
JOHN: There you go.
SAL: then, all of a sudden, we have more hearts here.
JOHN: Yep. [LAUGHS]
SAL: And this is fun.
I mean, even a very beginner
could start changing a fairly sophisticated program.
JOHN: Yeah.
SAL: You can change the images and things like that.
JOHN: Oh, yeah. Absolutely.
Yeah. Why don’t you go down—
Scroll down a little bit.
So you got your guy there in a little beetle there.
SAL: Mmm Hmm. Yeah.
JOHN: There you go.
So there’s one, then sub—
The second one down: “Beetle ship.”
SAL: Beetle ship.
JOHN: And why don’t you click—
and then scroll down over there a little bit.
SAL: Say, Spunky Sam?
JOHN: Yeah, go ahead.
JOHN: So, why don’t you click that.
SAL: Spunky Sam.
JOHN: And so, you can see that. Look at, now—
SAL: Oh. So now, the ship is Spunky Sam—
JOHN: Yeah. Now you’re—
SAL: shooting. SAL: Very cool!
JOHN: [LAUGHS]
SAL: Very cool!
JOHN: So, I mean, I think this is sort of—
One of the things that we really wanted to do is
we really wanted to make it powerful—
It’s simple enough that anyone can
really get in and start to play around.
So, I think one of the big things here is that
we want you to make your own things.
And then down below,
you see that there is this discussion area,
where you can ask questions and comment on things.
And this is a big thing.
I think you’re going to find this to be a really valuable way
to get feedback, and to be able to talk with other people,
and get a better understanding about how things work.
SAL: And actually become a better—
I mean, one thing I’ve found
is—just writing a couple of these tutorials—
getting feedback from you and other people has,
I think, made me better.
Because there’s little silly things that I kept doing
And now, all of a sudden, other people can look at it—
find other interesting ways of doing it. or even asking [others]—
And you can ask the author questions
about how would they have done something.
So, it really creates a community of learners here.
JOHN: Yeah. No, absolutely.
SAL: This is exciting.
I already have two or three projects that—
I’m not getting much things done right now.
JOHN: [LAUGHS] Great. I— Yeah, I love it too.
I’ve been having a blast playing around with it.