你好，我是

Ranck.

> |

我是热爱技术与设计的 全栈工程师，专注于构建高性能、可维护的现代化应用——从界面到服务端。

查看我的作品联系我
dev.ts
const developer = {
  name: 'Ranck',
  skills: ['React', 'TypeScript'],
  passion: '构建出色的 Web 应用',
  hireable(): true,
};
向下滚动↓

01.关于我

你好！我是 Ranck，一名热爱技术与创造的全栈工程师。

我专注于构建高性能、可维护且用户体验优秀的 Web 应用。在工作中，我喜欢研究前沿的前后端技术与工程化实践，并将它们应用到实际项目中，持续提升开发效率与产品质量。

工作之外，我喜欢写技术博客、参与开源项目，并保持对新技术的好奇心。

  • ▹React / Next.js
  • ▹TypeScript
  • ▹Vue / Nuxt
  • ▹Node.js
  • ▹CSS / Tailwind
  • ▹Vite / Webpack
👨‍💻Ranck@fullstack

02.技能专长

⚛️React精通
🔷TypeScript精通
💚Vue 3熟练
🟢Node.js熟练
📘Next.js熟练
🎨Tailwind CSS精通
⚡Vite精通
📦Webpack熟练
🐳Docker了解
🗄️MySQL / PostgreSQL熟练
🌐GraphQL了解
🔄CI/CD熟练
🧪Jest / Vitest熟练
📱响应式设计精通

03.技术博客

查看全部文章 →

04.项目作品

📁

Stellar UI 组件库

基于 React + TypeScript 的现代化组件库，支持 Tree Shaking、完善的文档和 Storybook 演示。包含 30+ 组件。

ReactTypeScriptStorybookRollup
📁

低代码数据看板构建器

拖拽式数据看板构建器，支持自定义图表组件、数据源绑定和实时预览。使用 Vue 3 + Pinia 构建。

Vue 3PiniaEChartsGridStack
📁

实时协同编辑器

基于 CRDT 算法的实时协作编辑器，支持多人同时编辑、版本回溯和离线编辑同步。

ReactYjsWebSocketIndexedDB
📁

微前端平台

基于 Module Federation 的微前端平台，支持多团队独立开发部署、运行时集成和统一的状态管理。

ReactWebpack 5Single-SPAQiankun
📁

前端性能监控 SDK

前端性能监控 SDK，采集 Core Web Vitals、错误日志和用户行为数据，并提供可视化分析面板。

TypeScriptRollupNestJSClickHouse
📁

CLI 项目脚手架工具

前端项目脚手架 CLI 工具，支持多种模板选择和自定义配置，集成 ESLint、Prettier 和 Git Hooks。

Node.jsCommanderInquirerHandlebars
📁

Canvas 渲染 10 万节点树

生成 10 万条随机树形数据，用 d3-hierarchy 树布局 + Canvas 2D 渲染。每个节点包含头像、名称、爱好与一句话，支持缩放平移、节点聚焦与性能统计，展示大规模数据可视化方案。

D3.jsCanvasTypeScriptNext.js

05.联系我

对项目感兴趣或有合作意向？欢迎随时联系我，
我的邮箱通常会在 24 小时内回复。

0 / 1000