Building a Replit Alternative Called Jerry with AI — Without Writing a Single Line of Code

Why Replace Replit?

The author spent an entire weekend testing Replit's mobile experience and came to one conclusion: it's painful to use. The interface is cramped, the home screen is confusing, and the overall interaction lacks any sense of joy. So he decided to do something that sounds a bit crazy — build a Replit alternative from scratch without writing a single line of code.

The alternative is called Jerry, an intelligent coding assistant that runs on iPhone. The core concept is simple: chat with an AI like you're sending iMessages, tell it what app you want, and it generates, hosts, and previews the app directly within the app. The entire zero-code development process relied on three key tools:

• OpenAI Codex: A desktop AI coding tool responsible for generating Swift code
• Claude Code SDK: An AI agent embedded in the app that powers chat and app generation
• Vibe Code CI: Handles creating and hosting generated apps in a sandboxed environment

Development Process: A Zero-Code Full-Stack Build

Project Initialization and Multi-threaded Collaboration

The author first manually created an empty Swift project in Xcode, then opened the project directory in Codex and established corresponding work threads.

About OpenAI Codex: OpenAI Codex is an AI system fine-tuned specifically for code generation tasks based on the GPT series of models, trained on billions of lines of public code from platforms like GitHub. The 2025 version of Codex runs as a cloud-based agent capable of autonomously executing multi-step programming tasks in a sandboxed environment. A major advantage of Codex is its support for multi-threaded parallel processing — research, design, and code construction can proceed simultaneously without interfering with each other, representing a fundamental departure from the single-threaded, sequential workflow of traditional IDEs.

He pasted pre-written product requirements (including feature descriptions and flowcharts) directly into Codex, used Shift+Enter to activate planning mode, and let the AI formulate a complete development plan before execution.

Design First: Rapid Prototyping with Paper.design

While Codex was formulating its plan, the author wasn't idle. He opened Paper.design (a Figma-like tool designed specifically for AI) and used MCP tools to have the AI automatically design four core interfaces:

• Jerry Inbox: Project list page
• Jerry Conversation: Chat interaction page
• Jerry Preview: App preview page
• Build Results: Generated results display page

About the MCP Protocol: MCP (Model Context Protocol) is a standardized protocol open-sourced by Anthropic in late 2024, aimed at solving the fragmentation problem of integrating AI models with external tools and data sources. Through MCP, AI assistants can access external resources like design tools, databases, and file systems as if calling standard interfaces. Paper.design implements an MCP server, enabling AI to directly manipulate the design canvas — this is the underlying mechanism that makes "AI-automated interface design" possible in this article, rather than simple screenshot generation.

During the design process, you can input guiding instructions at any time to adjust direction, such as "focus mainly on the chat and preview pages, keep it simple." This real-time guided design approach is extremely efficient, producing usable UI mockups in just a few minutes.

API Integration: Connecting Claude and Vibe Code CI

To give Jerry real AI app generation capabilities, two key APIs needed to be integrated:

1. Claude API: Obtain a key from platform.anthropic.com to serve as the chat agent's brain
2. Vibe Code CI API: Obtain a key from vibecode.dev to handle actual app building and hosting

About Claude Code SDK: Claude Code SDK is a programming agent toolkit from Anthropic designed for developers, allowing Claude's code understanding and generation capabilities to be embedded directly into applications. Unlike ordinary API calls, the SDK provides tool use, context management, and multi-turn conversation capabilities, enabling AI to dynamically respond to user needs at runtime, acting as a true "runtime agent" rather than a single-query system. This is the core reason Jerry can continuously understand user modification intent and maintain context across conversation turns.

About Vibe Code CI and the Vibe Coding Paradigm: Vibe Coding is a concept proposed by AI researcher Andrej Karpathy in early 2025, describing a programming paradigm that relies entirely on AI-generated code where developers only need to describe their intent in natural language. Vibe Code CI, as infrastructure tooling for this paradigm, specifically provides automated building, sandboxed isolated execution, and instant hosting capabilities for apps — a critical component in making "describe and deploy" a reality.

The first initialization took a while (the author even went for a 30-minute walk), but once complete, the entire pipeline was connected: user sends message → Claude understands the requirement → calls Vibe Code CI to generate the app → returns a preview link → automatically opens within the app.

Debugging and Iteration: The Real AI Development Experience

From Crashes to Usable

The first time running on iPhone, the app crashed immediately — data reading failed. The author's approach was typical: copy the error log from the bottom of Xcode, paste it into Codex saying "I got this message, help me fix it." Problem solved in a few minutes.

Then came a series of issues:

• Chat message formatting was messy → requested "display like iMessage, with the three-dot typing animation"
• Agent couldn't access Vibe Code CI → manually added a skill file
• Links opened outside the app → changed to an embedded browser preview

Every problem was solved the same way: describe the symptom, hand it to AI to fix. This is the daily routine of programming with prompts — you're responsible for finding and describing problems, AI is responsible for locating and fixing them.

UX Optimization: Borrowing Interaction Design from Twitter

The most interesting iteration came from an inspiration: the author noticed that when Twitter (X) opens a link, a small chat area remains at the bottom. He took a screenshot of Twitter and sent it to Codex with this request:

"Look at this screenshot — when Twitter opens a link, there's an input area at the bottom. Can you make the chat box like that? Like putting a small chat bubble at the bottom so I can keep typing while the preview is open."

This design allows users to preview the generated app while simultaneously continuing to chat with Jerry to modify it, making the experience much smoother. Screenshot-driven development has become an efficient communication method in the AI coding era — visual references often convey interaction intent more precisely than text descriptions, significantly reducing ambiguity in requirement understanding.

Voice Control: The Final Touch

The author also added voice input functionality by integrating the Whisper model.

About Whisper: Whisper is an automatic speech recognition (ASR) model open-sourced by OpenAI in 2022. It uses a Transformer architecture and was trained on 680,000 hours of multilingual audio data. Its core strengths lie in robust handling of accents, noise, and professional terminology, along with native support for multiple languages. When integrating Whisper on mobile, developers typically use quantized compressed versions (such as whisper.cpp) to balance recognition accuracy with device performance, enabling real-time speech-to-text without needing to upload audio data to the cloud for processing.

This means you can tell Jerry directly by voice while previewing an app: "Switch this app to light mode, make the color a very light gray — close to white but with a bit of grain — and change all the fonts."