Spaces:
Runtime error
Runtime error
Download frontend/src/app/page.tsx from IDKHowToCodeFr/tinyml-backend: direct link, hf CLI and curl.
- Browser
- Download file 11.1 kB
-
https://huggingface.co/spaces/IDKHowToCodeFr/tinyml-backend/resolve/main/frontend/src/app/page.tsx
- Command line
-
hf download hf://spaces/IDKHowToCodeFr/tinyml-backend/frontend/src/app/page.tsx
-
curl -L -o page.tsx https://huggingface.co/spaces/IDKHowToCodeFr/tinyml-backend/resolve/main/frontend/src/app/page.tsx
11.1 kB
| "use client"; | |
| import Link from "next/link"; | |
| import { Cpu, Zap, Activity, ShieldCheck, ArrowRight, Terminal, GitBranch, Sliders } from "lucide-react"; | |
| export default function Home() { | |
| return ( | |
| <main className="min-h-dvh bg-canvas-cream flex flex-col font-mono selection:bg-hazard selection:text-white bg-blueprint-grid"> | |
| {/* Hero Section */} | |
| <section className="max-w-350 mx-auto w-full px-4 sm:px-8 pt-10 md:pt-16 pb-16 grid grid-cols-1 lg:grid-cols-12 gap-10 lg:gap-14 flex-1"> | |
| <div className="lg:col-span-7 flex flex-col justify-center"> | |
| {/* Eyebrow Badge */} | |
| <div className="inline-flex items-center gap-2 px-3 py-1 text-[11px] font-bold uppercase tracking-wider border border-ink/20 bg-white text-ink mb-6 self-start shadow-[2px_2px_0px_#141413]"> | |
| <span className="w-2 h-2 rounded-full bg-hazard" /> | |
| <span>Edge AI Clinical Intelligence</span> | |
| <span className="text-ink/30">/</span> | |
| <span className="text-slate font-medium">ESP32 & ARM Cortex-M</span> | |
| </div> | |
| <h1 className="text-[clamp(2.75rem,6vw,6rem)] mb-6 leading-[0.92] text-ink tracking-tight font-extrabold text-balance"> | |
| CLINICAL<br /> | |
| INFERENCE<br /> | |
| <span className="text-hazard">AT THE EDGE.</span> | |
| </h1> | |
| <p className="text-[15px] sm:text-[16px] text-slate-700 max-w-xl leading-relaxed text-pretty mb-8 font-sans font-normal border-l-3 border-hazard pl-4"> | |
| Cardiovascular anomaly classification transpiled directly for bare-metal microcontrollers. Stream multi-channel physiological vitals, evaluate a calibrated 5-model soft-voting ensemble, and export zero-malloc C99 headers for embedded silicon. | |
| </p> | |
| {/* Technical Telemetry Badges Matrix */} | |
| <div className="crosshair-corner grid grid-cols-2 sm:grid-cols-4 gap-px bg-ink border-2 border-ink mb-8 max-w-xl shadow-[3px_3px_0px_0px_#141413]"> | |
| <div className="bg-white p-3 text-center"> | |
| <div className="text-[9px] text-slate font-bold uppercase tracking-wider mb-0.5">INFERENCE LATENCY</div> | |
| <div className="text-[15px] font-black text-ink tabular-nums">18.4 μs</div> | |
| <div className="text-[9px] text-slate tracking-tight mt-0.5">ESP32-S3 @ 240MHz</div> | |
| </div> | |
| <div className="bg-white p-3 text-center"> | |
| <div className="text-[9px] text-slate font-bold uppercase tracking-wider mb-0.5">STATIC RAM</div> | |
| <div className="text-[15px] font-black text-ink tabular-nums">28 Bytes</div> | |
| <div className="text-[9px] text-slate tracking-tight mt-0.5">Zero Dynamic Heap</div> | |
| </div> | |
| <div className="bg-white p-3 text-center"> | |
| <div className="text-[9px] text-slate font-bold uppercase tracking-wider mb-0.5">SERIAL BUS</div> | |
| <div className="text-[15px] font-black text-ink tabular-nums">115.2k</div> | |
| <div className="text-[9px] text-slate tracking-tight mt-0.5">Web Serial API</div> | |
| </div> | |
| <div className="bg-white p-3 text-center"> | |
| <div className="text-[9px] text-slate font-bold uppercase tracking-wider mb-0.5">ECG SAMPLING</div> | |
| <div className="text-[15px] font-black text-hazard tabular-nums">250 Hz</div> | |
| <div className="text-[9px] text-slate tracking-tight mt-0.5">Lead-II Waveform</div> | |
| </div> | |
| </div> | |
| {/* Action Button Grid */} | |
| <div className="grid grid-cols-1 sm:grid-cols-2 gap-3 max-w-xl"> | |
| <Link | |
| href="/monitor" | |
| className="btn-tactile-hazard h-12 px-6 text-[13px] font-bold uppercase tracking-wider flex items-center justify-center gap-2 cursor-pointer" | |
| > | |
| <Activity size={16} /> | |
| Launch Monitor | |
| </Link> | |
| <Link | |
| href="/simulator" | |
| className="btn-tactile bg-white text-ink border-2 border-ink h-12 px-5 text-[12px] font-bold uppercase tracking-wider hover:bg-ink hover:text-white transition-colors flex items-center justify-center gap-1.5 cursor-pointer" | |
| > | |
| <Sliders size={14} /> | |
| Simulator | |
| <ArrowRight size={14} /> | |
| </Link> | |
| <Link | |
| href="/edge" | |
| className="btn-tactile bg-canvas-cream text-ink border-2 border-ink h-12 px-5 text-[12px] font-bold uppercase tracking-wider hover:bg-ink hover:text-white transition-colors flex items-center justify-center gap-2 cursor-pointer" | |
| > | |
| <Terminal size={14} /> | |
| C99 Compiler | |
| </Link> | |
| <Link | |
| href="/mlops" | |
| className="btn-tactile bg-white text-ink border-2 border-ink h-12 px-6 text-[12px] font-bold uppercase tracking-wider hover:bg-ink hover:text-white transition-colors flex items-center justify-center gap-2 cursor-pointer" | |
| > | |
| <GitBranch size={14} /> | |
| MLOps Registry | |
| </Link> | |
| </div> | |
| </div> | |
| {/* Feature Grid: Three Structural Modules */} | |
| <div className="lg:col-span-5 grid grid-cols-1 gap-px bg-ink border-2 border-ink shadow-[6px_6px_0px_0px_#141413] self-center"> | |
| {/* Card 01 */} | |
| <Link | |
| href="/edge" | |
| className="bg-white p-6 sm:p-7 flex flex-col justify-between group cursor-pointer hover:bg-[#FAF8F5] transition-colors relative" | |
| > | |
| <div className="flex justify-between items-center mb-3"> | |
| <div className="text-[10px] text-slate font-bold tracking-wider group-hover:text-hazard transition-colors flex items-center gap-2"> | |
| <span className="w-1.5 h-1.5 bg-hazard inline-block" /> | |
| <span>01 · QUANTIZATION ENGINE</span> | |
| </div> | |
| <Cpu size={16} className="text-slate group-hover:text-hazard transition-colors" /> | |
| </div> | |
| <div> | |
| <h3 className="font-sans text-[18px] sm:text-[20px] font-black uppercase tracking-tight mb-2 text-ink group-hover:text-hazard transition-colors"> | |
| INT8 Quantized Weights | |
| </h3> | |
| <p className="text-[13px] text-slate-600 leading-relaxed font-sans font-normal"> | |
| Continuous weight vectors and decision thresholds quantized to 8-bit integers. Delivers 75% SRAM reduction for constrained microcontrollers without floating-point FPU reliance. | |
| </p> | |
| </div> | |
| <div className="mt-4 pt-3 border-t border-ink/10 flex justify-between items-center text-[10px] font-bold text-slate tracking-wider tabular-nums"> | |
| <span>MEMORY SCALE: 4:1 INT8</span> | |
| <span className="text-hazard font-black flex items-center gap-1"> | |
| OPEN COMPILER → | |
| </span> | |
| </div> | |
| </Link> | |
| {/* Card 02 */} | |
| <Link | |
| href="/simulator" | |
| className="bg-canvas-cream p-6 sm:p-7 flex flex-col justify-between group cursor-pointer hover:bg-white transition-colors relative" | |
| > | |
| <div className="flex justify-between items-center mb-3"> | |
| <div className="text-[10px] text-slate font-bold tracking-wider group-hover:text-hazard transition-colors flex items-center gap-2"> | |
| <span className="w-1.5 h-1.5 bg-hazard inline-block" /> | |
| <span>02 · ENSEMBLE ARBITRATION</span> | |
| </div> | |
| <Zap size={16} className="text-slate group-hover:text-hazard transition-colors" /> | |
| </div> | |
| <div> | |
| <h3 className="font-sans text-[18px] sm:text-[20px] font-black uppercase tracking-tight mb-2 text-ink group-hover:text-hazard transition-colors"> | |
| 5-Model Soft-Voting | |
| </h3> | |
| <p className="text-[13px] text-slate-600 leading-relaxed font-sans font-normal"> | |
| Aggregates class probabilities across Random Forest (30 trees), Linear SVM, Logistic Regression, MLP Neural Network, and KNN to suppress single-estimator variance. | |
| </p> | |
| </div> | |
| <div className="mt-4 pt-3 border-t border-ink/10 flex justify-between items-center text-[10px] font-bold text-slate tracking-wider tabular-nums"> | |
| <span>TOPOLOGY: 5 ESTIMATORS</span> | |
| <span className="text-hazard font-black flex items-center gap-1"> | |
| OPEN SIMULATOR → | |
| </span> | |
| </div> | |
| </Link> | |
| {/* Card 03 */} | |
| <Link | |
| href="/edge" | |
| className="bg-white p-6 sm:p-7 flex flex-col justify-between group cursor-pointer hover:bg-[#FAF8F5] transition-colors relative" | |
| > | |
| <div className="flex justify-between items-center mb-3"> | |
| <div className="text-[10px] text-slate font-bold tracking-wider group-hover:text-hazard transition-colors flex items-center gap-2"> | |
| <span className="w-1.5 h-1.5 bg-hazard inline-block" /> | |
| <span>03 · CODE GENERATION</span> | |
| </div> | |
| <ShieldCheck size={16} className="text-slate group-hover:text-hazard transition-colors" /> | |
| </div> | |
| <div> | |
| <h3 className="font-sans text-[18px] sm:text-[20px] font-black uppercase tracking-tight mb-2 text-ink group-hover:text-hazard transition-colors"> | |
| Zero-Malloc C Headers | |
| </h3> | |
| <p className="text-[13px] text-slate-600 leading-relaxed font-sans font-normal"> | |
| Transpiles scikit-learn ensembles directly to standalone C99 headers (<code className="text-hazard font-bold font-mono">model.h</code>) with zero dynamic heap allocation, avoiding fragmentation crashes on bare-metal firmware. | |
| </p> | |
| </div> | |
| <div className="mt-4 pt-3 border-t border-ink/10 flex justify-between items-center text-[10px] font-bold text-slate tracking-wider tabular-nums"> | |
| <span>TARGET: ESP32 // CORTEX-M</span> | |
| <span className="text-hazard font-black flex items-center gap-1"> | |
| VIEW C99 EXPORTER → | |
| </span> | |
| </div> | |
| </Link> | |
| </div> | |
| </section> | |
| {/* Understated Architecture Strip */} | |
| <section className="border-t-2 border-ink bg-white py-3.5 px-4 sm:px-8"> | |
| <div className="max-w-350 mx-auto flex items-center justify-between text-[11px] font-bold uppercase tracking-wider text-slate flex-wrap gap-4"> | |
| <div className="flex items-center gap-2 text-ink"> | |
| <span className="w-2 h-2 bg-hazard inline-block" /> | |
| <span className="font-black">CORE ARCHITECTURE:</span> | |
| </div> | |
| <span>UART 115,200 (8-N-1)</span> | |
| <span>LEAD-II SAMPLING (250 HZ)</span> | |
| <span>5-CHANNEL VITAL SIGN VECTOR</span> | |
| <span>ZERO-MALLOC C99 ABI</span> | |
| <span>SHAP TREE ATTRIBUTION</span> | |
| </div> | |
| </section> | |
| </main> | |
| ); | |
| } | |