Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat/generate social sharing image #34

Open
wants to merge 4 commits into
base: main
Choose a base branch
from

Conversation

Isaac-alencar
Copy link
Contributor

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
Copy link
Member

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

Copy link
Member

@Codeshark-NET Codeshark-NET left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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. 👍

@Isaac-alencar
Copy link
Contributor Author

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
Copy link
Contributor Author

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
Copy link
Member

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. 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Generate the social-sharing image via nextjs
2 participants