Skip to content

Review Home Page Positioning #50 #51

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
cable8mm merged 1 commit into from
Jun 12, 2026
Merged

Review Home Page Positioning #50 #51

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
270 changes: 174 additions & 96 deletions src/pages/index.astro
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,132 +6,210 @@ import SiteLayout from '../layouts/SiteLayout.astro';
title="REPL Works"
description="REPL Works is an AI-Native Product Development Framework for building projects with durable memory, model independence, and Git-native continuity."
>
<section class="space-y-10">
<div
class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm sm:p-12"
>
<p
class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-500"
>
AI-Native Product Development Framework
</p>
<h1
class="mt-4 max-w-4xl text-4xl font-semibold tracking-tight text-slate-900 sm:text-6xl"
>
Build projects that remember.
</h1>
<p class="mt-6 max-w-3xl text-xl leading-9 text-slate-700">
REPL Works keeps product work durable with project memory, model
independence, Git-native development, context compression, and long-term
project continuity.
</p>
<div class="mt-8 flex flex-col gap-4 sm:flex-row sm:items-center">
<section class="space-y-16">
<div class="relative overflow-hidden rounded-3xl border border-slate-200 bg-white p-8 shadow-sm sm:p-12">
<div class="absolute inset-x-0 top-0 h-1 bg-gradient-to-r from-slate-900 via-slate-500 to-slate-300"></div>
<div class="grid gap-10 lg:grid-cols-[1.5fr_0.85fr] lg:items-end">
<div class="max-w-4xl">
<p class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-500">
AI-Native Product Development Framework
</p>
<h1 class="mt-6 text-4xl font-semibold tracking-tight text-slate-900 sm:text-6xl">
AI는 바뀝니다.
<br />
프로젝트는 계속되어야 합니다.
</h1>
<p class="mt-6 max-w-3xl text-xl leading-9 text-slate-700">
REPL Works는 AI와 사람이 장기간 제품을 개발하기 위한 프레임워크입니다.
</p>
<p class="mt-4 max-w-3xl text-lg leading-8 text-slate-700">
프로젝트 기억을 Git과 문서에 저장하여 모델이 바뀌고 세션이 종료되어도 개발을 이어갈 수 있습니다.
</p>
<p class="mt-6 inline-flex rounded-full border border-slate-200 bg-slate-50 px-4 py-2 text-sm font-semibold text-slate-700">
Not an AI agent. A framework for running AI projects.
</p>
</div>

<aside class="border-l border-slate-200 pl-0 lg:pl-8">
<p class="text-xs font-semibold uppercase tracking-[0.35em] text-slate-500">
What it gives you
</p>
<ul class="mt-5 space-y-3 text-base font-medium text-slate-800">
<li>Model Independence</li>
<li>Project Continuity</li>
<li>Reduced Context Cost</li>
<li>Reduced Onboarding Cost</li>
<li>Git-Native Workflow</li>
</ul>
</aside>
</div>
<div class="mt-10 flex flex-col gap-4 sm:flex-row sm:items-center">
<a
href="/workflow"
class="inline-flex items-center justify-center rounded-full bg-slate-900 px-6 py-3 text-sm font-semibold text-white transition hover:bg-slate-800"
>
Learn the Workflow
워크플로 보기
</a>
<a
href="https://github.com/replworks/replworks.github.io"
target="_blank"
rel="noopener noreferrer"
class="inline-flex items-center justify-center rounded-full border border-slate-300 bg-white px-6 py-3 text-sm font-semibold text-slate-900 transition hover:border-slate-400 hover:bg-slate-50"
>
View GitHub
GitHub 보기
</a>
</div>
</div>

<div class="grid gap-6 md:grid-cols-2 xl:grid-cols-3">
<article
class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm"
>
<h2 class="text-2xl font-semibold text-slate-900">Project Memory</h2>
<p class="mt-4 text-slate-600 leading-7">
Capture decisions, constraints, and intent in durable documents
instead of leaving them in chat history.
<section class="grid gap-10 border-t border-slate-200 pt-10 lg:grid-cols-[0.9fr_1.1fr] lg:items-start">
<div>
<p class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-500">
Problem
</p>
</article>

<article
class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm"
>
<h2 class="text-2xl font-semibold text-slate-900">
Model Independence
<h2 class="mt-4 text-3xl font-semibold tracking-tight text-slate-900 sm:text-4xl">
REPL Works가 해결하는 문제
</h2>
<p class="mt-4 text-slate-600 leading-7">
Switch models without losing the project structure that keeps work
understandable and reviewable.
</p>
</article>
</div>
<div class="space-y-4 text-lg leading-8 text-slate-700">
<p>AI는 코드를 잘 작성합니다.</p>
<p>하지만 프로젝트를 기억하지는 못합니다.</p>
<p>몇 주가 지나면 다시 설명해야 합니다.</p>
<pre class="overflow-x-auto rounded-2xl bg-slate-950 p-6 text-sm leading-7 text-slate-100"><code>왜 만드는가?

<article
class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm"
>
<h2 class="text-2xl font-semibold text-slate-900">
Git-Native Development
</h2>
<p class="mt-4 text-slate-600 leading-7">
Keep product memory in versioned Markdown so every change can be
reviewed, committed, and traced.
</p>
</article>
무엇을 만드는가?

<article
class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm"
>
<h2 class="text-2xl font-semibold text-slate-900">
Context Compression
</h2>
<p class="mt-4 text-slate-600 leading-7">
Compress project history into the smallest set of documents needed for
the next decision or task.
현재 구조는 무엇인가?

어떤 결정을 내렸는가?</code></pre>
<p>REPL Works는 이러한 정보를 프로젝트 문서에 저장합니다.</p>
<p>프로젝트 기억은 세션이 아니라 Git에 남아야 합니다.</p>
</div>
</section>

<section class="grid gap-10 border-t border-slate-200 pt-10 lg:grid-cols-[0.9fr_1.1fr] lg:items-start">
<div>
<p class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-500">
Benefits
</p>
</article>
<h2 class="mt-4 text-3xl font-semibold tracking-tight text-slate-900 sm:text-4xl">
프로젝트를 계속할 수 있게 만드는 다섯 가지 기반
</h2>
</div>
<div class="space-y-9">
<article class="border-l border-slate-200 pl-6">
<h3 class="text-xl font-semibold text-slate-900">Model Independence</h3>
<p class="mt-3 max-w-2xl text-slate-700 leading-8">
특정 AI 모델에 의존하지 않습니다. 프로젝트 기억은 Git과 문서에 저장되므로 새로운 모델도 프로젝트를 이어갈 수 있습니다.
</p>
</article>
<article class="border-l border-slate-200 pl-6">
<h3 class="text-xl font-semibold text-slate-900">Project Continuity</h3>
<p class="mt-3 max-w-2xl text-slate-700 leading-8">
프로젝트는 수개월 또는 수년 동안 유지됩니다. 세션이 종료되어도 프로젝트의 의도와 구조는 유지됩니다.
</p>
</article>
<article class="border-l border-slate-200 pl-6">
<h3 class="text-xl font-semibold text-slate-900">Reduced Context Cost</h3>
<p class="mt-3 max-w-2xl text-slate-700 leading-8">
프로젝트 기억을 문서로 압축합니다. AI는 필요한 문서만 읽고 작업할 수 있습니다.
</p>
</article>
<article class="border-l border-slate-200 pl-6">
<h3 class="text-xl font-semibold text-slate-900">Reduced Onboarding Cost</h3>
<p class="mt-3 max-w-2xl text-slate-700 leading-8">
새로운 사람과 새로운 AI는 문서를 읽고 빠르게 프로젝트를 이해할 수 있습니다.
</p>
</article>
<article class="border-l border-slate-200 pl-6">
<h3 class="text-xl font-semibold text-slate-900">Git-Native Workflow</h3>
<p class="mt-3 max-w-2xl text-slate-700 leading-8">
모든 프로젝트 기억은 Git으로 관리됩니다. 현재 상태는 문서가 설명하고, 과거 상태는 Git이 보존합니다.
</p>
</article>
</div>
</section>

<article
class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm md:col-span-2 xl:col-span-1"
>
<h2 class="text-2xl font-semibold text-slate-900">
Long-Term Continuity
<section class="grid gap-10 border-t border-slate-200 pt-10 lg:grid-cols-[0.9fr_1.1fr] lg:items-start">
<div>
<p class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-500">
Workflow
</p>
<h2 class="mt-4 text-3xl font-semibold tracking-tight text-slate-900 sm:text-4xl">
How REPL Works Works
</h2>
<p class="mt-4 text-slate-600 leading-7">
Preserve momentum across sessions, contributors, and release cycles
without rebuilding context from scratch.
</div>
<div class="space-y-6">
<pre class="overflow-x-auto rounded-2xl bg-slate-950 p-6 text-sm leading-7 text-slate-100"><code>IDEAS.md
↓
PITCHING_SCRIPT.md
↓
PRODUCT_SPEC.md
↓
ARCHITECTURE.md
↓
FRAMEWORK.md
↓
TASKS.md
↓
AGENTS.md
↓
Planning AI
↓
Execution AI
↓
Human Review
↓
Merge</code></pre>
<p class="max-w-3xl text-lg leading-8 text-slate-700">
REPL Works는 아이디어를 제품으로 만들기 위한 AI-Native Product Development Workflow를 제공합니다.
</p>
</article>
</div>

<div class="rounded-3xl border border-slate-200 bg-white p-8 shadow-sm">
<h2 class="text-2xl font-semibold text-slate-900">
Start with the workflow
</h2>
<p class="mt-4 max-w-3xl text-slate-600 leading-7">
The best entry point is the workflow, because it shows how REPL Works
moves from idea refinement to operation through documents, discussion
AI, execution AI, and human review.
</p>
<div class="mt-6 flex flex-wrap gap-3">
<a
href="/workflow"
class="rounded-full bg-slate-100 px-4 py-2 text-sm font-semibold text-slate-900 transition hover:bg-slate-200"
class="inline-flex rounded-full bg-slate-900 px-5 py-3 text-sm font-semibold text-white transition hover:bg-slate-800"
>
Workflow
</a>
<a
href="/documents"
class="rounded-full bg-slate-100 px-4 py-2 text-sm font-semibold text-slate-900 transition hover:bg-slate-200"
>
Documents
워크플로 자세히 보기
</a>
</div>
</section>

<section class="grid gap-10 border-t border-slate-200 pt-10 lg:grid-cols-[0.9fr_1.1fr] lg:items-start">
<div>
<p class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-500">
Showcase
</p>
<h2 class="mt-4 text-3xl font-semibold tracking-tight text-slate-900 sm:text-4xl">
REPL Works Compatible Projects
</h2>
</div>
<div class="space-y-6">
<p class="text-lg leading-8 text-slate-700">
REPL Works는 실제 프로젝트에서 사용되고 있습니다.
</p>
<ul class="grid gap-3 text-slate-700 sm:grid-cols-2 lg:grid-cols-3">
<li>REPL Works Website</li>
<li>ai-issue</li>
<li>ETERNOps</li>
<li>ETERN Labs</li>
<li>ClayTube</li>
<li>MMA</li>
<li>WIFI Note</li>
</ul>
<a
href="/prompts"
class="rounded-full bg-slate-100 px-4 py-2 text-sm font-semibold text-slate-900 transition hover:bg-slate-200"
href="/showcase"
class="inline-flex rounded-full bg-slate-100 px-5 py-3 text-sm font-semibold text-slate-900 transition hover:bg-slate-200"
>
Prompts
Showcase 보기
</a>
</div>
</div>
</section>

<section class="rounded-3xl border border-slate-200 bg-slate-950 p-10 text-slate-50 shadow-sm">
<p class="text-sm font-semibold uppercase tracking-[0.3em] text-slate-400">
Core Idea
</p>
<pre class="mt-6 overflow-x-auto rounded-2xl border border-slate-800 bg-slate-900 p-6 text-sm leading-7 text-slate-100"><code>Models forget.

Projects must not.</code></pre>
</section>
</section>
</SiteLayout>
Loading