DEV Community

Cover image for Share, Embed, and Curate Agent Sessions on DEV [Beta]
Jon Gottfried for The DEV Team

Posted on • Edited on

Share, Embed, and Curate Agent Sessions on DEV [Beta]

Authors can now upload Agent Session transcripts to their DEV account. Those transcripts can be curated, sliced up, shared publicly, and embedded into posts. This is a beta feature, and we are actively looking for feedback!

Every day, more people are creating software for the first time. Some have long histories as developers, and some have never seen a line of code in their life. In most cases, they're using the same tooling - coding agents. And yet, as these tools become ubiquitous there are surprisingly few ways to share your workflows and results in a standardized way beyond screenshots. Each tool has its own share link generator, each tool outputs logs in a different format. There are a few nascent projects out there to help, but they generally exist as standalone utilities or don't solve the sharing problem explicitly in a way that works on DEV.

We decided to solve that problem by making it possible to upload your transcripts to DEV, automatically parse them into a standardized format, and embed whole or partial sessions into your posts in a way that fits naturally into technical writing.

Supported Platforms

To start with, our parser supports Gemini CLI, Codex, Claude Code, Pi, and GitHub Copilot CLI. If you use a different tool, you're encouraged to open a PR or Issue on Forem to add a new parser yourself or ask us to do so. As an example, you can check out how our Gemini CLI parser works in our GitHub commit:
https://github.com/forem/forem/commit/0230aa56c1b4e59480c1de95822824f62f95aaa4#diff-a096c013f50a6f14bf8c09ab7c693348b9b704adeb99517f6089a511d025daa0

Example Session

Here's a session from an example app I built using Gemini CLI for my pet guinea pig Pearl (obligatory pic in comments).

Wheeky Gemini App
You

build me a simple web app to let my guinea pig tell me what food it wants

Agent

Clarifying Application Needs / Defining Food Selection UI / Mapping Out The App's Flow

I'll build a vibrant, touch-friendly web app called "Pui Pui Picker" designed for guinea pigs (and their humans).

The Plan:

  1. Scaffold: Create a React + TypeScript project using Vite.
  2. Design: A "big button" interface with high-contrast colors and bouncy animations to make it engaging.
  3. Features:
    • Food Grid: Large cards for Hay, Carrots, Romaine, and Bell Peppers.
    • Pui Pui Feedback: Visual and text-based "wheeking" feedback when an item is selected.
    • History: A small "Last Requested" log to track what the piggie "chose."
  4. Styling: Custom Vanilla CSS for a polished, modern look without external dependencies.

Does this sound like a good start for your guinea pig? Or should I add specific snacks they love?

I will start by scaffolding the project.

Agent
You

let's go simpler than vite and react

Agent

Seeking Simplification for App / Constructing the index.html

I'll create a single-file, vibrant, and touch-friendly HTML application called "The Wheeky Menu". It will use large, colorful buttons and bouncy animations—perfect for a guinea pig's "input" (or a human's finger).

The Plan:

  1. Single File: Everything (HTML, CSS, JS) in index.html for instant loading.
  2. Piggie-Centric UI:
    • Large Interaction Zones: Easy-to-hit cards for Hay, Carrots, Peppers, and Lettuce.
    • Visual Feedback: Cards will "pop" and flash when tapped.
  3. Features:
    • "Wheek!" Notification: A large visual alert showing what was picked.
    • Order History: A simple log at the bottom to see what the piggie "requested" most.

I will now create the index.html file.

Agent
Agent

Constructing The Interface / Refining The UX Design

The "Wheeky Menu" is ready! It's a single-file web app with large, high-contrast buttons designed for easy "selection" (by snout or finger).

How to use:

  1. Open the file: You can open index.html directly in any web browser.
  2. Piggie Input: Place your tablet or phone on the floor or near the cage. When your guinea pig taps or "boops" a card:
    • A large "WHEEK!" announcement pops up.
    • The request is added to the Request History at the bottom (so you can see what they picked if you step away).
    • On mobile devices, it will provide a small vibration (haptic feedback) when touched.

I've used high-contrast colors and bouncy animations to make it visually stimulating. Enjoy the wheeking!

You

Find the current Gemini CLI session log file. Look in ~/.gemini/sessions/ for the most recently modified .json or .jsonl file.

Then run the devto command to upload it:

Error: No file specified. Use --auto or provide a file path.\nRun 'devto --help' for usage.
[Shell command 'devto --yes --tool gemini_cli --title "" "$(ls -t ~/.gemini/sessions//*.json ~/.gemini/sessions//*.jsonl 2>/dev/null | head -1)"' exited with code 1]

If devto is not installed, use curl directly:

jq: Bad JSON in --rawfile body : Could not open : No such file or directory
[Shell command 'TMPJSON=$(mktemp) && jq -n --arg title "" --rawfile body "$(ls -t ~/.gemini/sessions//*.json ~/.gemini/sessions//*.jsonl 2>/dev/null | head -1)" '{title: $title, tool_name: "gemini_cli", body: $body}' > "$TMPJSON" && curl -s -X POST "${DEVTO_HOST:-https://dev.to}/api/agent_sessions" -H "Content-Type: application/json" -H "Accept: application/vnd.forem.api-v1+json" -H "api-key: $DEVTO_API_KEY" -d @"$TMPJSON" && rm -f "$TMPJSON"' exited with code 2]

After uploading, display the URL of the created session to the user.

Agent

Examining Upload Strategies / Implementing Dev Upload Skill

I will activate the dev-upload skill to securely and efficiently upload your session log to DEV.to.

Agent
Agent

Defining the Upload Process / Analyzing the Configuration Steps

I'll locate your most recent session log and check for a DEV.to API key to begin the upload.

Agent
Agent

Searching the File System / Refining the Search Strategy

I'll look for the session log again, including both .json and .jsonl files across all session subdirectories.

Agent
Agent

Exploring the Directory

I'll list the contents of ~/.gemini/sessions/ to find the exact session log files.

Agent
Agent

Examining Session Locations / Inspecting Gemini Directory Contents

I'll list the contents of the ~/.gemini/ directory to locate the session logs.

Agent
Agent

Checking the History

I'll list the contents of ~/.gemini/history/ to find the session log.

Agent
Agent

Examining Project Location

I'll list the contents of ~/.gemini/history/gemini-guinea-pig/ to find the current session's log.

Agent
Agent

Beginning File Enumeration

I'll list all files in ~/.gemini/history/gemini-guinea-pig/ to find the session log.

Agent
Agent

Pinpointing the Missing Path / Re-evaluating the Scope

I'll list the contents of ~/.gemini/tmp/gemini-guinea-pig/ to find the session log.

Agent
Agent

Investigating Log Location

I'll read the first 10 lines of logs.json to see if it's the session log.

Agent
Agent

Investigating the Discrepancy / Unraveling File Paths

I'll look for any other directories starting with 's' in ~/.gemini/ to find the sessions folder.

Agent
Agent

Examining Possible Locations

I'll list all directories starting with .gemini in my home directory to find the session logs.

Agent
Agent

Searching for Session Logs / Identifying Alternative Locations

I'll search for all .json and .jsonl files in ~/.gemini/ to find the correct session log.

Agent
Agent

Analyzing File Locations / Pinpointing Key Files

I'll select the latest session log from ~/.gemini/tmp/gemini-guinea-pig/chats/ and upload it to DEV.to using the discovered session file and your API key.

Agent
Agent

Reviewing the Upload Outcome / Confirming the URL Delivery

The session transcript has been successfully uploaded to DEV.to. You can view it here:

Session URL: https://dev.to/agent_sessions/wheeky-menu-piggie-food-picker-popwfq

Let's check out how the upload, curation, and embedding workflow works.

Upload a Session

First, you need to upload a session. You can drag and drop your session transcripts via your browser on the Agent Sessions page. We will soon be launching a CLI and Agent skill to give you a slash command for uploads as well.

Curate a Session

Once you upload the session, you curate which pieces of the session transcript get saved on DEV as part of your whole-session embed. You can mass enable/disable different pieces of your transcript, as shown here.

Curate an Agent Session on DEV

Slice Up a Session

If you don't want to embed your whole session (even in curated form) you can also use the Slice tool to create a sub-transcript that can include any and all parts of a session. You can have multiple Slices per session, if you want to break up your prompt and embed it in different places in your post.

Create Agent Session Slices on DEV

Once you've curated which pieces of your session transcript you want to save on DEV (in whole or as part of a slice), you Save & Upload it so you can start embedding or sharing it.

Share a Session

Lastly, to make this utility more generally useful beyond DEV, you can also share curated Agent Sessions publicly by using the Make Public button. See my session here.

Make Agent Sessions Public on DEV

Note: Please be very cognizant of what potentially sensitive data/keys might be in your transcripts. We have a redaction layer built in to the parser, but it is not going to catch every edge case. Do not upload sessions or data that you do not own, or that may open you up to security vulnerabilities.

We look forward to seeing what you build and share with this new feature. Happy hacking!

Top comments (19)

Collapse
 
dannwaneri profile image
Daniel Nwaneri • Edited

The slice-before-upload gap @pascal_cescato_692b7a8a20 identified is the right one. for embedding in technical writing, the useful unit is usually a specific exchange. The moment the agent made the wrong decision or the prompt that finally produced the right output. uploading a full session to get access to two minutes of it adds friction that'll stop most writers from using the feature at all.

Building something adjacent — a browser extension for capturing Claude conversations with semantic search and MCP access. The portable conversation artifact problem is the same one you're solving here, different layer.
will test with a Claude Code session.

Collapse
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Will see what we can do here :)

Collapse
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Based on your and Pascal's feedback I just shipped a major refactor to handle more of the curation/processing on the client side and remove the 10MB limit as a result. Curious to hear your thoughts!

Collapse
 
dannwaneri profile image
Daniel Nwaneri

That's a fast turnaround. will test with a Claude Code session next week and report back.
Removing the 10MB limit by moving curation client-side is the right architectural call. The constraint was in the wrong place. The useful unit for embedding in technical writing is a specific exchange, not a full session, so client-side selection before upload makes more sense than upload-then-slice anyway.

Collapse
 
pascal_cescato_692b7a8a20 profile image
Pascal CESCATO

It's an awesome feature! I've discover it this afternoon, and tested… I'm found of!

Collapse
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Awesome - have you used it in a post yet? Would love to check it out if so

Collapse
 
pascal_cescato_692b7a8a20 profile image
Pascal CESCATO

Unfortunately not yet. This feature arrived a bit too late for the article where I could have used it… and my sessions (GitHub Copilot CLI) exceed the 10MB limit. That said, it's definitely on my radar for a future article!

Thread Thread
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Do you think that limit will generally be too low?

Thread Thread
 
pascal_cescato_692b7a8a20 profile image
Pascal CESCATO

The limit itself may not be the core issue — if I had known about it from the start, I would have managed my sessions differently: intermediate saves, one session per feature. The real pain was discovering it after the fact, with a session already too large to use.

Also, for an article, you wouldn't embed a full 10MB session anyway — you'd want a meaningful excerpt. So the real need might be less about raising the limit and more about having a way to extract or slice a specific part of a session. Which, coincidentally, might be my next little experimentation… 😄

Thread Thread
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Good point. We have a slice feature but it's post upload. Maybe there's a way to move it earlier in the process

Thread Thread
 
pascal_cescato_692b7a8a20 profile image
Pascal CESCATO

Exactly — the slices feature is great, but it's a post-upload tool. If the session exceeds 10MB, you never get past the upload step, so slicing never becomes an option. Moving that capability earlier in the process would be the key!

Thread Thread
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Just shipped a major refactor to handle more of the curation/processing on the client side and remove the 10MB limit as a result. Curious to hear your thoughts!

Thread Thread
 
pascal_cescato_692b7a8a20 profile image
Pascal CESCATO

I just tried, works fine! So I've included some exchanges with Github Copilot CLI here: dev.to/pascal_cescato_692b7a8a20/a.... Thanks @jonmarkgo!

Thread Thread
 
jonmarkgo profile image
Jon Gottfried The DEV Team

Love it!

Collapse
 
yankoaleksandrov profile image
Yanko Alexandrov

This is exciting! Agent session sharing could be huge for collaborative debugging. I run multi-agent systems where sub-agents handle different tasks and being able to share a specific agent's session with a teammate would save hours of 'let me explain what happened'. Will this support embedding in external docs?

Collapse
 
jonmarkgo profile image
Jon Gottfried The DEV Team

External embedding is not supporting by default, but happy to look into that if you want to open a feature request Issue on GitHub github.com/forem/forem/issues

Collapse
 
mavibot profile image
Mavibot.ai

It's awesome. Thanks👌

Collapse
 
iseecodepeople profile image
Varun S

this is great!
thinking of ideas to use the agent sessions :)

Collapse
 
jonmarkgo profile image
Jon Gottfried The DEV Team

This is my guinea pig Pearl. She's not very good at coding yet.
Pearl the guinea pig

Some comments may only be visible to logged-in visitors. Sign in to view all comments.