Feat/generate social sharing image

[Isaac-alencar]

Description

This PR adds the opengraph and twitter images generated programmatically with next.js og feature

Fixes #21

Type of change

• [x ] New feature (non-breaking change which adds functionality)

How Has This Been Tested?

I have testes only visually, but since I couldn't find a way to replicate the test for the reviewers. However, the image is basically generated by some HTML and CSS that I wrote, maybe you can visualize it copying and pasting in some other component rendered in the UI in order to see the output that will be generated by nextjs.

Merry Christmas to everyone 🎅🏻 ❤️

[Codeshark-NET]

Thanks again @Isaac-alencar , awesome! 🙌 I'll review it once I'm back in the saddle. Happy holidays to you! 🙏

[Isaac-alencar]

Heya @Isaac-alencar! I had a look but am unable to verify that the images are actually working. Whenever visiting the route, it just gives me a 404, am I missing something? This is where I'm getting the generated path: <meta name="twitter:image" content="http://localhost:3000/twitter-image?9380e9f79c59705a">

This happens for both images, using a social-sharing-previewer too.

In addition, once this works, we should remove the current static opengraph/twitter image. But let's worry about that after. 👍

I'll take a look on it today. I was traveling and just got back today 😅

[Isaac-alencar]

I was taking a look on the docs and I had to use the next api routes to generate the images, but for some reason it is not working.

Every time I tried to create a route to respond with the OG image it only returns 404. So if someone could try to follow the docs and give me a feedback if it's working properly, maybe I'm missing something

[Codeshark-NET]

No worries @Isaac-alencar, I'll try this out in a different context and get back to you, I didn't try this yet functionally myself either. 👍