api/og not working with Astro

[hqasmei]

api/og not working with Astro

[ernestoresende]

@danstepanov @hqasmei Is the objective here to have dynamic OG generation based on the docs page content metadata? Also, do we already have a defined design/layout for how they should look like?

If so, we can probably achieve this with @vercel/og (https://www.kozhuhds.com/blog/generating-static-open-graph-og-images-in-astro-using-vercel-og) and an on-demand server rendering. For a while now, Astro allows to be partial about what parts of the Astro application we want to run on the server, while keeping the rest of the application static.

[danstepanov]

The goal would be to have custom previews for different pages of the website (docs, landing, etc). We used to have code generated images prior to the migration to astro.

[danstepanov]

this is temporarily fixed with static assets but is not using the automatically generated image based on jsx code

[hqasmei]

Hey @ernestoresende thanks for sharing those resources. Will check them out.
For the www repo, I think when we were working on it we set the output as static. Forgot why. It wasn't working otherwise.
For the docs repo, I don't believe we have the output set to anything so I'll try to see if we can get the @vercel/og image working there.

[hqasmei]

Hey @danstepanov what would you want the custom previews look like?
The previous code you doesn't seem like it's dynamic. Would you want something similar to Next.js, have the log in the center with the title underneath?

Example:

Example made with OG Image Playground:

[hqasmei]

Created a branch docs/og, I updated the code, the og image is in the head but the og image isn't loading it gives me this.
Im using the preview generated by vercel, not sure if it's a server setup thing.

[hqasmei]

https://github.com/danstepanov/create-expo-stack/blob/docs/og/docs/astro.config.mjs

[hqasmei]

Was figured out can find more about in PR #184