OpenGL Tutorial 0

There are a bunch of really nice OpenGL tutorials on the web that can get you started on your graphics programming journey. OpenGL is pretty outdated for professional purposes these days, but every graphics programmer (and educator) I know agrees that learning graphics programming with Vulkan or DX12 or whatever is not the way to go - OpenGL still has a valuable role getting started, without having to simultaneously learn a thousand things all at once. Remember, most experienced graphics programmers nowadays who work with more modern and advanced graphics APIs learned graphics on simpler APIs at first.

However, a few people I've spoken to have struggled with the first hurdle, because OpenGL tutorials often try to be platform agnostic or whatever - they often start by saying "get a programming environment of your choice set up, but the details will vary by operating system" or whatever, and beginners can be stymied by this.

For that reason, I hereby present one of the tutorials that could come before those tutorials. This will be made for Windows, with Visual Studio (not to be confused with Visual Studio Code) as your IDE, and GLFW as your windowing manager. We'll be using C++ as our language (although that's usually baked into the OpenGL tutorials in question anyway). If you follow these points precisely, you should be able to arrive somewhere so you can start learning some graphics programming.

So, let's go! You'll need to start by installing Visual Studio. At time of writing, we're up to Visual Studio 2022, and you want the Community Edition (that's the free one). If you've done any C++ programming in Visual Studio on your PC you should already have this. If you've used Visual Studio but not for C++, you might have to run a different program that's already installed called Visual Studio Installer, modify your installation, and select the "Desktop development with C++" component. You don't need "Game development with C++" despite the fact that that might be what we're about to do. Get to the point that you can write/compile/run Hello World in C++, then we shall continue.

Downloading some stuff

We'll need a few things downloaded beyond Visual Studio. Let's run through them.

GLFW: GLFW is a library that manages windows (with a lower case 'w'), user inputs, and a few other things like that. It is made to work with OpenGL (it stands for GL Framework), but it isn't OpenGL - OpenGL doesn't handle windowing and input and whatnot on its own. Other systems that serve a similar purposes are things like SFML, or SDL. You might come across something called GLUT, but if a tutorial tells you to use that, it's very outdated. Pop on over to the GLFW homepage, but don't just click the obvious download button - that'll get you the source code, which will complicate our lives a bit right now. Instead, follow the link to Downloads, go to 'Windows pre-compiled binaries', and get the 64-bit binaries.

GLAD: GLAD is an OpenGL function loader. It's not very interesting right now why this is necessary - it's to do with Windows not technically supporting modern OpenGL, but the functions you need are hiding in the graphics drivers. A bunch of these exist - GLEW (GL Extension Wrangler) is a common one, and Galogen, and a few others. GLAD isn't something you download, exactly, but rather there's a generator that creates the files you need. You can find this at GLAD's website. Set 'language' to C/C++, 'specification' to OpenGL, and 'profile' to Core (you can use Compatibility if you want but it will enable a bunch of really outdated stuff that might confuse you). For 'api' set 'gl' to the latest one (4.6 as I write this, and I think that's unlikely to change) and leave the others (gles1 etc) as None. You can leave 'extensions' empty. Under 'options' check 'generate a loader', and don't check 'Omit KHR'. The last one, 'Local Files', should be checked (this means that local include statements will use quotes rather than chevrons, but don't worry about it much for now). Then, hit Generate. This will take you to a temporary page that lists some generated files. Grab 'glad.zip' (it should contain the other files).

glm: This is a commonly used maths library that works nicely with OpenGL. We don't require this for this tutorial, but it's commonly used in other OpenGL tutorials, so it might save you some pain getting it sorted out now. It's a header-only library, and you can grab it from GLM's github page. Download the source from there - specifically, the contents of the folder 'glm' is what you're actually going to need for your project.

Hooking things up

Now we're going to actually create a Visual Studio project. Our emphasis here is to do it some way that works - there are lots of ways of doing this, and for now I'm going to assume you don't especially care, and just want something that will minimise pain. So, let's get started.

  1. Run Visual Studio, and create an empty C++ project. Call it something other than 'new project' or whatever. It is mildy irritating to change this later, but not the end of the world.
  2. Under 'configuration' set the platform to x64 (it might initially be set to x86). This is to match the 64-bit version of GLFW we grabbed earlier.
  3. Create a new source file - specifically a cpp file - in your project. I usually call this file EntryPoint.cpp, but main.cpp works, or whatever you like. This might seem trivial to do later, but don't skip this step! Certain options in Visual Studio project settings only appear when there's at least one cpp file present (don't ask), and you won't be able to find them later.
  4. Now we're going to copy some of our previously downloadeded stuff around. It's important to understand that we're doing this in your computer's file system, not in Visual Studio's solution explorer. I tend to put all this stuff within the folder Visual Studio created my project in, to make things more portable - don't take that as gospel though, as it's arguably a bad habit for organising bigger projects. In any case, I set things up thus:
    1. Create a folder in your solution folder (alongside YourProject.sln) called GLFW. Within the GLFW stuff you downloaded, find the 'include' folder, and within that, a folder called 'GLFW'. It should contain two headers. Copy those into your project's GLFW folder. Now (back at the root of the GLFW zip) find a folder that matches your compiler - so lib-vs2022 in this case - and copy glfw3.lib into your project's GLFW folder. It should contain three files now - glfw3.h, glfw3native.h, and glfw3.lib.
    2. In your downloaded 'glm' stuff, find the subfolder called 'glm'. It should contain a bunch of stuff, like folders called 'detail' and 'ext' and 'etc', and also a bunch of .hpp files. Copy that whole folder into your project alongside the GLFW folder you created.
    3. Get the 'glad' zip you downloaded. It should contain three source files. Just copy them alongside your project's source, alongside EntryPoint.cpp or whatever you called it.
  5. Now go into Visual Studio again, and we need to make sure it knows where this stuff is.
    1. First off, let's point it to the GLAD files we added in the last step. Right click on the project in the solution explorer and select 'add existing', then find those three files and add them in.
    2. Right click on the project again, and go to its Properties page. Once you're there, select 'all configurations' under the 'configuration' drop down, so we don't have to set everything twice (for Debug and Release modes). You might also want to double check we're on x64, rather than x86.
    3. Go to the 'C/C++' section. If this isn't here, it's probably because you skipped the step earlier where you created a cpp file in your project! Now, under that heading, under it look for 'General', and at the top, 'Additional Include Directories'. You'll want to add some folders here. You can use an alias called 'SolutionDir' to refer to the folder that has your .sln file in it - this can help make the project portable. So you'll want to add $(SolutionDir)GLFW and $(SolutionDir)glm here (it's a semi-colon-separated list).
    4. Go into the 'Linker' config propery now. Under the subheading 'general' here, look for "Additional Library Directories". Here, create a reference to the GLFW folder again (that is, add $(SolutionDir)/GLFW to it). You needn't do anything for glm - it's a header-only library so there's no precompiled lib files to link.
    5. Finally, still under 'Linker', find the subheading 'input'. At the top is "Additional Dependencies", which will already have a bunch of stuff in it. Add 'glfw.lib' to this.

In theory, that's all done! We should be able to start writing code. But let's check and make sure.

The part where we check and make sure

Let's check and make sure that everything is hooked up. We've gone a while without actually running anything, so we might have come off the rails without knowing it.

Put the following code into your EntryPoint.cpp (or whatever) file and try compiling it.

//These includes are specific to the way we've set up GLFW and GLAD.
#define GLFW_INCLUDE_NONE
#include "glfw3.h"
#include "glad.h"
      
int main(void)
{
  GLFWwindow* window;
    
  //Initialise GLFW, make sure it works. You can print a proper error message if you like.
  if (!glfwInit())
  {
    return -1;
  }
      
  //Set resolution of your window and give it a title.
  window = glfwCreateWindow(1280, 720, "TODO make this name something cooler", nullptr, nullptr);
  if (!window)
  {
    glfwTerminate(); //Put a real error message here some time
    return -1;
  }
        
  //This tells GLFW that the window we created is the one we should be rendering to.
  glfwMakeContextCurrent(window);
      
  //Tell GLAD to load up all its OpenGL functions.
  if (!gladLoadGL())
  {
    return -1;
  }
        
  //The 'main game loop'
  while (!glfwWindowShouldClose(window))
  {
    //Clear the screen. Eventually you'll want to do your actual rendering here (AFTER the clear!)
    glClear(GL_COLOR_BUFFER_BIT);
          
    //Swapping the buffers - this mean this frame is finished.
    glfwSwapBuffers(window);
          
    //This tells GLFW to check for stuff going on with inputs, window resizes, etc.
    glfwPollEvents();
  }
        
  //At this point the window has been closed by some means, so we should clean up GLFW and exit.
  glfwTerminate();
  return 0;
}

Hopefully, that runs! If all is well, it should create a window with the name you gave it, and (importantly) you should be able to resize it, drag it around, and close it (and then your program should exit).

If that all happened, you have finished tutorial zero! With the set up you've done here (which you can replace with something else later if you like), you can now take a run at something like OGLDev's tutorials!