Placeholder Image

字幕表 動画を再生する

  • COLTON OGDEN: All right, we should be live here on CS50's Twitch channel.

  • Apologies for the delay.

  • I'm afraid our PC actually had a blue screen of death.

  • So we brought in a reserve machine.

  • So thanks to Dan Coffey for helping out with that.

  • But, yes, welcome to everybody who's been patiently waiting in the chat

  • here.

  • First of all, for folks who don't know who I am, my name is Colton Ogden.

  • I work full-time with CS50.

  • And I thought as part of our new Twitch channel,

  • we'd take some time today, about a few hours, to from scratch code a game

  • called Snake, which is sort of an old school 2D game.

  • If you ever grew up having a Nokia phone or the like, you've probably played it.

  • And it was played on sort of older computers back in the day.

  • And we'll take a look at what that looks like.

  • But, anyways, thanks so much for tuning in.

  • Let's dive into what we're doing and start to take a look at everything.

  • So I'm going to pull up my computer here.

  • And now we have a little twitch.tv/cs50tv graphic there.

  • So if you're not following the CS50TV account on Twitch

  • so that you can join the live chat with us

  • and we'll have some back and forth conversation,

  • definitely go ahead and follow that link.

  • Hit Follow.

  • If you're watching this on YouTube after the fact,

  • we will be pushing this video to YouTube later.

  • But there is a 10 minute waiting period, I believe,

  • for if you want to actually chat.

  • And I'll see your chat messages here as we go ahead and program.

  • All right, so what you see here is a text editor called VS Code.

  • This is what I'll be using today to program,

  • but you can use sort of any text editor that you want.

  • You could even theoretically use, like, Word Pad on Windows or whatever.

  • I would definitely recommend getting something like VS Code or Atom

  • any of the free sort of text editors that are out now.

  • I personal like VS Code.

  • And it has some cool plugins, one of which I will use for the framework

  • that we'll be taking a look at today to make Snake.

  • Let's take a look at what Snake actually is, I think,

  • before we go too in-depth into what we're doing programming wise.

  • So Snake kind of looks like this.

  • It's basically a grid, right, where you have this green long thing that

  • goes in various directions.

  • And it continuously moves throughout the sort of grid space in the game.

  • And then every time you pick up these red dots or whatever

  • object that you want to frame in the game,

  • you're a snake creature which starts off with just one piece will actually

  • get another piece at the end of it at the tail, and you'll grow.

  • And so the catch is the longer your snake grows

  • sort of the more you run the risk of biting your own tail or your own body,

  • so to speak, because you're continuously moving.

  • And when you bite yourself, the game actually ends.

  • And so the goal is to essentially grow the snake as long as possible

  • by eating apples or however you want to visualize the red dot in the game.

  • Hello to Bhavik Knight there in the stream.

  • Thank you for visiting the chat today, visiting the stream.

  • But, yeah, the game that we're going to be making

  • will look very similar to this.

  • We're not going to get too fancy with it.

  • I actually haven't done any prep or any research

  • into how we're going to make the game.

  • I figured we'll just kind of dive into figuring it out on the fly.

  • So that's Dan Coffey in the stream, everybody.

  • Say thanks to Dan for fixing our broken machine today and getting everything

  • up and running.

  • All right, so first things first.

  • In order to start programming something visual or to program a game,

  • we'll need to find some tool, some game engine, to do this for us.

  • And I'm a big fan of a 2D game engine, a 2D framework, called LOVE, which

  • uses Lua as its scripting language.

  • What's up, Steve Benner?

  • Good to see you again.

  • Thanks for coming by.

  • So LOVE is a 2D framework.

  • It's an OpenGL framework strictly catered towards 2D games.

  • And it has a very nice API for game programming,

  • which makes it pretty easy, nice and simple to get into.

  • But it does allow you a lot of low level flexibility

  • that some bigger engines kind of take away from you

  • or at least kind of hide behind layers of abstraction.

  • I'm thinking of things like UNITY, where there's a big learning curve associated

  • just with kind of getting the engine right, getting the UI correct,

  • and not necessarily diving too deeply into code for at least a while.

  • Hello, Elias from Morocco.

  • Good to see you.

  • D. McDermott, good to see you.

  • OK.

  • So we're going to go ahead and take a look at LOVE2D and sort of Lua

  • and its syntax and the different functions therein.

  • In order to get started, you'll need to if you

  • want to follow along whichever version of LOVE

  • corresponds to your operating system.

  • Today, we'll be using the newest version which is version 11, or 11.1 rather.

  • I'm on a Mac.

  • I'm running Mojave.

  • If you are on a Mac running Mojave, you might have some bugs

  • with actually running version 11.

  • So make sure in your Accessibility panel, which

  • I'll take a look at here just for those running on a Mac,

  • if you go to your Security and Privacy, rather, and then your Privacy section

  • here, there is a section of apps that basically--

  • part of Mohave, it seems, allows a lot more

  • apps to have accessibility features.

  • I'm not exactly too sure of the low level aspect of what they do.

  • But they basically allow the apps to have more control over your computer

  • than normal.

  • So in this Accessibility panel here, under the Privacy panel,

  • just make sure that LOVE and Terminal and also whatever text

  • editor you're using are checked.

  • And this is Mac OS X Mojave specific, not specific to Windows per se

  • or Linux.

  • And that's also on version 11.

  • I've gone ahead and downloaded it already.

  • So if I go into my console here, assuming

  • that I've put my executable in the right spot, I should be able to just of LOVE

  • normally.

  • And you'll see this sort of thing with a balloon and a tail that says,

  • "no game" and that's perfectly normal.

  • If you're on a Windows machine or if you're on a Mac or if you're on Linux

  • and you run the binary, you should get the exact same thing.

  • And I have a shortcut to that on my desktop here.

  • Let me just hide everything.

  • That doesn't want to hide.

  • But I have a shortcut to love here.

  • If I double click on that, I get the same exact window there as well.

  • So the reason I'm able to access the binary through my command line

  • is because I've actually aliased it.

  • So if anybody is curious, there's actually

  • instructions for this on the Wiki page.

  • But if I go to nano home directory bash profile,

  • you can see that I've aliased to the command to love to be

  • Application.love.app /Contents/MacOS/love.

  • This is another Mac slash Linux specific thing.

  • But for today's examples, it suffices just

  • to double click the executable that you download from LOVE2D

  • and/or drag your project folder onto that executable.

  • And, again, the instructions available for how to do what I did

  • are on the Wiki.

  • I've got to figure out where the exact page is.

  • I think it's on the Wiki here and then the Getting Started page, yeah.

  • So on the love2d.org/wiki/gettingstarted,

  • you can get some more instructions on to actually pull up LOVE2D,

  • you get it to work by itself, get it to work with files specific

  • to your operating system.

  • Again, I'm using Mac OS X today.

  • Mac OS X is similar to Linux, but Windows will be slightly different.

  • But that's LOVE2D.

  • So once you have that all set up and ready to go,

  • if you've double clicked the executable and you've got that window,

  • then we should be ready.

  • So I'm going to open up my text editor here.

  • And I'm just going to fire up a very simple LOVE2D application just

  • so we can see sort of the backbone of how it works.

  • By the way, sorry, I haven't been paying attention to the chat.

  • OK.

  • So Bhavik says, "I will try Atom.

  • I know a bit of Vim.

  • David uses it.

  • I'd like to useful plugins for Vim."

  • I don't use Vim too often, so I can't actually suggest useful plugins.

  • I know that Jordan Hayashi, one of our alums, uses Vim a lot

  • and has a lot of plugin help.

  • Maybe on another stream, if David gets on,

  • we can maybe ask him what plugins he likes to use.

  • I am not a Vim expert by any stretch of the imagination.

  • But, yeah, Atom is great.

  • Visual Studio Code, VS Code, is great as well.

  • So I'll be using those.

  • But perhaps in the future, we'll take a look.

  • And then Sugo Gruber from Germany, Bhavik Knight says, yeah.

  • OK, awesome.