个人作品集 · 2026

金俊宇.

我做网页和小应用,从交互、数据结构到部署上线都自己动手。这里放着四个近期作品:有能直接玩的游戏,也有解决真实使用场景的全栈工具。

城市
上海
作品
4 个

精选作品

从课程管理到浏览器游戏,都是完整做过、能说清背后取舍的项目。每个作品都保留了截图、源码或可直接体验的入口。

折线冲刺游戏的主菜单截图

折线冲刺 可直接玩

零依赖 Canvas 跑酷游戏。按住上升、松开下降,包含三段经典航线、无尽模式、时缓、触屏操作与本地存档。

  • Canvas 2D
  • Game Loop
  • 移动端
课程表与作业提醒应用的课表界面截图

课程表与作业提醒 跨设备同步

登录后可在线管理课表与作业,数据保存在服务器数据库中,在电脑和手机之间实时同步。

  • Node.js
  • SQLite
  • PWA
任务清单 Demo 的界面截图

任务清单 交互演示

原生 JavaScript 写的任务管理:添加、勾选、筛选、删除,数据存在浏览器本地,刷新不丢。

  • JavaScript
  • localStorage
  • 无障碍
个人作品集站点首页截图

个人作品集站点

这套站点本身也由我手写完成:零依赖、零构建,兼顾手机布局、键盘操作和静态部署。

  • HTML
  • CSS Grid
  • GitHub Pages

能力

不堆名词,只写我在这些作品里真正用过的技术。

前端与交互

  • 语义化 HTML 与可访问性
  • Flex / Grid 响应式布局
  • 原生 JavaScript 与 DOM
  • Canvas 2D 与游戏循环

后端与部署

  • Node.js / Express REST API
  • SQLite / PostgreSQL 数据建模
  • 登录会话与密码哈希
  • GitHub Pages / Vercel 部署

开发方式

  • 从需求拆解到可用界面
  • 桌面与移动端适配
  • DevTools 调试与功能验证
  • Git 版本管理与协作流程

聊聊?

项目都在 GitHub 上,欢迎来看代码;也欢迎直接发邮件聊聊。