{"id":162,"date":"2020-12-26T21:53:10","date_gmt":"2020-12-27T02:53:10","guid":{"rendered":"https:\/\/cynthiamcmahon.ca\/blog\/?page_id=162"},"modified":"2023-01-02T19:43:20","modified_gmt":"2023-01-03T00:43:20","slug":"web-game-programming-tutorials","status":"publish","type":"page","link":"https:\/\/cynthiamcmahon.ca\/blog\/web-game-programming-tutorials\/","title":{"rendered":"HTML5"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/web-tutorials-1024x576.png\" alt=\"Web Game Programming Tutorials\" class=\"wp-image-492\" srcset=\"https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/web-tutorials-1024x576.png 1024w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/web-tutorials-300x169.png 300w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/web-tutorials-768x432.png 768w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/web-tutorials-1536x864.png 1536w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/web-tutorials.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\">Web Game Programming Tutorials<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Web Game Programming Tutorials<\/h2>\n\n\n\n<p>This page is dedicated to my web game programming tutorials. They will use ASP.NET for the back end. Also, they will use ES6 so there will be no compatibility with Internet Explorer without adding polyfills. If there is something you would like to see a tutorial on leave a comment and I will do my best to do it justice.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-css-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Dragon&#8217;s Claw<\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/DragonsClaw-1024x576.png\" alt=\"Dragons Claw Web Game Programming Tutorials\" class=\"wp-image-493\" srcset=\"https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/DragonsClaw-1024x576.png 1024w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/DragonsClaw-300x169.png 300w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/DragonsClaw-768x432.png 768w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/DragonsClaw-1536x864.png 1536w, https:\/\/cynthiamcmahon.ca\/blog\/wp-content\/uploads\/2021\/01\/DragonsClaw.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\">Dragon&#8217;s Claw<\/figcaption><\/figure>\n\n\n\n<p>The Dragon&#8217;s Claw tutorial series is about a sci-fi themed strategic MMORPG similar to the game Utopia. You raise an army and try to conquer the galaxy with your empire.<\/p>\n\n\n\n<p>The complete code for the tutorials is available in my GitHub repository. You can find it here:<br><a href=\"https:\/\/github.com\/Synammon\/DragonsClaw\" target=\"_blank\" rel=\"noopener\">https:\/\/github.com\/Synammon\/DragonsClaw<\/a><\/p>\n\n\n\n<p>After registering on my main site you can see the game in action here:<br><a href=\"https:\/\/cynthiamcmahon.ca\/game\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/cynthiamcmahon.ca\/game\/<\/a><\/p>\n\n\n\n<h4 class=\"tutorial-title\">Tutorial 01<\/h4>\n<div><p><a href=\"https:\/\/drive.google.com\/file\/d\/1Ovz3re7KST_DSuBAQfh5vCPbBgZvhVEY\/view?usp=sharing\" target=\"_blank\" rel=\"noopener\">Creating Project<\/a> &#8211; This tutorial goes over creating the project and creating a player.<\/p><\/div><br>\n<h4 class=\"tutorial-title\">Tutorial 02<\/h4>\n<div><p><a href=\"https:\/\/drive.google.com\/file\/d\/1hAGUiKXexXFRdQSXX_7ikGBEtAaKHzZC\/view?usp=sharing\" target=\"_blank\" rel=\"noopener\">Creating Empires<\/a> &#8211; This tutorial goes over creating empires.<\/p><\/div><br>\n<h4 class=\"tutorial-title\">Tutorial 03<\/h4>\n<div><p><a href=\"https:\/\/drive.google.com\/file\/d\/1pgMA9wHUiHv5EWnsxFjscbI8iv-SGh5F\/view?usp=sharing\" target=\"_blank\" rel=\"noopener\">Troop Training<\/a> &#8211; This tutorial goes over training troops.<\/p><\/div><br>\n<h4 class=\"tutorial-title\">Tutorial 04<\/h4>\n<div><p><a href=\"https:\/\/drive.google.com\/file\/d\/1gFWd16v2YzcsUaZHch1vL1vBwwQL1p7r\/view?usp=sharing\" target=\"_blank\" rel=\"noopener\">Troop Training Part Two<\/a> &#8211; This tutorial continues on with training troops but on the back end this time.<\/p><\/div><br>\n\n\n\n<hr class=\"wp-block-separator has-css-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Tile Engine Tutorials<\/h2>\n\n\n\n<p>These web game programming tutorials are about creating a tile engine with HTML5 and JavaScript. They will end up creating a full game that is a bit of an RPG. It is best if they are read in series. There is a GitHub repository with the latest version of the code here: <a href=\"https:\/\/github.com\/Synammon\/TileEngineJS\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/github.com\/Synammon\/TileEngineJS<\/a><\/p>\n\n\n\n<h4 class=\"tutorial-title wp-block-heading\">Part 1 &#8211; The Basics<\/h4>\n\n\n\n<p>This tutorial creates the basic tile engine that we will be using through out the rest of the tutorials. It is multilayer tile engine with multiple tile sets per map. It renders using a 2D camera.<\/p>\n\n\n\n<p><a href=\"https:\/\/drive.google.com\/file\/d\/1_ZeGEomwQ2oQGjaqm2x839KsRq1O950f\/view?usp=sharing\" target=\"_blank\" rel=\"noreferrer noopener\">Part 1 &#8211; The Basics<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">General Tutorials<\/h2>\n\n\n\n<p>These web game programming tutorials are about general game program with HTML5 and JavaScript. They will be on a wide array of topics from animation to collision detection and more.<\/p>\n\n\n\n<h4 class=\"tutorial-title wp-block-heading\">Part 1 &#8211; Sprite Classes<\/h4>\n\n\n\n<p>This tutorial creates two basic classes. The first is a general sprite class and the second is an animated sprite class.<\/p>\n\n\n\n<p>Part 1 &#8211; Sprite Classes<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Web Game Programming Tutorials This page is dedicated to my web game programming tutorials. They will use ASP.NET for the back end. Also, they will use ES6 so there will be no compatibility with Internet Explorer without adding polyfills. If there is something you would like to see a tutorial on leave a comment and &hellip; <\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-162","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/pages\/162","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/comments?post=162"}],"version-history":[{"count":22,"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/pages\/162\/revisions"}],"predecessor-version":[{"id":993,"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/pages\/162\/revisions\/993"}],"wp:attachment":[{"href":"https:\/\/cynthiamcmahon.ca\/blog\/wp-json\/wp\/v2\/media?parent=162"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}