DEV Community

Cover image for ForkToPost for 𝓓𝓔π“₯.𝒕𝒐: Give Your Code a Voice
 Veronika Kashtanova
Veronika Kashtanova

Posted on • Edited on

ForkToPost for 𝓓𝓔π“₯.𝒕𝒐: Give Your Code a Voice

DEV Weekend Challenge: Community

This is a submission for the DEV Weekend Challenge: Community

The Community

I built this for the dreamers who build until 3 AM and the architects who speak in syntax but struggle with prose.

As an active member of the DEV.to community, I’ve seen a recurring tragedy: brilliant developers build world-changing projects, but when it comes time to share them, they hit a wall. The burnout of documentation is real. We pour our souls into our logic, yet when we face that empty "Create Post" box, the words won't come.

I built ForkToPost because I want to protect that creative spark. I wanted to create a bridge for my fellow developersβ€”a way to showcase your brilliance without the exhaustion of marketing yourself. This is for the builder who wants their work to be seen, felt, and understood by the community we all call home.

The Vision: Transmuting complex repositories into human-readable stories.ForkToPost cinematic story example

What I Built

ForkToPost is a multi-modal AI engine designed to transform raw GitHub repositories into compelling, high-energy narratives specifically tailored for the DEV.to ecosystem.

It isn’t just a "markdown generator"; it is a storytelling companion. By leveraging the power of Google’s Gemini AI, it analyzes your code and README to weave a professional, witty, and scannable post. To make the experience truly immersive, I’ve included "Technical Alchemy" themes like Abyssal and Enchanted Forestβ€”transforming the UI into a sanctuary for creation.

AI at work: Analyzing project DNA to find its unique storytelling voice.Gemini AI narrative generation interface

Key Features:

  • Dual Alchemical Modes:
    • Custom Fields Mode: Take full control by fine-tuning project parameters for a surgical, precise narrative.
    • Template Mode: Harness the power of pure automation to generate complete stories in seconds.
  • 4 Immersive Atmospheres: Switch between πŸ’Ž Modern, 🦾 Tech, 🌲 Forest, and 🌊 Sea themes to transform your UI into a sanctuary for creation.
  • AI-Powered Narrative: Uses Gemini 3 to find the "soul" of your project.
  • Cinematic Visuals: Generates πŸ–ΌοΈ AI metaphors for your project and automatically hosts them on ImgBB (Generate Cover Image checkbox).
  • The DEV Bridge: A direct integration with the DEV.to API that lets you verify your profile and publish your post as ✍️ a draft with a single click.
  • Empathy Toggles: Features to specifically πŸ€— "Add Empathy" or "Deep-Dive" into architecture.

Demo

Experience the magic here:

Watch the walkthrough:

Code

The entire engine is open-source and ready for your contributions:

GitHub logo vero-code / forktopost

πŸš€ Transform GitHub repos into winning DEV.to stories with Gemini AI. Built for the DEV Weekend Challenge: Community. πŸ”±

πŸ”± ForkToPost

Version License React TypeScript Gemini AI

ForkToPost is the ultimate submission generator for the DEV Weekend Challenge: Community. It helps you transform your GitHub repository into a compelling story that captures the attention of the DEV.to community.

Whether you're struggling to articulate your value proposition or just want to craft a professional, witty, and scannable post, ForkToPost uses Google's Gemini AI to weave your code into a winning narrative.


✨ Features

⚑ Built for the Weekend: Designed specifically to help DEV Challenge participants meet tight deadlines without sacrificing quality.

  • πŸ€– AI-Powered Narrative: Leverages gemini-3-flash-preview to analyze your repository and generate structured Markdown.
  • πŸ”— GitHub Integration: Automatically fetch project names and README content by pasting a GitHub URL.
  • 🎨 Image Generation: Create cinematic visual metaphors for your projects using gemini-3.1-flash-image-preview.
  • πŸ–ΌοΈ Image Hosting: Automatically upload AI-generated images to ImgBB to ensure they appear as cover images on DEV.to.
  • πŸš€β€¦

Seamless Synchronization: Connecting your repository directly to your DEV.to profile.DEV.to API profile synchronization

How I Built It

This project is a spiritual successor to my previous work, Source Persona. While Source Persona was about finding the developer's "twin," ForkToPost is about finding the developer's "voice."

The "Aha!" moment came when I realized I could use multi-modal LLMs not just for text, but to visualize code through cinematic metaphors. I wanted the UI to feel like an ancient laboratory where code is transmuted into gold.

The Prime Forge: A high-octane modern environment designed for technical clarity.Original Modern UI

Technical Architecture

The Blueprint: A reactive, client-side forge powered by Google Gemini and Vercel.ForkToPost system architecture blueprint

The system is designed as a reactive, client-side forge with a secure proxy layer for external API communication.

  1. The Intake Layer (React 19 & TypeScript):

    • Users provide a GitHub URL. The frontend fetches the README content and repository metadata.
    • Profile Verification: Users input their DEV.to API key; the app instantly fetches their avatar and username to provide a secure, "logged-in" feeling without a complex backend.
  2. The Alchemical Engine (Gemini AI):

    • Text Processing: gemini-3-flash-preview ingests the repository data. Based on the selected "Empathy" or "Architecture" toggles, it follows specific prompt chains to generate structured Markdown.
    • Visual Synthesis: gemini-3.1-flash-image-preview generates a visual metaphor (e.g., a bioluminescent deep-sea city for the "Abyssal" theme) based on the project's purpose.
  3. Asset Pipeline (ImgBB API):

    • To ensure images appear correctly as DEV.to cover images, the AI-generated Base64 data is dispatched to the ImgBB API. The resulting URL is then injected into the Markdown metadata automatically.
  4. The Publishing Bridge (Vercel Proxy):

    • Since the DEV.to API has specific CORS requirements, I implemented a Vercel Proxy (vercel.json). This allows the frontend to securely "talk" to the DEV.to API, sending the final Markdown payload directly to the user's dashboard as a Draft.
  5. The Experience Layer (Tailwind 4 & Motion):

    • The UI uses dynamic theme switching to change the entire atmosphere of the app. Whether it's the glowing bioluminescence of the Sea theme or the parchment textures of the Forest theme, the goal was to make the developer feel like an Alchemist rather than a data-entry clerk.

Precision: Fine-tuning the alchemical reaction through custom field parameters.Customizing AI parameters in ForkToPost

The Final Result

Transmutation complete: One click to deliver your story directly to your dashboard.Direct draft delivery to DEV.to dashboard

Building this was a vulnerable journeyβ€”realizing that even as a developer advocate, I sometimes struggle to find the words. ForkToPost is my gift to the community to ensure no great project ever goes unread.

I’d love to hear your feedback and stories. Every comment helps the engine grow stronger! πŸ› οΈ


This post was generated with ForkToPost β€” transform your repositories into compelling stories.

Top comments (0)