Unlocking VSCode's power to make GAMES in C

hello everyone and welcome back to the channel today we're going to be talking about the vs code Ray lib workflow that I've been using in my videos and I will continue to use in my videos for all of my demo projects if we take a look at the ray lib GitHub repo we can see that there is an examples in a projects folder within railib the examples is a ton of examples created by Rey and a bunch of other Ray lib contributors to show off some of the features in railib and some of the absolute most basic ways that you will accomplish some of the everyday tasks in railib but back on the root of the repo you can see there's this projects folder and in here there's example projects for a bunch of different common editors so you can see here the vs code is only really for Windows and Mac OS there's no configuration in there for Linux if you're using Linux you're probably using Sublime Text or of course you can just use cmake directly through the terminal so if you have your own local copy of Ray lab as I do then you can go into the projects folder where there's the vs code folder and we can just copy this somewhere and we can kind of use this as a template when we're building a Rayleigh project so I can create a new empty folder and just copy these contents by the way if you want to open a folder in vs code it's easiest if you can actually select the folder and just drag it into this main Central Area if we have a DOT vs code folder in there then it can initialize these and use these to help set up our workspace so just to give a really quick overview of what's in here there's the C and CPP properties which is going to set some important things like include path so that our editor will be able to tell us if a file we're including doesn't exist and there's also some other helpful things the C standard and CPP standard so that if you're trying to use something that isn't supported by the standard that you are going to be compiling to then it can help you out with that to be fair this compiler path value isn't going to be used by the make file which is really what drives the build our build workflow is a matter of the launch and tasks Json files which we're going to get at in a second and the make file itself and those are kind of the the pipeline so when we try to launch a program by pressing f if it's going to perform one of these launch operations so for instance if we have debug selected then it's going to try and run this program which is going to be workspace folder file base name no extension so if we have main.c selected that's kind of it's looking for main.exe and we can see there's a path to the debugger that we're going to be using and there's a pre-launch task which is build debug and we can see where this is defined in tasks.json so build debug is here and we can see that it has some arguments so it's going to make sure we're on desktop gonna build it in debug mode there's a project name which the project name will be defined by whatever the current file we're looking at is so again Main and there's an object here which is then also being overridden again here this is just again we're using this for the actual make file we'll see what all of that means shortly and there's also an OS X case that's already set up here and then there's a build release and it's a lot of the same stuff but the idea is that when we press F5 it's going to trigger that launch which is going to trigger this task and in order to build what we're talking about in the tasks here it runs the command make now when we run this command make it's going to run the make file now there's this Big Blob at the top here this is a comment that is from Ray that is basically like a license if you're working in a closed Source scenario if you're doing something that's actually commercial and you're not going to be sharing the source then based on what I've read here it's not required that you leave this stuff in but I think it's a it's a it's easy to do comments don't affect the built program it's 20 lines whatever that being said we are free to modify this file to suit our needs and we're going to be doing that today now this make file is a particularly large make file if I just quickly scroll through this whole thing here we're hitting 400 Lines no problem now a lot of this stuff is huge blocks of comments like this here and for the purposes of actually explaining what's going on here today I'm going to clear all this stuff out okay so I've just moved through and removed a bunch of the comments and now we're down to 300 lines granted like I said I still kept this 20 lines up here and there is a few blocks that I did keep because I think they are helpful so the idea is that at the top here is a bunch of parameters that we might actually change so for instance the railib path dot dot dot dot this is saying go up to directories and where it used to be in Ray librarelib examples that was true now I need to actually Define the path to be what it really is and since I know it's exactly here I'd rather give an absolute path so we could set up the project name we can set up important paths which generally are only going to have to do once most of these down here we're not going to change ever really except for build mode so I'll move build mode up here because it is just helpful to be able to switch between release and debug or call that the launch and tasks are going to make this debug anyways this little thing here the question mark means we're setting it only if it hasn't already been set so project name is going to end up getting set to main so even though it says game here it's actually being stomped out by the visual studio Pipeline and we're going to address that later so this first section here this is our first bit of of switching logic where based on the current platform we're just trying to figure out uh you know the platform OS and things like this that we're going to use later so this first part here is all just switching based on the platform there's a special section here for web builds and I will be making a follow-up video at some point talking about building for web because there's a few changes you have to make it to your program and there's just some helpful things that it will be nice to go over regarding HTML and CSS that are just related to making a more presentable web build down here is the first parameter that you might actually want to change if you're using C plus instead I want to remind you that raylib is built in C and it's built in C in such a way that it can be used in C plus plus Plug and Play like you don't need to change virtually anything about Ray lib you do have to edit your make file but that's a given you have to change your build pipeline if you're changing the language but if you are going to use C plus plus and Ray lib I strongly recommend that you actually seek out one of the C plus plus bindings where they may make better use of the language specific features of C plus plus down here is another really important thing that we're defining so it's the C Flags which is compiler Flags these are the flags for GCC that will change how the program is built one that's really important is the standard of the language considering if you're using certain language features that were added later you'll want to change this value also wall which means to turn on pretty much all of the warnings that there are warnings are warnings or notes from the compiler that won't prevent the program from building or running they're just flags that are saying you might want to take a closer look at this there may be a mistake sometimes they can be really annoying but generally speaking if you have warnings you should address them these are just hints to keep you on the path of the standard of the language instead of just you know just because it compiles and it works on your machine doesn't mean it's always going to work and warnings kind of help bridge that Gap we don't have to worry about changing really any of these C Flags right now this make file that we got from the vs code template there's actually a bit of a mistake here at least in my version which is that we're defining two linking Flags in the compiler flag X so C Flags is for the compiler we're going to see in just a little bit that there's also the LD flags for the Linker and these are Linker Flags we're trying to link the railib RC data file which gives us the Little Ray lib icon for the app this linking flag here is going to hide the console window when we open the app so by default we're going to get a command prompt whenever we run our app and by including this in the linking Flags it'll prevent that if we leave these in the compiler Flags then we're going to get a bunch of extra warnings when we get to multiple source files later and we're not going to be properly blocking the console window which is something that we we want to do at least when we're building for release so for now I'm going to cut these and stick them in a notepad the next notable thing here is the include paths declaration which is where we specify any directories that the compiler should look for header or dot h files these two that are at the end are going to allow us to find important header files that raylib needs as well as some things that we can use directly in our program just as an example if we first look in Source we can see there's quite a few header files of course the one the most important ones Ray lib which is the kind of the core header that we need in all of our examples also array math which I like to use in a lot of my demos that one is in here also a few other really cool details that I don't think we've covered yet on the channel like easings like fizack and then beyond that we also have the source external and there's a bunch of headers in here that we can use directly in our program that I don't know if or when I'll get to but we need these at least for a bunch of the raylev utilities so it's important that we include them next up is the LD Flags so these are going to be used for the Linker and this is where there was that piece that I knew we were missing from before so I'm going to go ahead and paste it here so I want to add to the LD flags as long as we're on Windows I may want to make sure that I'm adding the RC data and specifically in the case where we are building the release I want to add this so that we don't get the console by the way if you don't feel comfortable editing the make file and you don't want to worry about doing that while you're following along with the video I'm going to include a finished version of this template in the description moving along here there's also this LD Libs which what value we're going to use is going to be very platform specific I don't want to get into how a Linker works at the very high level because it's quite a complicated subject it's not really necessary that we understand how it works at such an intimate level in order to use the make file at this point we've defined almost all of the parameters for the build and there's just a few last minute things here before we get to the recipes there is a recursive wildcard function that was written here that I have not been able to get to work so I'm just going to be removing next we have the source dirt and object dirt which are the directories for the source files and the build files respectively next here we're defining all the object files from the source files so we're using this recursive wildcard function which I've just removed to grab all of the source files and then there's this commented out basically it's like a path substitution where we're replacing every mention of a source directory with an object directory and replacing every dot C with DOT o but it's commented we really want this so I'm going to uncomment this and I'm going to remove this old objects line now I'm going to replace this recursion called with the regular energy and you make Wild Card call and I want to grab all of the source files from the sourcer so what this line is going to do now is going to grab every dot C file from The Source directory and store them all as a list in here then this object is going to be set equal to this Source interpreted as a list but for each entry we're going to replace the source directory with the object directory and we're going to replace dot C with DOT o this line is US defining all of the object files that we're going to need in order to actually link the executable and build our program now we're getting down here to the recipes so the main recipe is the all recipe which is what's going to be called when we just type in make in the terminal and when we do that it's going to call make again with make file params and our default value of makefile params is going to be the name of the project in order to build the main it needs to have all of the object files and for each object file that we're missing here is how we get them from the source code so this recipe right here is one of the most important ones This Is Us calling the actual compilation on the files so this will generate all of our DOT o files and then we'll be able to come back up here once they're all up to date and we can link them together so these are the the kind of three main recipes so for now I'm going to go over to main.c and press F5 and we're going to see what happens okay so I pressed F5 on main.c and I got the uh compiled program just like we would really come to expect so at this point we've made a bunch of changes to the make file but we haven't broken the functionality which is that I can select a single dot C file press F5 and it will build the game now if your workflow is going to involve editing a single dot C file and spinning out an exe then you're done congratulations but we have a lot more stuff that I want to cover in this video first of all there's no notice in this comment here that I need to actually maintain it for any Source distribution so I'm just going to remove that to simplify this now if I select something other than main.c for example if I select the make file and hit F5 then I can see there's an error down here which says no rule to make Target and make file.c needed by make file that's because it's defining the project name as the file that I currently have open so you can see here project name is make file and objects is makefile.c this is because of how the launch and tasks Json files are set up so first I'm going to go to tasks and right here we're defining the project name and the object based on the current file name so I'm going to remove anything that has this file base name no extension I don't want these anymore next in the launch.json I'm going to do a similar thing except I can't just delete this because we need to specify the program otherwise when we press F5 it's going to build but we're not actually going to run anything workspace folder is okay but right here I'm just going to go ahead and write Main and for Windows I'm going to write main.exe by the way if you want to call it something else you can change that here just make sure that this part matches up here and of course I'm going to do this for the other configuration as well now the last thing I want to do is in the make file I want to make sure to update my project name to main to match what I just changed over there now if we inspect this terminal really quick it says gcco Main and it's trying to build a file just called main so that reminds me that we should probably add a definition for the extension here it says I'm on Windows that's going to be dot exe but of course this doesn't totally fix everything we're still getting these crazy errors and trying to understand this error which is C raylev w64 devicate bin dots this is like nonsense we don't even know what this means but I'll just tell you right now that I've got a suspicion that there's an issue with acquiring the source and the object files if we can jump back down here we can see that we're scanning The Source directory for all the C files and we're using those to define the object so what's happening is we're trying to build main.exe but we'd have no code units that we can actually use so I need to make sure that I actually move the main.c file into the source folder like so pressing F5 again great success so we're back where we were before we're building the game again we're still using just the one file and we haven't really accomplished anything except for the main difference that now I can have the make file selected and I can press F5 and it still works the main reason that we wanted to change that particular feature by the way is because when we're working in multiple files you might have a different code file open when you press F5 having main selected isn't going to help you at all okay at this point we need to introduce a new file so in Source I'm going to create a new file and I'm going to call it second.c this is just my second source file we need to have a prototype before the function is ever called and ideally even before we Define it so we also need to add a header file I'll just give it the same name as the dot C file and match the convention now in our header file we should start with something like this this is an include guard this is something that we want to use to make sure that if we were to have second.h included twice in the same file we wouldn't actually include it twice in that file and cause a bunch of crazy errors what this is saying is if not defined second.h meaning there is no second underscore H underscore that term is not defined yet anywhere in the program then we will Define it as being everything that is after this defined but before this end if we can leverage Visual Studio codes code snippet feature to make it so that adding this boilerplate to every new header file will be a little bit easier always going to be if not defined defined and if and these two things will always be equal we can do this really simply Ctrl shift p opens the command palette and we can type in Snippets to see configure user Snippets you can make it a snippet file for this project since we're going to be using this project as a template so when we click on new Snippets file we need to type in a name that we're going to store the Snippets in I'll just call it Snippets because I don't really care and there's a huge thing on exactly how it's going to look for us to create a new snippet so if we go ahead and uncomment this example we can use this as a template I'm going to remove the scope requirement replace this prefix with header and I'm going to paste these into the body now each line needs to be in quotations like this and they should be comma separated as well we can use these numbered values to basically set parameters in the snippet I'm going to put dollar one where we have this second H since that's like the first parameter of the snippet and I'm going to put dollar zero in this white space since that's where the cursor will end when we're done with the snippet also we can label these variables like so so that we're reminded of what we're actually supposed to put there and now we should just put a proper description okay now let's go ahead and try this thing out so if I type in header we get this include guard I can hit enter I can go second underscore H and when I hit tab it's going to put my cursor in here and now I can start writing my file now in our second.h let's go ahead and Define some new function I'm using the very typical way of naming a function that does nothing and in second.c we're going to want to include second dot h which you'll notice it comes up here in our list and now we can give this function a real body now printf doesn't actually exist here we're in our own translation unit and printf is not a real thing yet second.h never mentions it when it comes to including things that we actually need to define the functions we want to try to keep those in this translation unit because we don't want to wastefully be including things in this header file we want to try and keep this lightweight the whole purpose of splitting up the source is to try and make the project a little more lightweight so now in our main file I'm going to go ahead and include second.h and right before we edit the window I'm going to run fun one so just as a review we have main.c which is the actual program then we have second.c and then we have second.h second.h doesn't need to be compiled it's just a header file but second.c and main.c both need to be compiled and then Linked In order to build the app let's go ahead and press F5 and see if anything breaks sure enough the game built just fine and if I scroll up in the terminal we can see way down here fun one is happening now in the middle of my log I forgot to put a new line at the end of it so it kind of looks bad I can make it more obvious if I put a few new lines and to demonstrate that we don't need to have main.open I will actually press F5 from this file this time and we can see if we scroll out there fun one is happening now for the most part we have everything we need to be able to create multi-file projects so in the spirit of trying to make these videos a little bit shorter I'm going to go ahead and stop here we've got vs code in a place where we've got a little sample project we can use it as a template to create multi-file projects moving forward I'm going to release a follow-up video here where I'm going to take the Apple catcher project that we just built in my last video and I'm going to break that up into multiple files and we can see the benefits of the simplified compilation and we can also see what kind of refactors involved there and we're going to find that taking a project that was originally single file and make making it multiple files is not actually the most uh exciting thing and it's not really easy it's quite error-prone but if we design our project from the beginning with this in mind it will make development a lot faster we're going to break that up into multiple files and we're going to see how that changes the workflow thanks so much for watching if you liked the video please give it a like if you want to subscribe I've got more videos coming in Ray lib and C eventually we'll move on to C plus plus we're going to start ramping up here on the on the channels content so be sure to come back and check that out and leave me a comment down below if you've got a fun idea for a game project that we can tackle or something that you want to see me cover whether it's Ray lib C C plus plus let me know in the comments thank you so much for watching and we'll see you next time

Channel: Andrew Hamel Codes

Views: 16,046

Keywords: raylib, C Programming, Game Development, Andrew Hamel, raylib C, C99, VSCode, Programming Tutorial

Id: xWWqhQ1JnvE

Length: 18min 49sec (1129 seconds)

Published: Tue Feb 28 2023