fb03a9af47
Targets "opencode mobile features", "AI coding android", and "opencode vs ChatGPT for coding" queries not covered by existing pages. Includes SoftwareApplication + BreadcrumbList structured data. Adds /features/ to sitemap and internal footer nav on all 5 pages. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
276 lines
14 KiB
HTML
276 lines
14 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>OpenCode Mobile Features — AI Coding Agent for Android</title>
|
||
<meta name="description" content="Full feature list for OpenCode Mobile: real-time AI coding sessions, multi-model support, Tailscale/VPN connectivity, streaming diff view, session history, and open-source privacy-first design." />
|
||
<meta name="keywords" content="opencode mobile features, opencode android features, AI coding agent android, mobile AI coding assistant, opencode android app capabilities, code with AI on phone" />
|
||
<meta name="theme-color" content="#3b82f6" />
|
||
<link rel="canonical" href="https://dzianisv.github.io/opencode-mobile/features/" />
|
||
<link rel="icon" type="image/png" href="../fdroid/repo/icons/icon.png" />
|
||
|
||
<meta property="og:type" content="article" />
|
||
<meta property="og:site_name" content="OpenCode Mobile" />
|
||
<meta property="og:title" content="OpenCode Mobile Features — AI Coding Agent for Android" />
|
||
<meta property="og:description" content="Everything OpenCode Mobile can do: real-time AI coding sessions on Android, multi-model support, Tailscale connectivity, streaming diffs, session history, and privacy-first open-source design." />
|
||
<meta property="og:url" content="https://dzianisv.github.io/opencode-mobile/features/" />
|
||
<meta property="og:image" content="https://dzianisv.github.io/opencode-mobile/og.png" />
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<meta name="twitter:title" content="OpenCode Mobile Features — AI Coding Agent for Android" />
|
||
<meta name="twitter:description" content="Real-time AI coding sessions, multi-model support, Tailscale connectivity, streaming diffs — OpenCode Mobile feature overview." />
|
||
<meta name="twitter:image" content="https://dzianisv.github.io/opencode-mobile/og.png" />
|
||
|
||
<!-- Breadcrumb -->
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@type": "BreadcrumbList",
|
||
"itemListElement": [
|
||
{ "@type": "ListItem", "position": 1, "name": "OpenCode Mobile", "item": "https://dzianisv.github.io/opencode-mobile/" },
|
||
{ "@type": "ListItem", "position": 2, "name": "Features", "item": "https://dzianisv.github.io/opencode-mobile/features/" }
|
||
]
|
||
}
|
||
</script>
|
||
|
||
<!-- SoftwareApplication -->
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@type": "SoftwareApplication",
|
||
"name": "OpenCode Mobile",
|
||
"operatingSystem": "Android",
|
||
"applicationCategory": "DeveloperApplication",
|
||
"description": "Open-source Android client for the OpenCode AI coding agent. Run AI-assisted coding sessions from your phone against a self-hosted opencode server.",
|
||
"url": "https://dzianisv.github.io/opencode-mobile/",
|
||
"downloadUrl": "https://dzianisv.github.io/opencode-mobile/download/",
|
||
"softwareVersion": "0.4",
|
||
"author": { "@type": "Organization", "name": "VIBE TECHNOLOGIES, LLC" },
|
||
"license": "https://opensource.org/licenses/MIT",
|
||
"offers": { "@type": "Offer", "price": "0", "priceCurrency": "USD" },
|
||
"featureList": [
|
||
"Real-time AI coding sessions via Server-Sent Events",
|
||
"Multi-model support: Claude, GPT-4, Gemini, Ollama, and any opencode-compatible model",
|
||
"Tailscale and VPN connectivity for private server access",
|
||
"Streaming diff and tool-use output as the agent works",
|
||
"Full session history with scroll and search",
|
||
"Multiple saved server connections",
|
||
"Password-protected server authentication",
|
||
"Privacy-first: no cloud relay, no telemetry by default",
|
||
"Open source under MIT license"
|
||
]
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
:root{--bg:#0b0f17;--bg-soft:#121826;--card:#161d2e;--border:#243049;--text:#e6ebf5;--muted:#9aa6be;--accent:#3b82f6;--accent-2:#2563eb;--green:#22c55e;}
|
||
*{box-sizing:border-box}
|
||
html{scroll-behavior:smooth}
|
||
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;}
|
||
a{color:var(--accent);text-decoration:none}
|
||
a:hover{text-decoration:underline}
|
||
.wrap{max-width:880px;margin:0 auto;padding:0 20px}
|
||
section{padding:36px 0;border-top:1px solid var(--border)}
|
||
section:first-of-type{border-top:none}
|
||
h1,h2,h3{line-height:1.25;margin:0 0 .5em}
|
||
h1{font-size:2.1rem}
|
||
h2{font-size:1.4rem;margin-top:.2em}
|
||
h3{font-size:1.1rem;margin-top:1.4em}
|
||
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--bg-soft);border:1px solid var(--border);border-radius:6px;padding:2px 6px;font-size:.9em}
|
||
.crumbs{font-size:.9rem;color:var(--muted);padding-top:24px}
|
||
.crumbs a{color:var(--muted)}
|
||
.crumbs a:hover{color:var(--accent)}
|
||
.hero{padding:48px 0 24px}
|
||
.hero h1{font-size:2.4rem;max-width:700px}
|
||
.hero p{color:var(--muted);max-width:620px;font-size:1.1rem;margin-top:.5em}
|
||
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
|
||
.btn{display:inline-block;padding:11px 24px;border-radius:8px;font-weight:600;font-size:1rem}
|
||
.btn-primary{background:var(--accent);color:#fff}
|
||
.btn-primary:hover{background:var(--accent-2);text-decoration:none}
|
||
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border)}
|
||
.btn-ghost:hover{border-color:var(--accent);text-decoration:none}
|
||
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
|
||
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px 24px}
|
||
.card-icon{font-size:1.5rem;margin-bottom:8px}
|
||
.card h3{font-size:1rem;margin:0 0 6px}
|
||
.card p{color:var(--muted);font-size:.92rem;margin:0;line-height:1.5}
|
||
.badge{display:inline-block;background:rgba(59,130,246,.15);color:var(--accent);border:1px solid rgba(59,130,246,.3);border-radius:20px;font-size:.78rem;padding:2px 10px;margin-bottom:8px}
|
||
.check-list{list-style:none;padding:0;margin:0}
|
||
.check-list li{padding:6px 0;color:var(--muted);font-size:.95rem;display:flex;gap:10px;align-items:flex-start}
|
||
.check-list li::before{content:"✓";color:var(--green);font-weight:700;flex-shrink:0;margin-top:1px}
|
||
.use-case{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px 24px;margin-bottom:14px}
|
||
.use-case h3{font-size:1rem;margin:0 0 6px;color:var(--text)}
|
||
.use-case p{color:var(--muted);font-size:.92rem;margin:0;line-height:1.5}
|
||
.muted{color:var(--muted);font-size:.9rem}
|
||
footer{padding:32px 0;border-top:1px solid var(--border);margin-top:8px}
|
||
footer .wrap p{color:var(--muted);font-size:.9rem;margin:8px 0}
|
||
footer a{color:var(--muted);margin-right:16px}
|
||
footer a:hover{color:var(--accent)}
|
||
@media(max-width:600px){.hero h1{font-size:1.7rem}.grid{grid-template-columns:1fr}}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<main>
|
||
<section class="hero">
|
||
<div class="wrap">
|
||
<nav class="crumbs"><a href="../">OpenCode Mobile</a> › Features</nav>
|
||
<h1>Everything OpenCode Mobile can do</h1>
|
||
<p>A full-featured Android client for the OpenCode AI coding agent — real-time sessions, multi-model support, private server connectivity, and no cloud intermediary.</p>
|
||
<div class="cta-row">
|
||
<a href="../download/" class="btn btn-primary">Download APK</a>
|
||
<a href="../guide/" class="btn btn-ghost">Setup guide</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section>
|
||
<div class="wrap">
|
||
<h2>Core capabilities</h2>
|
||
<p style="color:var(--muted);margin-bottom:24px">What the app delivers end-to-end, from connection to completed coding task.</p>
|
||
<div class="grid">
|
||
|
||
<div class="card">
|
||
<div class="card-icon">⚡</div>
|
||
<h3>Real-time streaming sessions</h3>
|
||
<p>Streams the agent's tool calls, file edits, and reasoning tokens via Server-Sent Events as they happen — no waiting for a complete response before you see output.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🤖</div>
|
||
<h3>Any model opencode supports</h3>
|
||
<p>Inherits your server's model configuration: Claude 3.5/4, GPT-4o, Gemini 1.5/2, Ollama local models, and any provider opencode can reach. Switch models server-side; the app follows.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🔒</div>
|
||
<h3>Tailscale & VPN connectivity</h3>
|
||
<p>Point the app at any private IP or Tailscale MagicDNS hostname. No port-forwarding or public exposure required — your codebase stays on your machine.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">📂</div>
|
||
<h3>Tool-use & diff output</h3>
|
||
<p>Renders the agent's tool calls inline — file reads, writes, shell commands — so you see exactly what it did to your code, not just a prose summary.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🕑</div>
|
||
<h3>Full session history</h3>
|
||
<p>Every conversation is stored locally. Scroll back through past sessions, resume interrupted work, or review what the agent changed in a previous run.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🔗</div>
|
||
<h3>Multiple saved servers</h3>
|
||
<p>Save and switch between multiple server profiles — home lab, work VPN, cloud VM. Each connection stores its own URL and credentials independently.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🛡️</div>
|
||
<h3>Password-protected auth</h3>
|
||
<p>Connects to password-protected <code>opencode serve</code> instances. Credentials are stored in the device keychain, not in plain text.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🔍</div>
|
||
<h3>Built-in diagnostics</h3>
|
||
<p>Tap "Share diagnostic" to generate a structured connectivity report (DNS, port, health-check, TLS) for faster debugging — without exposing code or message content.</p>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-icon">🌐</div>
|
||
<h3>Open source & no telemetry</h3>
|
||
<p>MIT-licensed, auditable source on GitHub. Crash reporting (Sentry) is opt-in and off by default. No analytics, no account, no cloud relay.</p>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section>
|
||
<div class="wrap">
|
||
<h2>What people use it for</h2>
|
||
<div class="use-case">
|
||
<h3>Code review on the go</h3>
|
||
<p>Ask the agent to summarize a diff, explain a function, or flag potential bugs — from your phone while away from your desk. The session history means you can pick up where you left off.</p>
|
||
</div>
|
||
<div class="use-case">
|
||
<h3>Quick fixes & patches</h3>
|
||
<p>Describe the bug in plain language; let the agent locate, patch, and explain the change in your actual codebase. You see every file write as it happens.</p>
|
||
</div>
|
||
<div class="use-case">
|
||
<h3>Scaffolding new features</h3>
|
||
<p>Ask the agent to stub out a new module, write tests, or extend an existing pattern — then commit from your laptop when you're back. Start the thinking on the bus, land the code at your desk.</p>
|
||
</div>
|
||
<div class="use-case">
|
||
<h3>Private local-model sessions</h3>
|
||
<p>Point opencode at Ollama running locally and your mobile session never touches a third-party server. The app connects directly over your tailnet — fully air-gapped from the internet if you want.</p>
|
||
</div>
|
||
<div class="use-case">
|
||
<h3>Documentation & explanation</h3>
|
||
<p>Ask the agent to explain an unfamiliar codebase, write a README section, or generate API docs — useful when you're reading code without an IDE open.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section>
|
||
<div class="wrap">
|
||
<h2>Compared to using Claude.ai or ChatGPT from mobile browser</h2>
|
||
<p style="color:var(--muted);margin-bottom:20px">OpenCode Mobile is a coding-agent client, not a chat UI. The key differences:</p>
|
||
<ul class="check-list">
|
||
<li><strong>Agent has direct access to your codebase</strong> — reads and writes actual files; no copy-pasting snippets.</li>
|
||
<li><strong>Runs against your server</strong> — your model config, your API keys, your cost — not a metered consumer tier.</li>
|
||
<li><strong>Streaming tool-use output</strong> — see file edits and shell commands as they run, not a finished summary.</li>
|
||
<li><strong>Session persistence</strong> — full history stored locally; conversations don't disappear on browser refresh.</li>
|
||
<li><strong>No cloud relay</strong> — traffic goes phone → Tailscale → your machine; no intermediary sees your code.</li>
|
||
<li><strong>Self-hosted model support</strong> — use Ollama, LM Studio, or any local model opencode supports.</li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
|
||
<section>
|
||
<div class="wrap">
|
||
<h2>System requirements</h2>
|
||
<ul class="check-list">
|
||
<li>Android 7.0 (API 24) or later</li>
|
||
<li><a href="https://github.com/opencode-ai/opencode">opencode</a> running on a reachable server (<code>opencode serve</code>)</li>
|
||
<li>Network path from phone to server (LAN, Tailscale VPN, or any tunnel)</li>
|
||
<li>~15 MB storage for the app; session history grows with use</li>
|
||
</ul>
|
||
<p style="margin-top:16px"><a href="../guide/">Full setup walkthrough →</a></p>
|
||
</div>
|
||
</section>
|
||
|
||
<section>
|
||
<div class="wrap">
|
||
<h2>Get the app</h2>
|
||
<p style="color:var(--muted)">Free, open-source, no account required.</p>
|
||
<div class="cta-row" style="margin-top:16px">
|
||
<a href="../download/" class="btn btn-primary">Download & install</a>
|
||
<a href="https://github.com/dzianisv/opencode-mobile" class="btn btn-ghost">View source on GitHub</a>
|
||
</div>
|
||
<p style="margin-top:20px;color:var(--muted);font-size:.9rem">
|
||
See also: <a href="../guide/">setup guide</a> · <a href="../troubleshooting/">troubleshooting</a> · <a href="../">overview</a>
|
||
</p>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer>
|
||
<div class="wrap">
|
||
<p>
|
||
<a href="../">Home</a>
|
||
<a href="../download/">Download</a>
|
||
<a href="../guide/">Setup guide</a>
|
||
<a href="features/">Features</a>
|
||
<a href="https://github.com/dzianisv/opencode-mobile">GitHub</a>
|
||
<a href="../privacy/">Privacy policy</a>
|
||
</p>
|
||
<p class="muted">Free and open-source. Built by VIBE TECHNOLOGIES, LLC.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
</body>
|
||
</html>
|