Build a real-time chat app (GitHub MCP + Railway)

Overview

This video shows how to go from idea → working web app → production deployment, all inside Warp.
The project: a real-time chat application built with Python (FastAPI) and a JavaScript frontend, deployed through Railway, and integrated with GitHub via MCP (Model Context Protocol).

1. Setup & installation

Once you open Warp, you can work in two modes:

• Terminal mode - Run shell commands such as ls and pwd.
• Agent Mode - Ask the agent to build an app, add a feature, or complete another natural-language request.

When auto-detection is enabled, Warp detects whether your input is a shell command or an agent request and routes it accordingly.

Pro tip: Enable voice input for natural prompting or attach screenshots when debugging UI issues.

2. Generate an app idea

   Warp supports planning models, where the AI generates a detailed roadmap before coding.

   I would like to make something of simple to medium complexity that I could finish in about 30 minutes. I want this to be web based. I want to have some kind of interface and some kind of backend. Can you give me a fun idea that's not going to be too complicated to build out and to eventually deploy?

   The AI suggested several projects, like a personal mood tracker, quick poll creator, recipe randomizer, and more.
   
   Chosen idea we went with: a real-time chat application.

3. Create a development plan

   Prompt:

   I like idea one. Can you come up with a detailed plan on how to build this?

   Warp’s agent generated a plan for:

   • A frontend (UI for chat rooms and messages)
   • A backend (FastAPI server for real-time communication)
   • Database integration and planned deployment steps

   You can refine or expand the plan interactively by prompting:

   Make this more detailed.

   And get back something like this:

   
   Here's your development roadmap:
   
   🏗️ Architecture Decisions
   Frontend Options:
   •  React + Socket.IO Client (recommended for rich UI)
   •  Vue.js + Socket.IO Client 
   •  Vanilla JS + WebSockets (simpler but limited)
   
   Backend Options:
   •  Node.js + Socket.IO + Express (most popular for real-time)
   •  Python + Flask-SocketIO
   •  Go + Gorilla WebSocket
   
   Database:
   •  MongoDB (flexible for chat messages)
   •  PostgreSQL (structured data with JSON fields)
   •  Redis (for session management and caching)
   
   🚀 Recommended Tech Stack
   📋 Core Features to Implement
   1. Real-time messaging (Socket.IO)
   2. User authentication (JWT)
   3. Multiple chat rooms
   4. Online user presence
   5. Message history
   6. Typing indicators
   7. File/image sharing (optional)
   
   🛠️ Development Steps
   1. Create project in ~/Documents/Coding_Projects/realtime-chat
   2. Set up Node.js backend with Socket.IO
   3. Create React frontend with real-time connection
   4. Implement user auth and room management
   5. Add message persistence and history
   6. Style UI and add advanced features

   At any point, you can go into the plan and start directly modifying it. And when you're ready, you can tell Warp to:

   Please execute this plan.

4. Allow autonomous execution

   Once Warp starts executing, you can let Warp run commands automatically:

   1. Go to Settings > Agents > Profiles
   2. Change “Always Ask” → “Always Allow”
   3. Ensure restricted commands (e.g., rm -rf) remain blocked

   This enables autonomous execution for safe, fast iteration. Warp will run shell commands, create directories, initialize files, and write code.

5. Running the app

   First, you can click into any file, like main.py to edit it directly in Warp. Warp displays your file directly in the app for easy editing, similar to any regular IDE experience.

   

   You can also ask Warp to run the app and test locally:

   Can you run this app for me so I can test it? Tell me how to view it.

   It's possible (like in the video) for an error to occur (e.g., Internal Server Error). If that happens, you can debug conversationally:

   I’m getting an internal server error. Can you fix this?

   And Warp can fix the issue and rerun the app automatically.

6. Adding new features

   To enhance the app, request features conversationally:

   Can you add emoji reactions to the messages?

   Warp will modify frontend and backend code, updating WebSocket logic for real-time reactions. After testing, multiple users can now react to messages in the chat interface.

7. Preparing for deployment

   Warp integrates directly with version control and cloud deployers via MCP servers.

   Connect GitHub MCP:

   1. Go to Settings > Agents > MCP servers > Add
   2. Add a JSON block for GitHub MCP:

   {
     "github": {
       "command": "docker",
       "args": [
         "run",
         "-i",
         "--rm",
         "-e",
         "GITHUB_PERSONAL_ACCESS_TOKEN",
         "ghcr.io/github/github-mcp-server"
       ],
       "env": {
         "GITHUB_PERSONAL_ACCESS_TOKEN": "${<INSERT_YOURS_HERE>}"
       }
     }
   }

   3. Generate a GitHub personal access token (Settings → Developer Settings → Tokens)
      • Enable scopes for: repo, workflow, secrets, pull_request, and environments.

   Save and restart Warp.

   Then tell the agent:

   Can you make a new remote repo for me and upload my code?

   Warp uses Git commands automatically:

   git init
   git add .
   git commit -m "Initial commit"
   git remote add origin ...
   git push

8. Deploying via Railway

   Prompt:

   I have a FastAPI application built with Python. I want to deploy this. It just has an integrated frontend with JavaScript, HTML, and CSS. What’s the easiest way to do that? Can you assist me?

   Warp recommends Railway and walks through:

   • Creating a Railway account
   • Connecting your GitHub repo
   • Deploying directly from GitHub
   • Generating a public domain

   Once deployed, test it in your browser — you’ll see your live chat app with emoji reactions working in real time.

Appendix

• GitHub MCP Server
• Docker Desktop download
• Railway