HN Explorer

58 comments

[ 2.6 ms ] story [ 130 ms ] thread
jansan
I really like that suble off-white coloring (sorry, someone had to say it).
V__
You have nothing to apologise for.
[deleted]
(comment deleted)
seangrogg
I came to the comments explicitly looking for this :)
simonw
Suggestion: instead of just my GitHub username under my name, it would be nice if it showed github.com/simonw
scastiel
Fantastic idea, let me add it ;)
mthld
Nice project! Sadly the emojis present in my GitHub bio aren’t being rendered. I can’t see them in the image. :)
scastiel
Yes, there was a bug with the image not rendering with certain emojis, so I had to remove them as a quick fix. But I’ll investigate to find a way to show them :)
franky47
You'd have to load a special font that has extended Unicode support to render Emoji. Not sure how that's done in Vercel's OG generator.
sureglymop
I'm interested in your book. Is it available as epub or pdf somewhere? Or do I get those formats when I buy it on Amazon?
scastiel
Hi, for now the book is available only on Amazon (Kindle format), but you’ll find many tools on the web to convert it to ePub or other. Also, you can read the book online using Amazon’s reader. Hopefully this is good enough for you :)
bonney_io
Very cool project! What do you think about including a QR code linking back to the user's GitHub page on the rendered card?
scastiel
I did it at the beginning (it’s quite easy), but I think it took too much place on the image, and wasn’t sure it was that helpful.

I’m planning on adding a few customization options to the generation. I may add the QR code as one :)

zadjii
Silly suggestion - show something like the contribution graph along the very bottom of the card, like a border. Those who know what it means will _know_, to everyone else it's just decorative.
DistractionRect
Seems broken on Firefox for Android (mobile). It displays half the card [0].

[0] https://imgur.com/a/CQ7QXkB

jonas-w
I'm using firefox nightly on android and it displays normally. Maybe your internet connection?
isatty
Nah it happened to me too (Chrome stable, perfect internet connection). Refreshing fixed it.
cobertos
Huh, `@vercel/og` is interesting! It looks like the same approach as `html2canvas` (implement custom rendering for each HTML element + CSS property), with all the tradeoffs that entails, but they actually rightly limited some of the features they're willing to support (like external stylesheets). And it looks like it'll be more supported than `html2canvas` currently is.

I quite like `dom-to-image-more` (sorta active fork of `dom-to-image`) that renders a SVG with a foreignElement that is a data URL of an XHTML page to a canvas. It also led me to rewriting my own image rendering stuff to just build an SVG in DOM, use toDataURL on it, and then render that in a canvas. So much simpler

notpushkin
SVG is a really underrated medium. The only thing I miss compared to HTML is flexboxes (but there's always stuff like react-flexbox-svg [1]).

[1]: https://github.com/metabolize/react-flexbox-svg

Edit: for a React-less implementation, see https://blog.scottlogic.com/2015/02/02/svg-layout-flexbox.ht...

scastiel
html2canvas and similar libraries only work in the browser, and this is why @vercel/og is that interesting! Not only it runs on the server (in an Edge serverless function), but it doesn’t have to start a headless browser to make screenshot and generate the image ;)
cobertos
How could I forgot about that part! Yeah, super useful for that platform. I had so much trouble finding the GitHub repo for it to check their methodology earlier I forgot about that lol
prepend
Neat idea. It does not render properly for me as I have multiple links, @leebrian.

Maybe only use the first link. Or wrap a little bit to allow for multiple lines.

arriu
Awesome! Made a change to my profile as a result but I guess the site is caching generated profiles. How long is the cache?
blurrybird
This is excellent! Simple, works, fast.

It would be neat to see you do a Twitter version!

strangescript
This is cool, but I am not sure how useful following count is on there. As others have pointed out, it would be neat to see some kind of aggregated contributions.
longerpath
Can we see Paul Allen's card?

(Does he have a GitHub?)

dmak
Feels weird to be flexing github followers on a business card especially since github is less about social influence.
tr1ll10nb1ll
True but after a certain threshold of like 1k followers, I think it would definitely be worth noting. Sort of like a fancy business card.

But then again, people now have spam following/followers on Github so it indeed is stupid. A better way to showcase influence would be via the most starred repo perhaps?

dmak
I just see github as a productivity tool like a kitchen knife and I wouldn't flex my kitchen knife. I would flex my products though which is like the food I make as a result of the kitchen knife.
btzs
Ideas: show loading icon while card is being created; allow hotlinking of the image and update its content periodically.
twodave
Love it. Integrate this with a printing/shipping service and I'd spend $20 easily.
learndeeply
Brilliant way to get thousands of tech people to look at your business card.

Edit: This was updated, it used to point to his real Github username. Not that there's anything wrong with that! It's clever marketing.

andirk
I didn't look what does it say?
version_five
It says he works at Dunder Mifflin, it doesn't look like its about self promotion
theden
I dig it—any plans for generating a dark mode card?
andirk
Fun fact: I have never had a business card with my name on it ever.
tillcarlos
… have you ever had a business card with someone else’s name on it then?
quickthrower2
Nice idea. Might be able to make money by linking to a business card company!