51fe28e45d
* Add cmux SSH blog post * Shorten SSH blog post, remove headings * Trim SSH blog post to 2 paragraphs * Remove first person, add feature bullet list * Clarify no port forwarding needed * Add cmux claude-teams and cmux omo blog posts * Wrap command names in code tags * Add code tags to SSH post, shorten claude-teams and omo paragraphs * Reorder blog posts: SSH first, then claude-teams and omo * Update omo post with actual oh-my-openagent details, improve titles * Add GPL blog post, fix omo title to specialist agents * Explain what the relay daemon is for in SSH post * Move drag-image to second bullet, use routes through * Rewrite SSH intro, add image upload video * Add SSH docs page, link blog posts to docs * Add omo demo video to blog post * Trim omo agent details * Lead omo paragraph with cmux omo command * Rename omo title to oh-my-openagent subagents * Add claude-teams demo video to blog post * Fix omo naming, link to docs instead of blog posts * Add demo videos to SSH blog, SSH docs, claude-teams docs, omo docs --------- Co-authored-by: Lawrence Chen <lawrencecchen@users.noreply.github.com>
90 lines
2.8 KiB
TypeScript
90 lines
2.8 KiB
TypeScript
import { useTranslations } from "next-intl";
|
|
import { getTranslations } from "next-intl/server";
|
|
import { buildAlternates } from "../../../../i18n/seo";
|
|
import { Link } from "../../../../i18n/navigation";
|
|
|
|
export async function generateMetadata({ params }: { params: Promise<{ locale: string }> }) {
|
|
const { locale } = await params;
|
|
const t = await getTranslations({ locale, namespace: "blog.cmuxSsh" });
|
|
return {
|
|
title: t("metaTitle"),
|
|
description: t("metaDescription"),
|
|
keywords: [
|
|
"cmux", "SSH", "remote development", "terminal", "macOS",
|
|
"port forwarding", "notifications", "AI coding agents",
|
|
"Claude Code", "remote workspace", "developer tools",
|
|
],
|
|
openGraph: {
|
|
title: t("metaTitle"),
|
|
description: t("metaDescription"),
|
|
type: "article",
|
|
publishedTime: "2026-03-30T00:00:00Z",
|
|
},
|
|
twitter: {
|
|
card: "summary_large_image",
|
|
title: t("metaTitle"),
|
|
description: t("metaDescription"),
|
|
},
|
|
alternates: buildAlternates(locale, "/blog/cmux-ssh"),
|
|
};
|
|
}
|
|
|
|
export default function CmuxSshPage() {
|
|
const t = useTranslations("blog.posts.cmuxSsh");
|
|
const tc = useTranslations("common");
|
|
|
|
return (
|
|
<>
|
|
<div className="mb-8">
|
|
<Link
|
|
href="/blog"
|
|
className="text-sm text-muted hover:text-foreground transition-colors"
|
|
>
|
|
← {tc("backToBlog")}
|
|
</Link>
|
|
</div>
|
|
|
|
<h1>{t("title")}</h1>
|
|
<time dateTime="2026-03-30" className="text-sm text-muted">
|
|
{t("date")}
|
|
</time>
|
|
|
|
<p className="mt-6">
|
|
{t.rich("p1", {
|
|
code: (chunks) => <code>{chunks}</code>,
|
|
})}
|
|
</p>
|
|
|
|
<video
|
|
src="/blog/cmux-ssh-image-upload.mp4"
|
|
width={1824}
|
|
height={1080}
|
|
autoPlay
|
|
loop
|
|
muted
|
|
playsInline
|
|
className="my-6 rounded-lg w-full h-auto"
|
|
/>
|
|
|
|
<ul className="mt-4 space-y-1">
|
|
<li>Browser panes route through the remote machine, so <code>localhost:3000</code> reaches the remote dev server without port forwarding</li>
|
|
<li>Drag an image into a remote terminal to upload via scp</li>
|
|
<li>Coding agents on the remote box send notifications to your local sidebar</li>
|
|
<li><code>cmux claude-teams</code> and <code>cmux omo</code> work over SSH, spawning teammate panes locally while computation runs remote</li>
|
|
<li>The sidebar shows connection state and detected listening ports</li>
|
|
</ul>
|
|
|
|
<iframe
|
|
className="my-6 rounded-lg w-full aspect-video"
|
|
src="https://www.youtube.com/embed/RoR9pMOZWkk"
|
|
title="cmux SSH demo"
|
|
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
|
allowFullScreen
|
|
/>
|
|
|
|
<p className="mt-4">
|
|
<Link href="/docs/ssh">Read the SSH docs →</Link>
|
|
</p>
|
|
</>
|
|
);
|
|
}
|