diff --git a/README.md b/README.md index 8682b8a..dabf50b 100644 --- a/README.md +++ b/README.md @@ -4,6 +4,8 @@ with.md gives markdown-heavy teams a GitHub-backed collaboration workspace for l Filesystem-first markdown collaboration for humans and agents. Edit markdown files stored in GitHub repositories with real-time collaboration, live cursors, anchored comments, and instant synchronization, no proprietary formats, no lock-in. +Try it without connecting GitHub: [open a live editable README demo](https://with.md/demo/readme). It creates a safe sample markdown share, not a repository connection. + ## Table of Contents - [Architecture Overview](#architecture-overview) diff --git a/web/src/app/(main)/demo/readme/page.tsx b/web/src/app/(main)/demo/readme/page.tsx new file mode 100644 index 0000000..f7cb2c3 --- /dev/null +++ b/web/src/app/(main)/demo/readme/page.tsx @@ -0,0 +1,108 @@ +'use client'; + +import { useCallback, useEffect, useRef, useState } from 'react'; +import Link from 'next/link'; + +const README_DEMO_MARKDOWN = `# with.md README demo + +This is a safe sample README for trying editable markdown collaboration. + +## What to try + +- Change this checklist into your own launch notes. +- Add a comment for the next person. +- Copy the edit link and send it to someone else. + +## Why this stays safe + +This demo creates a standalone markdown share. It does not connect to your GitHub account, request repository access, or touch a real README. + +## Source stays clean + +The content remains markdown. You can switch to source mode, edit the raw text, and copy the updated markdown back out when you are done. +`; + +type DemoResponse = { + editUrl?: string; + error?: string; +}; + +export default function ReadmeDemoPage() { + const startedRef = useRef(false); + const [error, setError] = useState(null); + const [busy, setBusy] = useState(true); + + const startDemo = useCallback(async () => { + setBusy(true); + setError(null); + try { + const response = await fetch('/api/anon-share/create', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ + fileName: 'with-md-readme-demo.md', + content: README_DEMO_MARKDOWN, + }), + }); + const data = (await response.json().catch(() => null)) as DemoResponse | null; + if (!response.ok || !data?.editUrl) { + setError(data?.error ?? 'Could not create the demo share.'); + return; + } + window.location.href = data.editUrl; + } catch (createError) { + setError(createError instanceof Error ? createError.message : 'Could not create the demo share.'); + } finally { + setBusy(false); + } + }, []); + + useEffect(() => { + if (startedRef.current) return; + startedRef.current = true; + void startDemo(); + }, [startDemo]); + + return ( +
+
+
+
+
+

Opening an editable README demo

+

+ This creates a safe sample markdown share. It does not connect to GitHub or touch a real repository. +

+ +
+ +
+

{busy ? 'Creating the demo link...' : 'Demo link did not open'}

+

+ {error + ? error + : 'You will land in an editable markdown document with sample README content.'} +

+ {error ? ( + + ) : null} +
+ +
+ +
+

+ + Back to with.md + +

+
+
+
+
+
+
+ ); +} diff --git a/web/src/app/(main)/page.tsx b/web/src/app/(main)/page.tsx index eefb85b..5b12d4b 100644 --- a/web/src/app/(main)/page.tsx +++ b/web/src/app/(main)/page.tsx @@ -280,25 +280,64 @@ export default function Home() {
-

Collaborate with.md files

+

Shareable markdown links

- Share and edit markdown files. With live cursors,{' '} + Turn one `.md` file into a read link for reviewers and an edit link for collaborators. The source stays clean while live cursors,{' '} {animatedSyncWord} {' '} - sync, and comments. + sync, and comments handle collaboration.

+
+

Try it with a markdown file

+

+ Start with the README demo, a blank file, or your own `.md` file. Send the read + link when someone only needs to review. Send the edit link when they should make + changes. Source mode keeps the raw markdown available, so the file can move back + to your repo, notes app, or agent without becoming a proprietary doc. +

+
+
+

Read link

+

A clean browser page for review and sharing.

+
+
+

Edit link

+

A private edit URL for comments and changes.

+
+
+

Source preserved

+

Raw markdown stays available in source mode.

+
+
+
+ + Try the README demo + + +
+
+ +
+
-

Share markdown instantly

+

Create a clean markdown share

Drag one `.md` file here, or upload manually. You get a read link and an edit - link. ... or{' '} + link without moving the source into another doc tool. ... or{' '}