我用 Next.js、Antigravity 和 Gemini AI 打造了一个赛博朋克终端作品集
Source: Dev.to
This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI
我是 Inusha Gunasekara,斯里兰卡莫拉图瓦大学的 IT 本科生,也是 Tekkeys 的联合创始人,我们正在构建具备自主性的 AI 工具。
在这次挑战中,我不想只做一个普通的“着陆页”。我想打造一个 数字孪生——一个基于终端的感知操作系统,用代码来呈现我的技能、项目和个性。目标是让界面充满活力,将 CLI 的原始实用性与赛博朋克 UI 的精致美感相结合。
我最初将系统设计为完全自主的克隆,使用 Gemini 2.5 Flash‑Lite API。为了保证 100 % 的可用性和对公众访问的零延迟,我转而使用确定性的 模拟模式。这种混合方案在保留感知“氛围”的同时,确保了生产级的可靠性。
Portfolio
(Type "help" to see available commands, or try "projects" to see what I'm working on.)
How I Built It
The Tech Stack
- Framework: Next.js 16 (App Router) – core React architecture.
- Styling: Tailwind CSS v4 – utility‑first, cyberpunk aesthetic.
- Infrastructure: Google Cloud Run (Serverless) – scalable, containerized deployment.
- Containerization: Docker (multi‑stage build) using the
standaloneoutput mode.
The “Digital Twin” Architecture
Initial Prototype
我首先使用 Gemini 2.5 Flash‑Lite API 构建了一个完全自主的代理。虽然功能强大,但计量 API 会带来延迟和配额风险(所谓的“Reddit Hug of Death”)。
Production Optimization
为了提供生产级体验,我创建了一个 确定性模拟引擎。它模拟 LLM 的流式“打字效果”,但从本地优化的知识图谱中获取数据。这样将感知的 API 延迟从约 400 ms 降至 < 5 ms,消除了运行成本,同时保留了终端的“感知”感受。
Deploying to Google Cloud Run
选择 Cloud Run 让我拥有了“零实例”伸缩能力。多阶段 Dockerfile 将最终容器大小缩小约 80 %,使得作品在请求时能够瞬间启动,空闲时费用为 $0。
What I’m Most Proud Of
1. The “Halt Sequence” (sudo delete)
sudo delete confirm
一个隐藏的“紧急关机开关”,会触发全系统的崩溃模拟——屏幕变黑并强制重启。它为作品增添了游戏化元素,鼓励用户探索界面的边界。
2. Engineering the “Simulation Engine”
我没有依赖实时的 Gemini API 连接,而是构建了一个确定性的模拟流,复制了 LLM 的精确打字模式和延迟。可靠性本身就是一种特性:该引擎消除了配额和网络延迟风险,同时保留了 AI 式的体验。
3. Secure Live Data (Gas Tracker)
我实现了一个实时的以太坊 Gas Tracker,从 Etherscan 获取实时数据。为确保 API 密钥安全,我创建了一个 Next.js 服务器端代理,在服务器上注入凭证后再转发请求。
4. The “Cyberpunk” Polish
在性能预算范围内微调视觉细节——故障效果、霓虹点缀以及响应式排版——是一项令人满意的前端优化挑战,尤其是在使用 Tailwind CSS v4 时。