Viewing profile — HunorBorbely

In this advent calendar-themed tutorial, you will learn the fundamentals of Scalable Vector Graphics (SVG), from the basics to advanced concepts like animation and interactivity.

In this JavaScript Game Tutorial, we code a modern version of the 1991 classic game, Gorillas! This tutorial is both a JavaScript Game Tutorial and an introduction to the HTML Canv…

Day 24 is a basic example of React + SVG. Once you get the basics of React you can just start coding images based on this tutorial.

Thank you. The whole project actually started as an advent calendar. Then I started thinking okay, what should be the content of it :)

True. When you make art with CSS then you don't start with Illustrator either

Yes, I was thinking of fixing the second point, but then I was annoyed with it and left it like that. If I knew that it blows up here on Hacker News I would have fixed it. I'm not …

It's an interesting point. Writing tutorials like this also made me realize what's the difference between a function property and a function argument. I just used them completely i…

Added a Table of Contents below. Probably it helps SEO as well :)

Lol :) Maybe I should just put this below the calendar. What do you think?

Ouch. Some browsers might not support every feature. Gradients also have some issues. Luckily it seems to be all right so far in desktop browsers.

The funny thing about writing tutorials like this as a non-native speaker myself is also googling how to call things like the "clapper". I also didn't know what it was called befor…

Super cool effect. Yes, SVGs can be a rabbit hole. This is just scratching the surface of it

Thank you for the great feedback, I really appreciate it. I fixed some errors you found. Let me know if something still doesn't work. It's still a bit in the process of fine-tuning…

Totally. There are many cases when HTML Canvas is way more performant, but if you don't build the next Figma, then working with SVG is way more convenient

Thank you, I'm glad it helped. Cool comics!

Yes, and imagine if I would have figured out how to do the view transitions properly :)

Okay, I fixed the links to the interactive demos (somehow deep links do not always work on that site, probably because it's made with Vue). I don't see the problem with bio.link. W…

Yes, there's some bug with using gradients that I couldn't figure out yet. Are you looking at it on mobile? On desktop it works for me

Good catch. Yes, I rearranged some chapters and I missed this link. Thank you, fixed

With text I wasn't experimenting too much, apart from the example where it follows a line. I know there is text anchor: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/t…