513 lines
32 KiB
JavaScript
513 lines
32 KiB
JavaScript
import { Link } from 'react-router-dom'
|
|
import { Button } from './ui/button'
|
|
import { Card, CardContent, CardHeader, CardTitle } from './ui/card'
|
|
import { Badge } from './ui/badge'
|
|
import { Cpu, Database, Network, Shield, Zap, Scale, Globe, CheckCircle, BookOpen, Brain, Layers } from 'lucide-react'
|
|
import quantumSafeImage from '../assets/quantum_safe.png'
|
|
import MyceliumImage from '../assets/myceliumn.png'
|
|
import { AlertCircle } from 'lucide-react'
|
|
import GalaxyMachine from '../assets/tenstorrent_galaxy_internal_components.png'
|
|
import Navigation from './Navigation.jsx'
|
|
|
|
function TechnologyPage() {
|
|
return (
|
|
<div className="min-h-screen bg-background">
|
|
{/* The `Navigation` component is now rendered in `App.jsx` remove it from here */}
|
|
<div className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-24">
|
|
<img src={GalaxyMachine} alt="Galaxy" className="w-full h-auto rounded-lg shadow-lg" />
|
|
</div>
|
|
|
|
{/* Technology Hero Section */}
|
|
<section className="pb-16 px-4 sm:px-6 lg:px-8">
|
|
<div className="max-w-5xl mx-auto text-center space-y-8">
|
|
<Badge className="bg-primary/10 text-primary hover:bg-primary/20">Our Innovations</Badge>
|
|
<h1 className="text-4xl md:text-6xl font-bold text-foreground leading-tight">
|
|
Infrastructure Reimagined from <span className="text-primary">First Principles</span>
|
|
</h1>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto leading-relaxed">
|
|
ThreeFold's technology stack represents the most significant advancement in cloud infrastructure since virtualization. Built on breakthrough innovations in compute, storage, and networking that solve the fundamental problems of centralized systems.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Core Technology Pillars */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-card text-card-foreground">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Three Pillars of Innovation</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Overview of the three main technology innovations that power ThreeFold.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-3 gap-8">
|
|
<Card className="text-center hover:shadow-lg transition-shadow border-border bg-card text-card-foreground">
|
|
<CardHeader>
|
|
<Cpu className="w-16 h-16 mx-auto mb-4 text-primary" />
|
|
<CardTitle className="text-primary">Zero-OS Compute System</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<ul className="space-y-1 text-sm text-foreground">
|
|
<li>Stateless, autonomous operating system</li>
|
|
<li>Depending the usecase can more efficient than traditional systems</li>
|
|
<li>Self-healing and cryptographically secured</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow border-border bg-card text-card-foreground">
|
|
<CardHeader>
|
|
<Database className="w-16 h-16 mx-auto mb-4 text-green-600" />
|
|
<CardTitle className="text-green-600">Quantum-Safe Storage</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<ul className="space-y-1 text-sm text-foreground">
|
|
<li>Mathematical data dispersion (not replication)</li>
|
|
<li>20% overhead vs 400% in traditional systems</li>
|
|
<li>Unbreakable and self-healing architecture</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow border-border bg-card text-card-foreground">
|
|
<CardHeader>
|
|
<Network className="w-16 h-16 mx-auto mb-4 text-primary" />
|
|
<CardTitle className="text-primary">Mycelium Network</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<ul className="space-y-1 text-sm text-foreground">
|
|
<li>Peer-to-peer mesh overlay network</li>
|
|
<li>End-to-end encryption with shortest path routing</li>
|
|
<li>Resilient to internet failures and attacks</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Zero-OS: Autonomous Compute */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Zero-OS: The World's First Stateless Cloud OS</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Deep dive into the revolutionary operating system that powers ThreeFold.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-2 gap-8">
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Core Principles:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Autonomy:</strong> Operates without human maintenance</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Simplicity:</strong> Avoid layers, less is more</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Stateless:</strong> Immune to corruption</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Unique:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Zero-Install:</strong> Boots from network, no local installation</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Zero-Images:</strong> Container images 1000x smaller (2MB vs 2GB)</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Smart Contract for IT:</strong> Cryptographically secured deployments</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> <strong>Deterministic Execution:</strong> Reproducible, tamper-proof workloads</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div className="mt-12 text-center">
|
|
<h3 className="text-2xl font-bold text-primary mb-6">Technical Advantages:</h3>
|
|
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-green-600">Cryptographic verification</CardTitle></CardHeader>
|
|
<CardContent>Ensures integrity of all components.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-primary">Self-healing and autonomous</CardTitle></CardHeader>
|
|
<CardContent>Operates without human intervention.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-orange-600">Compatible with Kubernetes and VMs</CardTitle></CardHeader>
|
|
<CardContent>Flexible for diverse workloads.</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Quantum-Safe Storage: Unbreakable Data */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-card text-card-foreground">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Quantum-Safe Storage: Mathematics Over Replication</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Explanation of the mathematical storage breakthrough that ensures unbreakable data.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-2 gap-8 items-center">
|
|
<div className="md:col-span-1 flex justify-center">
|
|
<img src={quantumSafeImage} alt="Quantum Safe Storage" className="w-full h-auto rounded-lg shadow-lg" />
|
|
</div>
|
|
<div className="md:col-span-1 space-y-6">
|
|
<h3 className="text-2xl font-bold text-green-600">How It Works:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Data is fragmented and transformed into mathematical equations</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Equations are distributed across multiple nodes</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Original data fragments are discarded</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Any subset of equations can reconstruct the original data</li>
|
|
</ul>
|
|
<h3 className="text-2xl font-bold text-green-600">Zero-Knowledge Architecture:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> No single node knows what it stores</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Cryptographic proof without data exposure</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Post-quantum security resistant</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Self-healing against bitrot and failures</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Mycelium Network: Intelligent Connectivity */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Mycelium Network: The Internet's Missing Layer</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Technical deep dive into the networking innovation that ensures intelligent and resilient connectivity.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-2 gap-8 items-center">
|
|
<div className="md:col-span-1 space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Core Capabilities:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> <strong>End-to-End Encryption</strong> </li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> <strong>Shortest Path Routing</strong> </li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> <strong>Geographic Awareness:</strong></li>
|
|
</ul>
|
|
<h3 className="text-2xl font-bold text-primary mt-8">Technical Implementation:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Peer-to-peer mesh topology</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Up to 1 Gbps throughput per agent</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Protocol-agnostic data transport</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-primary" /> Authentication-based security (not perimeter-based)</li>
|
|
</ul>
|
|
</div>
|
|
<div className="md:col-span-1 flex justify-center">
|
|
<img src={MyceliumImage} alt="Quantum Safe Storage" className="w-full h-auto rounded-lg shadow-lg" />
|
|
</div>
|
|
</div>
|
|
<div className="mt-12 text-center">
|
|
<h3 className="text-2xl font-bold text-primary mb-6">Beyond Traditional Networking:</h3>
|
|
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-primary">Survives internet outages</CardTitle></CardHeader>
|
|
<CardContent>Ensures continuity even during major disruptions.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-green-600">Enables true peer-to-peer</CardTitle></CardHeader>
|
|
<CardContent>Facilitates direct communication between users.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-primary">Reduces latency</CardTitle></CardHeader>
|
|
<CardContent>Through optimal path selection and local routing.</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Architectural Innovations */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Integrated Architecture: Greater Than Sum of Parts</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
How ThreeFold's core technologies work together to create a superior infrastructure.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-2 gap-8">
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Geo-Aware Infrastructure:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Data sovereignty with precise location control</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Compliance with local regulations (GDPR, etc.)</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Shortest physical paths for efficiency</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Resilient to geopolitical disruptions</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Smart Contract for IT:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Cryptographically secured deployments</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Multi-signature authentication</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Immutable execution records on blockchain</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Autonomous management without human intervention</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
{/* Technical Comparisons */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
|
|
<div className="max-w-4xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">ThreeFold vs Traditional Infrastructure</h2>
|
|
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
|
|
Side-by-side comparison with traditional approaches.
|
|
</p>
|
|
</div>
|
|
<div className="overflow-x-auto">
|
|
<table className="min-w-full bg-card rounded-lg shadow-md">
|
|
<thead>
|
|
<tr className="bg-primary text-primary-foreground">
|
|
<th className="py-3 px-4 text-left">Aspect</th>
|
|
<th className="py-3 px-4 text-left">Traditional Cloud</th>
|
|
<th className="py-3 px-4 text-left">ThreeFold</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">OS Deployment</td>
|
|
<td className="py-3 px-4">Local installation, complex updates</td>
|
|
<td className="py-3 px-4 font-semibold">Network boot, stateless</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Container Images</td>
|
|
<td className="py-3 px-4">2GB+ monolithic images</td>
|
|
<td className="py-3 px-4 font-semibold">2MB metadata-only</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Storage Redundancy</td>
|
|
<td className="py-3 px-4">400% overhead (4 copies)</td>
|
|
<td className="py-3 px-4 font-semibold">20% overhead (math)</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Network Security</td>
|
|
<td className="py-3 px-4">Perimeter-based firewalls</td>
|
|
<td className="py-3 px-4 font-semibold">End-to-end encryption</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Management</td>
|
|
<td className="py-3 px-4">Human administrators</td>
|
|
<td className="py-3 px-4 font-semibold">Autonomous agents</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Scalability</td>
|
|
<td className="py-3 px-4">Vertical, expensive</td>
|
|
<td className="py-3 px-4 font-semibold">Horizontal, unlimited</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Energy Efficiency</td>
|
|
<td className="py-3 px-4">High consumption</td>
|
|
<td className="py-3 px-4 font-semibold">10x more efficient</td>
|
|
</tr>
|
|
<tr className="border-b border-border">
|
|
<td className="py-3 px-4">Data Sovereignty</td>
|
|
<td className="py-3 px-4">Limited control</td>
|
|
<td className="py-3 px-4 font-semibold">Complete control</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Implementation Status & Roadmap */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-card text-card-foreground">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Production-Ready Technology & Roadmap</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Current status and future developments of ThreeFold's technology.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-3 gap-8">
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Currently Available:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Zero-OS Core: Production (multiple years)</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Quantum-Safe Storage: Production</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Mycelium Network: Beta (v3.13+)</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Web Gateway: Production</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Coming H2 2025:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Smart Contract for IT: General availability</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Geo-Aware AI Agents (3AI)</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> 3CORE Ledger: Geo-fenced blockchain</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> FungiStor: Global content delivery</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Enhanced enterprise features</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Live Deployment Stats:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li>2000+ nodes across 70+ countries</li>
|
|
<li>60,000+ CPU cores active</li>
|
|
<li>1+ million contracts processed</li>
|
|
<li>Petabytes of data stored safely</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Open Source & Standards */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Built on Open Principles</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Commitment to openness and interoperability.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-3 gap-8">
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Open Source Components:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Core technology stack available on GitHub</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Community-driven development</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Transparent security auditing</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> No vendor lock-in</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Standards Compliance:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> POSIX filesystem compatibility</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Docker and Kubernetes support</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Standard networking protocols</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Blockchain interoperability</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Developer Ecosystem:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li>Comprehensive APIs and SDKs</li>
|
|
<li>Extensive documentation</li>
|
|
<li>Active community support</li>
|
|
<li>Regular hackathons and events</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Security & Compliance */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-card text-card-foreground">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Security by Design & Compliance</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Advanced security features and compliance capabilities.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-2 gap-8">
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Cryptographic Foundation:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> End-to-end encryption everywhere</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Post-quantum cryptography ready</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Zero-knowledge data storage</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Immutable audit trails</li>
|
|
</ul>
|
|
</div>
|
|
<div className="space-y-6">
|
|
<h3 className="text-2xl font-bold text-primary">Compliance Features:</h3>
|
|
<ul className="space-y-3 text-lg text-foreground">
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> GDPR compliance through data sovereignty</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Regulatory jurisdiction control</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Audit-ready transaction logs</li>
|
|
<li className="flex items-center gap-2"><CheckCircle className="h-5 w-5 text-green-500" /> Data residency guarantees</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div className="mt-12 text-center">
|
|
<h3 className="text-2xl font-bold text-primary mb-6">Threat Resistance:</h3>
|
|
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-primary">Immune to ransomware</CardTitle></CardHeader>
|
|
<CardContent>Stateless OS prevents persistent threats.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-green-600">DDoS resistant</CardTitle></CardHeader>
|
|
<CardContent>Distributed architecture mitigates attacks.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-primary">Quantum computing resistant</CardTitle></CardHeader>
|
|
<CardContent>Future-proof security protocols.</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow bg-card text-card-foreground">
|
|
<CardHeader><CardTitle className="text-orange-600">Censorship resistant</CardTitle></CardHeader>
|
|
<CardContent>Mycelium network routes around blocking.</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Technical Resources */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="text-center space-y-8 mb-12">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-foreground">Dive Deeper into ThreeFold Technology</h2>
|
|
<p className="text-xl text-muted-foreground max-w-4xl mx-auto">
|
|
Access comprehensive technical documentation and resources.
|
|
</p>
|
|
</div>
|
|
<div className="grid md:grid-cols-2 gap-8">
|
|
<Card className="text-center hover:shadow-lg transition-shadow border-border bg-card text-card-foreground">
|
|
<CardHeader>
|
|
<CardTitle className="text-primary">Technical Documentation</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<ul className="space-y-2 text-foreground">
|
|
<li>Architecture whitepapers</li>
|
|
<li>API documentation</li>
|
|
<li>Deployment guides</li>
|
|
<li>Best practices</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
<Card className="text-center hover:shadow-lg transition-shadow border-border bg-card text-card-foreground">
|
|
<CardHeader>
|
|
<CardTitle className="text-primary">Try It Yourself</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<ul className="space-y-2 text-foreground">
|
|
<li>Live dashboard: <a href="https://dashboard.grid.tf" target="_blank" rel="noopener noreferrer" className="text-primary hover:underline">https://dashboard.grid.tf</a></li>
|
|
<li>GitHub repositories</li>
|
|
<li>Developer sandbox</li>
|
|
<li>Community forums</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
<div className="mt-12 text-center">
|
|
<h3 className="text-2xl font-bold text-primary mb-6">Get Support:</h3>
|
|
<ul className="space-y-2 text-lg text-foreground">
|
|
<li>Technical community</li>
|
|
<li>Professional services</li>
|
|
<li>Training programs</li>
|
|
<li>Certification paths</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Footer */}
|
|
<footer className="py-8 px-4 sm:px-6 lg:px-8 bg-card text-card-foreground">
|
|
<div className="max-w-6xl mx-auto text-center">
|
|
<div className="flex items-center justify-center space-x-2 mb-4">
|
|
<Globe className="h-6 w-6 text-primary" />
|
|
<span className="text-xl font-bold text-foreground">ThreeFold Galaxy</span>
|
|
</div>
|
|
<p className="text-sm text-muted-foreground mt-4">© 2025 ThreeFold Galaxy. A new era of decentralized infrastructure.</p>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default TechnologyPage |