Hi,我是超然 🔭
资深全栈工程师 / AWS 解决方案架构师
CS

About

常驻北京,从事 Web 开发 13 年,经历过多个从 0 到 1 的系统构建,也经历过老系统的架构重构与性能优化。

工作中我关注的不只是技术是否先进,而是它能否真正服务产品逻辑,提升体验与效率。很多时候,我更愿意作为一个「构建者」去理解问题 —— 从系统架构,到前端交互,到运维与协作流程,都是我关心的环节。

这个站点记录了我职业生涯的一些轨迹,也整理了过程中沉淀的一些思考与工具。它既是我的数字履历,也是一个开放的实验场,持续更新。

除了工作之外,我也喜欢做一些不那么「有用」的事情:深空摄影让我保持对未知的好奇,飞盘和国际象棋让我享受思维与身体的平衡,而主机游戏,是我在另一个世界的探险方式。它们不直接「产出价值」,但丰富了我看世界的方式。

如果你也关心技术、人和系统之间的关系,或者单纯想聊聊器材、游戏、宇宙和创造,欢迎与我交流。

Work Experience

美餐网(北京)E 轮

2016.1 - 至今
核心开发工程师
作为团队中前期加入的工程师,我与美餐共同成长,主要负责多个核心系统的持续开发和后续维护。期间牵头建立前端工程体系(组件化、代码规范、通用模块),完善协作流程并提高交付质量。通过定期技术分享与代码评审,支持团队能力提升,助力工程文化落地。长期在公司中承担前端技术牵头职责,是团队的重要成员。

云巴科技(深圳)

2014.9 - 2015.12
Web 开发工程师
参与公司核心推送平台的开发与运维,确保海量设备间的低延迟、稳定通信。深入参与消息分发机制的设计与调试,系统性掌握 MQTT 协议,提升平台的可靠性与性能。 独立开发公司官网、设备管理系统及面向 Web 应用的 JavaScript 推送 SDK,支持主流浏览器与前端框架集成。技术栈涵盖 Node.js 全栈开发、MongoDB、Redis、MQTT 和 Erlang 等。 同时编写 Ansible 脚本,构建自动化部署流程,提升核心服务的可维护性与上线效率。通过对业务全链路的深度参与,为平台的稳定运行与前端接入体验做出关键贡献。
M

MicroAd(日本)

2013.7 - 2014.8
Web 开发工程师
参与国际化 DSP 广告管理系统的开发,支持多语言界面与跨区域广告投放。使用 Java + Spring + Struts + Hibernate(SSH)构建后台服务,基于 MySQL 设计广告投放与报表数据模型。 前端初期采用 ActionScript3 开发富客户端界面,后期参与系统前端重构,迁移至 JavaScript + Dojo 技术栈。以模块为单位,独立完成前后端全链路开发任务。 编写技术设计与测试文档,参与功能评审与测试支持工作,保障产品交付质量与开发流程规范化。

Skills

Main Projects

主要项目

我开发过的各类项目。

美餐 AI

Creative Studio
Creative Studio

正在建设面向美餐内部的 AI 图片创作工作台,重点服务运营素材、活动视觉和产品创意验证。它把创意需求、参考素材、生成结果和后续版本串在同一张画布上,让每次尝试都有上下文、可回溯、可复用。支持参考图上传、以图生图、不同生成方案对比、生成耗时与成本展示、素材库、提示词库,以及项目分享和导入,方便团队把有效的创作方法沉淀下来。

React 19Vite 8TypeScriptReact FlowZustandIndexedDBRadix UITailwind CSS 4LLM GatewayS3
LLM Gateway
LLM Gateway

基于 LiteLLM 构建 LLM Gateway,统一接入多家行业领先的大模型,提供 OpenAI 与 Anthropic 接口兼容能力,显著降低接入门槛,提升团队研发效率与内容生产力。同时支持多模型调用监控与计费统计,帮助运维团队精细化管理使用成本、优化资源配置。

LiteLLMPythonAnsibleOpenAIDeepSeekAnthropic ClaudeAWS Bedrock
Meican ChatGPT
Meican ChatGPT

基于 NextChat 进行二次开发,打造超轻量级 AI 聊天 PWA,支持多模态交互,内置丰富实用的 Prompt,支持上传多种格式的文件(如图片、PDF、Office 文档等),提升对话上下文理解能力与使用便捷性,适用于多场景智能问答与内容生成。

NextChatReactLambda ProxyStreamingAnthropic ClaudeGitLab PagesPWA

美餐商户

商户终端 MCT 5

MCT5 是对旧有商户系统的一次全面升级与架构重构,面向外卖与堂食等多业务场景,提供餐品库管理、排餐营业、菜单配置、订单处理、账单结算等核心功能。系统还集成美餐自研的智能打印机,支持更美观的订单打印样式与设备远程管理,全面提升门店运转效率。

TypeScriptReactReduxMobXI18nElectronLibUSBHybridArgo CD
商户终端 MCT 4

早期门店运营系统,支持嘀卡消费、扫码支付、订单与账单管理,以及传统与智能标签打印。覆盖基本的门店运营功能,支持离线消费与弱网环境下使用,为后续 MCT5 升级奠定基础。

JavaScriptReactReduxImmutable.jsI18nIndexedDBHybridCypressServerlessChrome Packaged AppInnoSetupChrome 49
经营管理系统 Serv

面向食堂场景的综合后台管理系统,覆盖餐品配置、档口管理、营业设置、订单与销售数据分析等核心功能。支持多角色协作与权限控制,帮助运营方高效管理食堂日常经营,实现数字化运营与精细化管理。

TypeScriptReactReduxMobXHybirdCypressServerless
商户小程序 Paya

为商户提供随时随地管理门店的轻量级工具,支持订单管理、营业状态设置、商品上下架、报表查看等核心功能。界面简洁,操作便捷,适配多种经营场景,提升商户移动端运营效率,作为 MCT 系列系统的重要补充入口。

WeChat mini ProgramReactReduxTaroSCSS

美餐用户

美餐纵 Zone(PWA & 小程序)

面向用户的食堂点餐平台,支持浏览菜单、在线下单、取餐提醒等功能,覆盖 PWA 与微信小程序双端形态。适配多种用餐场景,提升员工在企事业单位、园区食堂的点餐体验与效率,是美餐团餐业务的重要用户入口。

TypeScriptReactReduxTaroImmutable.jsI18nIndexedDBWebpackHybirdCypressServerless
用户点餐系统 v4(Web & 小程序)

全新重构的用户侧点餐系统,提供更流畅的点餐流程与丰富的交互体验。系统接入了美餐海量高清餐品图片资源,界面设计全面升级,视觉精美、动效细腻,显著提升用户的浏览与点餐体验,全面服务于团餐场景下的高效用餐需求。

TypeScriptReactReduxTaroGraphQLI18nWebpackHybird

美餐医院 HIS

医院点餐管理系统

为医院场景提供的送餐地址管理平台,通过为每个床位生成并绑定唯一二维码,实现扫码点餐、精准送餐到床。系统支持多级地址管理、二维码绑定与查询、医院选择与账号登录等功能,提升医院内部订餐流程的效率与准确性。

Next.jsTailwindCSSShadcn UIServerlessDockerGitLab CI

美餐行星 Planet

行星系统(Planet)
行星系统(Planet)

美餐行星是美餐所有前台项目的后台管理系统,全面涵盖了客户、餐别、商户、员工餐厅、订单、手工记账、事故处理等模块的综合管理。作为美餐极其重要的内部应用,行星负责无食堂系统、食堂系统和 Paperwork 等相关设置的后台搭建、配置和运营,为整个美餐生态系统提供了强有力的支持和保障。

ReactTypeScriptSCSSWebpack
考勤餐补系统
考勤餐补系统

为企业提供考勤与餐补联动管理的系统解决方案,支持员工打卡记录与餐补发放策略配置。员工需完成考勤打卡后方可获得对应餐点补贴,并在美餐平台内消费使用。系统有效提升企业用餐补贴的合规性与精准性,广泛应用于园区、工厂等集中用餐场景。

ReactTypeScriptSCSSWebpack

美餐活动 Events

活动餐 Events
活动餐 Events

美餐活动餐官网

科技赋能
科技赋能

美餐员工餐厅,科技赋能产品介绍网站

美餐招聘
美餐招聘

美餐产研招聘网页

美餐基建 Infra

LogClick 日志检索平台
LogClick 日志检索平台

面向美餐内部研发与运维场景构建的日志检索与可视化平台,统一接入 ClickHouse 实时日志与 S3 归档日志,支持关键词搜索、字段过滤、时间范围查询、趋势图分析、字段选择与虚拟滚动表格。平台提供书签保存与恢复、短链分享、Tracing 跳转和 Rison URL 构建工具,帮助团队快速定位线上问题、复盘历史日志并沉淀常用排障查询。

Next.js 16React 19Tailwind CSS 4TanStack QueryTanStack VirtualRechartsZustandClickHouseS3Rison
IoT 设备中心 & 设备网关
IoT 设备中心 & 设备网关

构建统一的 IoT 设备接入与管理平台,支持设备注册、状态监控、远程指令下发等核心能力。通过设备网关实现多协议接入与消息转发,保障设备通信的实时性与稳定性。系统广泛应用于智能硬件与线下终端场景,提升设备运维效率与数据可视化能力。

Node.js v20AWS IoT CoreMQTT over WebSocketCognitoServerless Framework
API Gateway - GraphQL
API Gateway - GraphQL

构建统一的 GraphQL 网关,聚合多个后端服务接口,提供灵活、高性能的数据查询能力。支持字段级权限控制与请求优化,简化前后端协作流程,提升客户端开发效率与响应性能,是构建现代 BFF 架构的核心组件。

GraphQLNestJSAWS EKSArgo CDRedis
后台系统组件库
后台系统组件库

面向企业内部管理系统打造的统一组件库,覆盖表单、表格、弹窗、图表等高频后台功能模块,支持主题配置与多项目复用。提升前端开发效率与界面一致性,支撑多个业务系统的快速搭建与迭代。

ReactTypeScriptStorybookpnpmMonorepoFigma
Side Projects

业余项目

利用业余时间探索新技术并构建有趣的项目。

DotDeck
DotDeck

面向个人配置文件管理的 macOS 桌面工具,帮助把终端、编辑器和系统偏好等散落配置统一整理到一个清晰的控制台里。它提供首次使用向导、常见配置扫描、敏感路径风险提示、变更预览、操作日志、配置同步和回滚能力,让日常环境迁移、备份和维护更可控,也减少误改重要文件的风险。

SwiftUISwift 6macOS AppchezmoiLiquid GlassSwift TestingSnapshot Testingi18nXcodeGit
One Menu
One Menu

面向个人日常使用的 macOS 菜单栏效率工具,把常用系统开关和轻量剪贴板放进一个随手可用的入口。支持一键防息屏、静音、切换深色模式、显示隐藏文件、锁屏和键盘清洁,也能快速找回最近复制过的几条文本。键盘清洁模式带有强制退出兜底,避免误触后影响正常使用。

SwiftUISwift 6macOS AppMenuBarExtraLiquid GlassAppKitNSPasteboardCoreAudioAppleScriptSF Symbols
SnapMind
SnapMind

截图即收藏的个人知识库自动化项目:后端接收手机或桌面截图,通过 VLM 完成平台识别与内容抽取,再结合 opencli、网页抓取、搜索引擎和截图兜底获取原文,最后由 LLM 生成摘要、标签与分类,写入 Obsidian-style Markdown Vault。项目采用 open core 模式,提供可自托管的 Fastify API,并配套 iOS / macOS 客户端连接同一套接口。

Node.js v24TypeScriptFastifyOpenAI SDKVLMObsidianMarkdownPlaywrightSharpSwiftUI
Fomo3D(DApp)
Fomo3D(DApp)

基于以太坊智能合约构建的去中心化游戏应用(DApp),通过合约驱动奖池机制与倒计时规则,实现公开透明的博弈玩法。前端采用响应式设计,兼容多终端访问,并集成 Web3 钱包交互,支持用户参与、交易记录查询等核心功能,完整实现链上闭环体验。

ReactWeb3.jsDApp以太坊智能合约
PrecisFei 资产管理系统
PrecisFei 资产管理系统

为高定服装品牌定制开发的内部资产管理系统,覆盖面料、辅料、款式样衣等核心资产的全流程管理。支持库存追踪、分类归档、出入库记录与采购管理,提升设计与生产协作效率,实现资产数字化、可视化管理,助力高端定制流程标准化与精细化运营。

Next.jsTailwindCSSShadcnServerless DockerDynamoDBAWS
Interests

兴趣爱好

工作之外我的一些兴趣爱好。

游戏
游戏
主机游戏 & 国际象棋爱好者
运动
运动
业余飞盘教练,每周组织飞盘活动
天文
天文
天文爱好者,热衷于深空摄影
My Interests
Contact

与我联系

想约杯咖啡吗?先加个微信!☕️

{}
The End
v1.2.0