Out of many of my interests I mention a couple on my about page. Next to astronomy, videogames, VR/AR, and many more, my main interest lies in programming and web technologies.
If I have to choose one, I will stick to the theme of the project and go for the HTML canvas. This element introduced me to programming, and that is why it deserves some extra attention.
HTML Canvas
The HTML canvas is an element which can be used to draw graphics with javascript. When you think of drawing graphics as rendering and manipulating them in this element, than you can quickly see how this simple html element can create some fun and sometimes pretty impressive features. In my case when I first started programming, these where web games.
The canvas can be created with plain html and css: <canvas id="myCanvas" width=" " height= " " style="border:1px solid black;"></canvas>
This html snippet will result in the following canvas.
How it works
I am going to keep it short, but if you want, you can allways visit the MDM Web docs. To start drawing on the canvas you need to get the elements context with java script through the canvas API. In this context you can start drawing using the CanvasRenderingContext2D interface.
Once you've declared the basics you can do all sorts of thing using this API. For example...
Get evenets such as your mouse position
Draw, animate, render and calculate collisions
Offcourse this isn't a web game yet but you can see how the few features I showed can get you a long way. 😊