AsyncAPI: Dynamic Open Graph Link Preview for AsyncAPI Studio

AceTheCreator commented 5 months ago

This project envisions enhancing the social media sharing experience for AsyncAPI Studio by introducing a dynamic Open Graph link preview image generation mechanism. Currently, when users share a link to the Studio with or without query parameters like ?url=<url-of-file> or ?base64=<base64-encoded-doc>, the default preview image lacks context about the specific file being shared.

The goal is to implement a solution that dynamically generates a preview image based on the file being shared. This customized preview image will include essential information such as the title, description, and relevant statistics, offering a more informative representation of the document. This improvement is expected to enhance the user experience when sharing AsyncAPI docs on platforms like Twitter, Linkedin, Facebook, Slack, and others, providing a visually appealing and context-rich preview image.

Learn more here https://github.com/asyncapi/studio/issues/224

Mentor/s: @smoya

Project Repo: https://github.com/asyncapi/studio

Expected Difficulty: Easy-Medium

Expected Time Commitment: 175 Hour

fmvilas commented 5 months ago

I love this one 👍

atharva-gadekar commented 4 months ago

Hello @smoya, I am interested in contributing to this idea. The idea is great. I read about the entire conversation regarding this issue. This issue will help me learn about SEO and the Open Graph Image, which will be interesting. I just wanted to point out that this seems a little difficult for me as I have never worked with SEO earlier, but I would definitely love to discuss this further.

AdityaSingh-02 commented 4 months ago

Hello @AceTheCreator @smoya

I'm Aditya Singh, a Computer Science undergraduate from India with a passion for open-source contributions. Previously, I had the opportunity to participate in GSOC 23 at Rocket.chat, which was an enriching experience. This season, I'm eager to channel my skills and knowledge into contributing to AsyncAPI. The project's requirement matches my tech stack, and I'm excited about the potential impact I can make by contributing to JSON Schema. I'm looking forward to making some worthy contributions🚀

x - https://twitter.com/Go_D_Aditya

AdityaSingh-02 commented 4 months ago

Async API Open Graph This project envisions enhancing the social media sharing experience for AsyncAPI To create a img preview -

First we need to design open graph image.
Secondly, we need few information to display on image
The Data will be coming from the base64 copied url
After getting data from base64 we can extract required data which needs to be displayed on the image ex - Title, Description, number of servers, channels and messages.

Hang in there, soon I will try to present a prototype 🚀

GaganMeshram123 commented 4 months ago

@AceTheCreator @smoya Hello! I'm Gagan Meshram, a Computer Science undergraduate from India with a passion for open-source contributions. Previously, I had the opportunity to participate in Google Summer of Code at Rocket.chat, which was an enriching experience. This season, I'm eager to channel my skills and knowledge into contributing to AsyncAPI. This project has captured my interest and I would love to build this VS code extension, and I'm excited about the potential impact I can make by contributing to AsyncAPI. I'm looking forward to contributing and making some impact...

smoya commented 1 month ago

Just for the record, @helios2003 got selected as GSOC 2024 Mentee and it is working on this issue.

postman-open-technologies / gsoc-2024

AsyncAPI: Dynamic Open Graph Link Preview for AsyncAPI Studio #9