-
-
Landing page where you can enter your input and repositories to start the agent.
-
Upon starting shows webcontainer of target repo
-
Can switch to view source repo
-
Final product of repo and prompt input from initial photo
-
Splicer makes changes directly on splice branch on the target repo's Github.
-
Can fork any public repo with appropriate license to use as either source or target repo.
Inspiration
New vibecoding tools are coming out constantly, and each one excels at different things. I found myself rapidly prototyping the same idea across multiple tools and frameworks, then wishing I could combine the best parts of each prototype into one clean project. Splicer was inspired by that frustration. I wanted a way to vibe code the best pieces of different repos together.
What it does
Splicer is an AI code migration agent that moves features between GitHub repositories. You describe what you want to migrate, pick a source repo and a target repo, and Splicer finds the relevant files, adapts them, wires dependencies, and integrates everything into a clean splice branch ready for a PR.
Input
- Source Repo → You point to the repo that has the feature you want (e.g. a component, hook, or util).
- Target Repo → You point to the repo where it should live.
- User Input → You describe what to migrate (e.g. “Add the dark mode toggle component and its styles”).
Splicer → Creates a splice branch in the target, finds the right code and dependencies, copies and pastes files, adapts imports and styles, adds npm deps, wires the feature in, and runs static checks. You get a PR-ready branch and, for Node.js projects, a live in-browser preview.
- All migrations are written to a
splicebranch (nevermain/master). Merge via GitHub PR or clone the branch locally.
Example: Give the same prompt to Google AI Studio, Lovable, and Bolt; then add all the features you want from the others into the best one as the base.
How I built it
I started by building the core agent using LangChain and LangGraph along with Github MCP tools, testing heavily in LangSmith. I initially experimented with a full validator and revisor loop, but it quickly became over-engineered. I simplified the pipeline to a single structured check node, which was far more reliable, and I plan to continue refining the validation loop to make it truly agentic. Graph framework:
- Splicer Setup: Create a splice branch in the target repository from the default branch.
- If the splice branch already exists, skip creation.
- Planner API: Generate a structured plan that defines:
- Source repository exploration goals
- Target repository exploration goals
- Integration instructions
- The final end goal of the change
- Target Agent: Analyze the target repository to determine:
- Where the feature should live
- File paths and project structure
- Coding styles and conventions
- Framework constraints
- Exact paste and integration instructions
- Source Agent: Inspect the source repository to:
- Locate the exact code to reuse
- Identify all dependencies
- Mark files for copying and classify them by type (component, hook, utility, etc.)
- Paster Agent: Combine inputs from Splicer Setup, Target Agent, and Source Agent to:
- Map copied source files to the correct target paths
- Apply all copied files in a single atomic commit
- Integrator Agent: Modify the pasted code as requested by the user:
- Adjust logic or behavior
- Add any required dependencies
- Wire the new component or feature into the target application
- Check Node: Validate the resulting changeset:
- The diff is readable and coherent
- package.json and tsconfig remain valid
- All import dependencies are present
- Code passes basic syntax checks
- Clean Up: Remove the .splicer/staging directory from the target branch to leave a clean working tree.
Tools
| Tool | Type | Description | Usage |
|---|---|---|---|
get_file_contents |
GitHub MCP | Read file content (supports line ranges) | Target, Source, Integrator, Check, Clean up |
search_code |
GitHub MCP | Search code patterns and files in repo | Target, Source, Integrator |
search_repositories |
GitHub MCP | Repo metadata, dependencies, structure | Target, Source |
push_files |
GitHub MCP | Atomic create/update files (single or batch commit) | Paster, Integrator |
create_branch |
GitHub MCP | Create branch in repo | Splicer Setup |
delete_file |
GitHub MCP | Delete file in repo | Clean up |
copy |
custom | Mark file for migration with type (component, hook, util, style, config, asset) | Source |
paste |
custom | Transfer copied_files to target with path mapping; single commit via push_files | Paster |
dependency |
custom | Add npm package to package.json; returns updated content for push_files | Integrator |
Once the agent logic was stable, I added Supabase for production durability, authentication, and state and made the agent a Google Cloud Run.
The frontend was first generated using Google AI Studio to create the aesthetic UI. From there, I moved it into Cursor to wire everything together and add features like guest mode, forking public repositories, GitHub App integration, and storing all user and session data in Supabase.
Finally, I built a WebContainer service on Google Cloud Run to support live, in-browser previews for Node.js projects to create a true vibe coding experience.
How to Use
All migrations are written to a splice branch (not main/master). To use the updated code either:
- Merge on GitHub — Open the repo on GitHub, create a Pull Request from
splice→main, then merge. - Clone the splice branch locally —
git clone -b splice https://github.com/OWNER/REPO.git- Replace
OWNERandREPOwith your username and repository name.
- Replace
Challenges I ran into
Getting each agent node to work together was extremely challenging. Each node needed carefully structured outputs and prompts so that information from the source and target agents could be reliably used by the integrator to produce the desired result.
The WebContainer system was also very difficult. It was an area I didn’t have deep prior experience with, and getting ephemeral environments, HMR, and secure proxying to work correctly took a lot of iteration and help from AI.
Security was another major challenge, especially with the guest demo. The system involves three different repositories communicating with each other, all while managing secrets, GitHub access, Supabase credentials, and Cloud Run services safely.
Accomplishments that I’m proud of
I’m proud of bringing my vision of rapid prototyping to life and really getting into the weeds of the LangSmith documentation to make a multi-agent system work end-to-end.
What I learned
Overall, this was my first time using LangChain and building a production-grade agent using best practices. I learned how to design a structured multi-agent workflow with LangGraph and the components like memory and tools that make up each agent. Working through LangSmith traces also taught me how to debug agent behavior systematically instead of guessing, which was essential as the graph became more complex.
I gained hands-on experience with full-stack application security, including managing secrets with Google Secret Manager for Cloud Run, using a GitHub App instead of personal access tokens, and securely proxying requests through Supabase Edge Functions. I also learned to configure CORS correctly across multiple domains, services, and iframes. Overall, the project pushed me to treat security as a constraint at every layer of the system.
This project also reinforced how important prompting is with going through many iterations and finding 90% of the issues after a solid agent graph is created can be solved by improving prompting. Every small detail needs to be correct in precise coding operations. It feels a lot like the classic genie-wish trope. If you’re not exact, you'll get what you asked for, but not what you wanted.
What’s next for Splicer – Code Migration Agent
I'll integrate OpenTelemetry to test and continuously refine the agent to work optimally for this use case. I plan to refine Splicer to work better with different types of repositories, especially within the WebContainer, and to introduce specialized agents for Node.js and Python projects. I also want to add a more refined validator and revisor loop to further improve reliability and correctness. Additionally, I want to add follow-up prompts to move over multiple related items within one chat and add in support for long-running threads like LangGraphs memory summarization and dynamic system prompts. Overall, I want to improve the agent's (and webcontainer's) reliability and expand testing to larger, more complex repositories.
In terms of the business model I plan on removing the waitlist modal and supporting "bring your own API key" and eventually tracking tokens that can be purchased via subscription or one-off purchases through the app. Additionally, I would love to explore integrations within vibe coding tools and perhaps creating an API for this agent.
Built With
- css
- fastapi
- gemini
- github
- google-cloud
- hcl
- javascript
- langchain
- langgraph
- python
- react
- shell
- supabase
- tailwind
- typescript
- vercel
- vite
Log in or sign up for Devpost to join the conversation.