REHeaderv2: khalby786's REHeader, recreated

Credit: @khalby786’s REHeader.
I recreated REHeader, with Hello-webpage (static) and without Vue. It creates the image using HTML, then turns it into a image using HTML2Canvas. I also added the following:

  • Markdown
  • Description section

I am trying to add the following

  • JavaScript Animations

Project URL: https://reheaderv2.glitch.me
GitHub URL: https://github.com/aboutDavid/REHeaderv2

(HTML now equals HTMI according to my spelling mistake)

Things to do:

  • Add sanitizers to prevent malicious code (suggested by @khalby786)
  • Change renderer from HTML2Canvas to dom-to-image
2 Likes

Sick! Is this open-sourced?

ooo it supports links


I think you need to get rid of the white section

1 Like

Working on it!

Yes! The project is not private, and I will add it to GitHub in a few minutes.

this is awesome!

1 Like

Thank you!

Well, Glitch’s export to GitHub is broken :confused:

Got a new GitHub URL: https://github.com/aboutDavid/REHeaderv2

1 Like

The markdown part is really fancy :sparkles: I’m liking it!

2 Likes

Thanks! I used marked to render it.

1 Like

Make sure to use DOMPurify to sanitize the markdown, or dangerous stuff can happen!

Like what? XSS on a server?

:scream: XSS can happen. :cold_sweat:

I thought XSS only happened on servers. Everything is rendered client-side, so it will work on hello-webpage.

Also can somebody tell me how to set options on HTML2Canvas or recommend a different HTML to Canvas renderer that has decent documentation?

Doesn’t necessarily need to be.

1 Like

I think the main reason I would keep HTML/Javascript is so different fonts and (to eventually) add animations.

1 Like

iframes and SVGs happen client-side, yet they are dangerous sources of XSS. I suggest you do not take the risk.

I’ll add sanitizers tommorow.

2 Likes