Lean into 'you don't need to code' — Two ways to ship section + Genies headline

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
vyakymenko 2026-04-23 06:40:21 +00:00
parent a0a2bf3229
commit def2fa6d56

View File

@ -67,10 +67,14 @@ export default function Home() {
Fibe orchestrates complete fullstack environments apps, APIs, databases, Fibe orchestrates complete fullstack environments apps, APIs, databases,
AI agents, preview envs, jobs on <em className="not-italic" style={{color:'rgba(196,181,253,0.85)'}}>your</em> infrastructure. AI agents, preview envs, jobs on <em className="not-italic" style={{color:'rgba(196,181,253,0.85)'}}>your</em> infrastructure.
</p> </p>
<p className="text-base max-w-xl mx-auto mb-14" <p className="text-base max-w-xl mx-auto mb-4"
style={{color:'rgba(161,161,170,0.45)'}}> style={{color:'rgba(161,161,170,0.45)'}}>
No DevOps team. No YAML hell. No lock-in. No ticket. Just ship. No DevOps team. No YAML hell. No lock-in. No ticket. Just ship.
</p> </p>
<p className="text-base max-w-xl mx-auto mb-14 font-medium"
style={{color:'rgba(167,139,250,0.55)'}}>
Or skip the code entirely describe what you want and a Genie builds it.
</p>
<div className="flex flex-col sm:flex-row gap-3 justify-center mb-24"> <div className="flex flex-col sm:flex-row gap-3 justify-center mb-24">
<a href="https://next.fibe.live/register" <a href="https://next.fibe.live/register"
@ -130,6 +134,46 @@ export default function Home() {
</div> </div>
</section> </section>
{/* ── TWO WAYS ── */}
<section className="py-24 px-6" style={{borderTop:'1px solid rgba(139,92,246,0.08)'}}>
<div className="max-w-4xl mx-auto">
<p className="text-xs font-semibold uppercase tracking-widest text-center mb-12"
style={{color:'rgba(139,92,246,0.6)'}}>Two ways to ship</p>
<div className="grid md:grid-cols-2 gap-5">
<div className="glass rounded-2xl p-8" style={{borderColor:'rgba(139,92,246,0.15)'}}>
<div className="text-2xl mb-4">👨💻</div>
<h3 className="font-semibold text-white mb-3 text-lg">You write the code</h3>
<p className="text-sm leading-relaxed mb-6" style={{color:'rgba(161,161,170,0.65)'}}>
Git push. Fibe builds, routes, SSLs and hot-reloads. Your entire stack, live in seconds, on your infra.
</p>
<div className="font-mono text-xs px-3 py-2 rounded-lg"
style={{background:'rgba(139,92,246,0.08)',color:'rgba(139,92,246,0.6)',border:'1px solid rgba(139,92,246,0.12)'}}>
git push origin main&nbsp;&nbsp;<span className="text-emerald-400"> live</span>
</div>
</div>
<div className="glass-strong rounded-2xl p-8 relative overflow-hidden"
style={{borderColor:'rgba(167,139,250,0.3)'}}>
<div className="glow-orb" style={{width:300,height:300,background:'radial-gradient(circle, rgba(139,92,246,0.15) 0%, transparent 70%)',top:-80,right:-80}} />
<div className="relative z-10">
<div className="text-2xl mb-4">🤖</div>
<h3 className="font-semibold text-white mb-3 text-lg">Genies write the code</h3>
<p className="text-sm leading-relaxed mb-6" style={{color:'rgba(161,161,170,0.7)'}}>
Describe the feature. A Genie plans, codes, tests and pushes.
You review. You never open an editor.
</p>
<div className="font-mono text-xs px-3 py-2 rounded-lg"
style={{background:'rgba(139,92,246,0.12)',color:'rgba(196,181,253,0.7)',border:'1px solid rgba(167,139,250,0.2)'}}>
&ldquo;add Google OAuth&rdquo;&nbsp;&nbsp;<span className="text-emerald-400"> shipped</span>
</div>
</div>
</div>
</div>
</div>
</section>
{/* ── TECH TICKER ── */} {/* ── TECH TICKER ── */}
<div className="py-6 overflow-hidden relative select-none" style={{borderTop:'1px solid rgba(139,92,246,0.05)'}}> <div className="py-6 overflow-hidden relative select-none" style={{borderTop:'1px solid rgba(139,92,246,0.05)'}}>
<div className="flex gap-12 animate-ticker" style={{width:'max-content'}}> <div className="flex gap-12 animate-ticker" style={{width:'max-content'}}>
@ -264,14 +308,14 @@ export default function Home() {
<div className="text-center mb-16"> <div className="text-center mb-16">
<p className="text-xs font-semibold uppercase tracking-widest mb-4" style={{color:'rgba(139,92,246,0.7)'}}>Genies AI Development Agents</p> <p className="text-xs font-semibold uppercase tracking-widest mb-4" style={{color:'rgba(139,92,246,0.7)'}}>Genies AI Development Agents</p>
<h2 className="font-display text-4xl md:text-6xl font-normal mb-6" style={{letterSpacing:'-0.02em'}}> <h2 className="font-display text-4xl md:text-6xl font-normal mb-6" style={{letterSpacing:'-0.02em'}}>
Not a chatbot.<br /> You don&apos;t have to write<br />
<em className="gradient-text not-italic">A dev agent in your codebase.</em> <em className="gradient-text not-italic">a single line of code.</em>
</h2> </h2>
<p className="text-lg max-w-2xl mx-auto mb-10 leading-relaxed" <p className="text-lg max-w-2xl mx-auto mb-10 leading-relaxed"
style={{color:'rgba(161,161,170,0.75)'}}> style={{color:'rgba(161,161,170,0.75)'}}>
Genies are autonomous AI agents that live inside your Playgrounds with a real terminal, Genies are autonomous AI agents that live inside your Playgrounds
a file editor, Docker access and your full codebase. Assign a task. with a real terminal, a file editor, Docker access and your full codebase.
They plan, build, test and push. Describe the feature. They plan it, build it, test it and push it.
</p> </p>
{/* Provider chips */} {/* Provider chips */}