Quickly deploying Godot games on the web with Netlify
When I think of video games, I generally still think of an application that is downloaded and runs on the client. Technically, that’s still the case with web-based exports from Godot Engine, since the web browser has to download the files before being able to run them.
I thought maybe I could just run the index.html file locally, but that does not work, as the web-based games with Godot Engine rely on modern browser features that require specific opt-in settings from the web server. If you try to just run the “index.html” file directly, you’ll be greeted with the following type of message instead of the game:
Hosting with Netlify is super simple. Create a new manual deployment, create a zip from the exported files, and upload it. It’ll show the same error message until Netlify is configured to allow the required features. Simply add a
netlify.toml
configuration file with the following contents:
Here’s a tutorial on how to create breakable objects in Blender and Godot. It covers the steps needed to design and implement breakable objects, including scripting and using physics properties to make objects break apart into smaller pieces upon collision or other interactions.
Normally I use OBS for screen recording, but there are cases where it makes sense to use Godot’s built-in movie writer that was recently announced. For example, if you have a slow PC or really demanding game, OBS will skip frames. It makes sense since OBS is just recording what’s on the screen in real …
Are you using @onready to reference nodes? There’s a better way! Here’s a simple example of how many tutorials use @onready to reference nodes: That script is attached to a CanvasLayer node with a ProgressBar called HealthBar. And yet, when running the scene, it will throw an error: This is because there’s actually a spelling …
I had a setup with nested CanvasLayer nodes. Toggling the visibility of the root CanvasLayer doesn’t hide any nested CanvasLayer nodes. My solution was to listen to the visibility_changed signal, find any CanvasLayer child nodes, and apply the same visibility to them.
Quickly deploying Godot games on the web with Netlify
When I think of video games, I generally still think of an application that is downloaded and runs on the client. Technically, that’s still the case with web-based exports from Godot Engine, since the web browser has to download the files before being able to run them.
I thought maybe I could just run the index.html file locally, but that does not work, as the web-based games with Godot Engine rely on modern browser features that require specific opt-in settings from the web server. If you try to just run the “index.html” file directly, you’ll be greeted with the following type of message instead of the game:
Hosting with Netlify is super simple. Create a new manual deployment, create a zip from the exported files, and upload it. It’ll show the same error message until Netlify is configured to allow the required features. Simply add a
netlify.tomlconfiguration file with the following contents:That’s all it took for a Godot Engine web export to come to life.
Related Posts
Making breakable objects in Godot
Here’s a tutorial on how to create breakable objects in Blender and Godot. It covers the steps needed to design and implement breakable objects, including scripting and using physics properties to make objects break apart into smaller pieces upon collision or other interactions.
Making videos for the web with Godot 4’s Movie Writer
Normally I use OBS for screen recording, but there are cases where it makes sense to use Godot’s built-in movie writer that was recently announced. For example, if you have a slow PC or really demanding game, OBS will skip frames. It makes sense since OBS is just recording what’s on the screen in real …
Ditch @onready, use @export instead
Are you using @onready to reference nodes? There’s a better way! Here’s a simple example of how many tutorials use @onready to reference nodes: That script is attached to a CanvasLayer node with a ProgressBar called HealthBar. And yet, when running the scene, it will throw an error: This is because there’s actually a spelling …
Toggling Visibility of Nested CanvasLayers
I had a setup with nested CanvasLayer nodes. Toggling the visibility of the root CanvasLayer doesn’t hide any nested CanvasLayer nodes. My solution was to listen to the visibility_changed signal, find any CanvasLayer child nodes, and apply the same visibility to them.