Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| f7b529b1bd | |||
| a2d02607a7 | |||
| cf7b3ea6ac | |||
| f1529c70b9 | |||
| 2a9e6066c7 | |||
| ecc39745d7 | |||
| 1d841fc1dd | |||
| 416eb14d4e |
@@ -6,6 +6,8 @@
|
|||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "astro dev",
|
"dev": "astro dev",
|
||||||
"build": "astro build",
|
"build": "astro build",
|
||||||
|
"build:test": "PUBLIC_APP_ENV_LABEL=测试环境 astro build",
|
||||||
|
"build:prod": "PUBLIC_APP_ENV_LABEL=生产环境 astro build",
|
||||||
"preview": "astro preview"
|
"preview": "astro preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
|||||||
+190
-25
@@ -3,7 +3,8 @@ export const resume = {
|
|||||||
alias: "湛兮",
|
alias: "湛兮",
|
||||||
title: "前端开发工程师",
|
title: "前端开发工程师",
|
||||||
intent: "求职意向:前端开发工程师",
|
intent: "求职意向:前端开发工程师",
|
||||||
profile: "7 年前端与跨端开发经验,长期负责 Web、App、H5、小程序与管理后台的架构设计、工程化建设和核心业务交付。熟悉 AI 产品工程、SSE 流式通信、Next.js/Vue/React Native 跨端体系、微前端和 Monorepo 协作模式。",
|
profile:
|
||||||
|
"7 年前端与跨端开发经验,长期负责 Web、App、H5、小程序与管理后台的架构设计、工程化建设和核心业务交付。熟悉 AI 产品工程、SSE 流式通信、Next.js/Vue/React Native 跨端体系、微前端和 Monorepo 协作模式。",
|
||||||
basics: [
|
basics: [
|
||||||
{ label: "工作经验", value: "7 年" },
|
{ label: "工作经验", value: "7 年" },
|
||||||
{ label: "技术管理", value: "2+ 年" },
|
{ label: "技术管理", value: "2+ 年" },
|
||||||
@@ -33,27 +34,69 @@ export const resume = {
|
|||||||
skills: [
|
skills: [
|
||||||
{
|
{
|
||||||
group: "前端框架",
|
group: "前端框架",
|
||||||
items: ["Next.js 16", "React 19", "Vue 3", "TypeScript 5", "Tailwind CSS 4", "Nuxt/SSR"],
|
items: [
|
||||||
|
"Next.js 16",
|
||||||
|
"React 19",
|
||||||
|
"Vue 3",
|
||||||
|
"TypeScript 5",
|
||||||
|
"Tailwind CSS 4",
|
||||||
|
"Nuxt/SSR",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "跨端开发",
|
group: "跨端开发",
|
||||||
items: ["React Native 0.79", "Expo 53", "UniApp", "H5", "微信/飞书小程序"],
|
items: [
|
||||||
|
"React Native 0.79",
|
||||||
|
"Expo 53",
|
||||||
|
"UniApp",
|
||||||
|
"H5",
|
||||||
|
"微信/飞书小程序",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "AI 与通信",
|
group: "AI 与通信",
|
||||||
items: ["Vercel AI SDK v6", "SSE 流式通信", "多 Agent 协作", "Markdown/LaTeX 渲染", "AI 对话", "AI 生图/生视频"],
|
items: [
|
||||||
|
"Vercel AI SDK v6",
|
||||||
|
"SSE 流式通信",
|
||||||
|
"多 Agent 协作",
|
||||||
|
"Markdown/LaTeX 渲染",
|
||||||
|
"AI 对话",
|
||||||
|
"AI 生图/生视频",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "工程化",
|
group: "工程化",
|
||||||
items: ["pnpm Monorepo", "Git Submodules", "Qiankun", "Lerna", "Git Flow", "Playwright"],
|
items: [
|
||||||
|
"pnpm Monorepo",
|
||||||
|
"Git Submodules",
|
||||||
|
"Qiankun",
|
||||||
|
"Lerna",
|
||||||
|
"Git Flow",
|
||||||
|
"Playwright",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "状态与 UI",
|
group: "状态与 UI",
|
||||||
items: ["Zustand", "MobX", "Pinia", "Radix UI", "Ant Design", "Element Plus", "ProComponents"],
|
items: [
|
||||||
|
"Zustand",
|
||||||
|
"MobX",
|
||||||
|
"Pinia",
|
||||||
|
"Radix UI",
|
||||||
|
"Ant Design",
|
||||||
|
"Element Plus",
|
||||||
|
"ProComponents",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "基础设施",
|
group: "基础设施",
|
||||||
items: ["Alova", "next-intl", "i18next", "ARMS 监控", "CDN 优化", "Adyen 支付"],
|
items: [
|
||||||
|
"Alova",
|
||||||
|
"next-intl",
|
||||||
|
"i18next",
|
||||||
|
"ARMS 监控",
|
||||||
|
"CDN 优化",
|
||||||
|
"Adyen 支付",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
experiences: [
|
experiences: [
|
||||||
@@ -94,8 +137,19 @@ export const resume = {
|
|||||||
name: "SeaCloud / Vtrix",
|
name: "SeaCloud / Vtrix",
|
||||||
subtitle: "AI 模型服务平台(Web 端)",
|
subtitle: "AI 模型服务平台(Web 端)",
|
||||||
period: "2025.09 - 至今",
|
period: "2025.09 - 至今",
|
||||||
tech: ["Next.js 16", "React 19", "TypeScript", "Tailwind CSS", "Zustand", "Alova", "Vercel AI SDK", "Radix UI", "next-intl"],
|
tech: [
|
||||||
summary: "面向全球用户的 AI 模型聚合服务平台,聚合 LLM、图像、视频、音频、3D 等多模态模型能力,覆盖 C 端调用与 B 端组织/分销管理。",
|
"Next.js 16",
|
||||||
|
"React 19",
|
||||||
|
"TypeScript",
|
||||||
|
"Tailwind CSS",
|
||||||
|
"Zustand",
|
||||||
|
"Alova",
|
||||||
|
"Vercel AI SDK",
|
||||||
|
"Radix UI",
|
||||||
|
"next-intl",
|
||||||
|
],
|
||||||
|
summary:
|
||||||
|
"面向全球用户的 AI 模型聚合服务平台,聚合 LLM、图像、视频、音频、3D 等多模态模型能力,覆盖 C 端调用与 B 端组织/分销管理。",
|
||||||
modules: [
|
modules: [
|
||||||
"分销商客户邀请、折扣模板、额度分配、销售配置与利润率计算。",
|
"分销商客户邀请、折扣模板、额度分配、销售配置与利润率计算。",
|
||||||
"多币种与汇率体系,封装 useCurrency Hook 并贯穿 Pricing、Billing、API Keys 等模块。",
|
"多币种与汇率体系,封装 useCurrency Hook 并贯穿 Pricing、Billing、API Keys 等模块。",
|
||||||
@@ -108,8 +162,19 @@ export const resume = {
|
|||||||
name: "SeaBuzz",
|
name: "SeaBuzz",
|
||||||
subtitle: "AI 智能资讯与对话平台",
|
subtitle: "AI 智能资讯与对话平台",
|
||||||
period: "2025.05 - 至今",
|
period: "2025.05 - 至今",
|
||||||
tech: ["React Native", "Expo 53", "Expo Router", "Zustand", "NativeWind", "SSE", "i18next", "Adyen", "Lerna"],
|
tech: [
|
||||||
summary: "海艺 AI 旗下 AI 新闻聚合、智能搜索与多模态对话平台,基于 Expo 实现 iOS、Android、Web 三端统一开发。",
|
"React Native",
|
||||||
|
"Expo 53",
|
||||||
|
"Expo Router",
|
||||||
|
"Zustand",
|
||||||
|
"NativeWind",
|
||||||
|
"SSE",
|
||||||
|
"i18next",
|
||||||
|
"Adyen",
|
||||||
|
"Lerna",
|
||||||
|
],
|
||||||
|
summary:
|
||||||
|
"海艺 AI 旗下 AI 新闻聚合、智能搜索与多模态对话平台,基于 Expo 实现 iOS、Android、Web 三端统一开发。",
|
||||||
modules: [
|
modules: [
|
||||||
"AI Agent 对话完整链路:SSE 流式聊天、打字机渲染、Markdown/LaTeX、思考动画、来源引用与历史同步。",
|
"AI Agent 对话完整链路:SSE 流式聊天、打字机渲染、Markdown/LaTeX、思考动画、来源引用与历史同步。",
|
||||||
"Discover 发现页与新闻详情,支持瀑布流、大/小卡动态布局、骨架屏与 Smart Image。",
|
"Discover 发现页与新闻详情,支持瀑布流、大/小卡动态布局、骨架屏与 Smart Image。",
|
||||||
@@ -122,8 +187,18 @@ export const resume = {
|
|||||||
name: "霸王功夫",
|
name: "霸王功夫",
|
||||||
subtitle: "门店数字化与供应链管理平台",
|
subtitle: "门店数字化与供应链管理平台",
|
||||||
period: "2024.03 - 2025.03",
|
period: "2024.03 - 2025.03",
|
||||||
tech: ["React 18", "Vue 3", "UniApp", "MobX", "Pinia", "Element Plus", "Ant Design", "ProComponents"],
|
tech: [
|
||||||
summary: "服务全球 6000+ 门店及运营伙伴的数字化管理平台,覆盖门店运营、食品安全、供应链协同等核心业务。",
|
"React 18",
|
||||||
|
"Vue 3",
|
||||||
|
"UniApp",
|
||||||
|
"MobX",
|
||||||
|
"Pinia",
|
||||||
|
"Element Plus",
|
||||||
|
"Ant Design",
|
||||||
|
"ProComponents",
|
||||||
|
],
|
||||||
|
summary:
|
||||||
|
"服务全球 6000+ 门店及运营伙伴的数字化管理平台,覆盖门店运营、食品安全、供应链协同等核心业务。",
|
||||||
modules: [
|
modules: [
|
||||||
"小程序报损模块:摄像头扫码、在线报损登记,兼容微信小程序与飞书 H5。",
|
"小程序报损模块:摄像头扫码、在线报损登记,兼容微信小程序与飞书 H5。",
|
||||||
"食安管理模块:低频蓝牙连接 TSPL 指令集打印机,支持国内、东南亚、北美三套业务逻辑。",
|
"食安管理模块:低频蓝牙连接 TSPL 指令集打印机,支持国内、东南亚、北美三套业务逻辑。",
|
||||||
@@ -136,8 +211,18 @@ export const resume = {
|
|||||||
name: "经营帮平台 + 经营帮拉新",
|
name: "经营帮平台 + 经营帮拉新",
|
||||||
subtitle: "工业互联网与微前端平台",
|
subtitle: "工业互联网与微前端平台",
|
||||||
period: "2022.04 - 2024.03",
|
period: "2022.04 - 2024.03",
|
||||||
tech: ["Vue", "Qiankun", "Element UI", "华为云 OBS", "百度地图", "高德地图", "IM", "UniApp"],
|
tech: [
|
||||||
summary: "基于信息化设计理念和区块链技术的工业互联网平台,为企业和个人提供数字化运营服务。",
|
"Vue",
|
||||||
|
"Qiankun",
|
||||||
|
"Element UI",
|
||||||
|
"华为云 OBS",
|
||||||
|
"百度地图",
|
||||||
|
"高德地图",
|
||||||
|
"IM",
|
||||||
|
"UniApp",
|
||||||
|
],
|
||||||
|
summary:
|
||||||
|
"基于信息化设计理念和区块链技术的工业互联网平台,为企业和个人提供数字化运营服务。",
|
||||||
modules: [
|
modules: [
|
||||||
"参与单体前端到 Qiankun 微前端拆分,拆分出 12 个基础项目。",
|
"参与单体前端到 Qiankun 微前端拆分,拆分出 12 个基础项目。",
|
||||||
"负责商管、门户、经营帮系列小程序/H5/Admin 后台核心业务交付。",
|
"负责商管、门户、经营帮系列小程序/H5/Admin 后台核心业务交付。",
|
||||||
@@ -190,27 +275,69 @@ export const resumeEn = {
|
|||||||
skills: [
|
skills: [
|
||||||
{
|
{
|
||||||
group: "Frontend Frameworks",
|
group: "Frontend Frameworks",
|
||||||
items: ["Next.js 16", "React 19", "Vue 3", "TypeScript 5", "Tailwind CSS 4", "Nuxt/SSR"],
|
items: [
|
||||||
|
"Next.js 16",
|
||||||
|
"React 19",
|
||||||
|
"Vue 3",
|
||||||
|
"TypeScript 5",
|
||||||
|
"Tailwind CSS 4",
|
||||||
|
"Nuxt/SSR",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "Cross-platform",
|
group: "Cross-platform",
|
||||||
items: ["React Native 0.79", "Expo 53", "UniApp", "H5", "WeChat/Lark Mini Programs"],
|
items: [
|
||||||
|
"React Native 0.79",
|
||||||
|
"Expo 53",
|
||||||
|
"UniApp",
|
||||||
|
"H5",
|
||||||
|
"WeChat/Lark Mini Programs",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "AI & Streaming",
|
group: "AI & Streaming",
|
||||||
items: ["Vercel AI SDK v6", "SSE Streaming", "Multi-Agent Collaboration", "Markdown/LaTeX", "AI Chat", "AI Image/Video"],
|
items: [
|
||||||
|
"Vercel AI SDK v6",
|
||||||
|
"SSE Streaming",
|
||||||
|
"Multi-Agent Collaboration",
|
||||||
|
"Markdown/LaTeX",
|
||||||
|
"AI Chat",
|
||||||
|
"AI Image/Video",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "Engineering",
|
group: "Engineering",
|
||||||
items: ["pnpm Monorepo", "Git Submodules", "Qiankun", "Lerna", "Git Flow", "Playwright"],
|
items: [
|
||||||
|
"pnpm Monorepo",
|
||||||
|
"Git Submodules",
|
||||||
|
"Qiankun",
|
||||||
|
"Lerna",
|
||||||
|
"Git Flow",
|
||||||
|
"Playwright",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "State & UI",
|
group: "State & UI",
|
||||||
items: ["Zustand", "MobX", "Pinia", "Radix UI", "Ant Design", "Element Plus", "ProComponents"],
|
items: [
|
||||||
|
"Zustand",
|
||||||
|
"MobX",
|
||||||
|
"Pinia",
|
||||||
|
"Radix UI",
|
||||||
|
"Ant Design",
|
||||||
|
"Element Plus",
|
||||||
|
"ProComponents",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
group: "Infrastructure",
|
group: "Infrastructure",
|
||||||
items: ["Alova", "next-intl", "i18next", "ARMS Monitoring", "CDN Optimization", "Adyen Payments"],
|
items: [
|
||||||
|
"Alova",
|
||||||
|
"next-intl",
|
||||||
|
"i18next",
|
||||||
|
"ARMS Monitoring",
|
||||||
|
"CDN Optimization",
|
||||||
|
"Adyen Payments",
|
||||||
|
],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
experiences: [
|
experiences: [
|
||||||
@@ -251,7 +378,17 @@ export const resumeEn = {
|
|||||||
name: "SeaCloud / Vtrix",
|
name: "SeaCloud / Vtrix",
|
||||||
subtitle: "AI Model Service Platform (Web)",
|
subtitle: "AI Model Service Platform (Web)",
|
||||||
period: "2025.09 - Present",
|
period: "2025.09 - Present",
|
||||||
tech: ["Next.js 16", "React 19", "TypeScript", "Tailwind CSS", "Zustand", "Alova", "Vercel AI SDK", "Radix UI", "next-intl"],
|
tech: [
|
||||||
|
"Next.js 16",
|
||||||
|
"React 19",
|
||||||
|
"TypeScript",
|
||||||
|
"Tailwind CSS",
|
||||||
|
"Zustand",
|
||||||
|
"Alova",
|
||||||
|
"Vercel AI SDK",
|
||||||
|
"Radix UI",
|
||||||
|
"next-intl",
|
||||||
|
],
|
||||||
summary:
|
summary:
|
||||||
"A global AI model aggregation platform covering LLM, image, video, audio and 3D model capabilities for developers, organizations and distributors.",
|
"A global AI model aggregation platform covering LLM, image, video, audio and 3D model capabilities for developers, organizations and distributors.",
|
||||||
modules: [
|
modules: [
|
||||||
@@ -266,7 +403,17 @@ export const resumeEn = {
|
|||||||
name: "SeaBuzz",
|
name: "SeaBuzz",
|
||||||
subtitle: "AI News and Conversation Platform",
|
subtitle: "AI News and Conversation Platform",
|
||||||
period: "2025.05 - Present",
|
period: "2025.05 - Present",
|
||||||
tech: ["React Native", "Expo 53", "Expo Router", "Zustand", "NativeWind", "SSE", "i18next", "Adyen", "Lerna"],
|
tech: [
|
||||||
|
"React Native",
|
||||||
|
"Expo 53",
|
||||||
|
"Expo Router",
|
||||||
|
"Zustand",
|
||||||
|
"NativeWind",
|
||||||
|
"SSE",
|
||||||
|
"i18next",
|
||||||
|
"Adyen",
|
||||||
|
"Lerna",
|
||||||
|
],
|
||||||
summary:
|
summary:
|
||||||
"An AI-powered news aggregation, smart search and multimodal conversation platform under SeaArt AI, built with Expo for iOS, Android and Web.",
|
"An AI-powered news aggregation, smart search and multimodal conversation platform under SeaArt AI, built with Expo for iOS, Android and Web.",
|
||||||
modules: [
|
modules: [
|
||||||
@@ -281,7 +428,16 @@ export const resumeEn = {
|
|||||||
name: "Bawang Kungfu",
|
name: "Bawang Kungfu",
|
||||||
subtitle: "Store Digitization and Supply Chain Platform",
|
subtitle: "Store Digitization and Supply Chain Platform",
|
||||||
period: "2024.03 - 2025.03",
|
period: "2024.03 - 2025.03",
|
||||||
tech: ["React 18", "Vue 3", "UniApp", "MobX", "Pinia", "Element Plus", "Ant Design", "ProComponents"],
|
tech: [
|
||||||
|
"React 18",
|
||||||
|
"Vue 3",
|
||||||
|
"UniApp",
|
||||||
|
"MobX",
|
||||||
|
"Pinia",
|
||||||
|
"Element Plus",
|
||||||
|
"Ant Design",
|
||||||
|
"ProComponents",
|
||||||
|
],
|
||||||
summary:
|
summary:
|
||||||
"A digital operations platform serving 6,000+ stores and partners, covering store operations, food safety and supply-chain collaboration.",
|
"A digital operations platform serving 6,000+ stores and partners, covering store operations, food safety and supply-chain collaboration.",
|
||||||
modules: [
|
modules: [
|
||||||
@@ -296,7 +452,16 @@ export const resumeEn = {
|
|||||||
name: "Jingyingbang Platform",
|
name: "Jingyingbang Platform",
|
||||||
subtitle: "Industrial Internet and Micro-frontend Platform",
|
subtitle: "Industrial Internet and Micro-frontend Platform",
|
||||||
period: "2022.04 - 2024.03",
|
period: "2022.04 - 2024.03",
|
||||||
tech: ["Vue", "Qiankun", "Element UI", "Huawei Cloud OBS", "Baidu Map", "Amap", "IM", "UniApp"],
|
tech: [
|
||||||
|
"Vue",
|
||||||
|
"Qiankun",
|
||||||
|
"Element UI",
|
||||||
|
"Huawei Cloud OBS",
|
||||||
|
"Baidu Map",
|
||||||
|
"Amap",
|
||||||
|
"IM",
|
||||||
|
"UniApp",
|
||||||
|
],
|
||||||
summary:
|
summary:
|
||||||
"An industrial internet platform based on informatization and blockchain concepts, providing digital operation services for companies and individuals.",
|
"An industrial internet platform based on informatization and blockchain concepts, providing digital operation services for companies and individuals.",
|
||||||
modules: [
|
modules: [
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import { resume, resumeEn } from "../data/resume";
|
|||||||
import "../styles/global.css";
|
import "../styles/global.css";
|
||||||
|
|
||||||
const githubUrl = "https://github.com/zhanBoss";
|
const githubUrl = "https://github.com/zhanBoss";
|
||||||
|
const appEnvLabel = import.meta.env.PUBLIC_APP_ENV_LABEL || "生产环境";
|
||||||
const translations = { zh: resume, en: resumeEn };
|
const translations = { zh: resume, en: resumeEn };
|
||||||
const navIds = ["top", "proof", "skills", "projects", "experience", "contact"];
|
const navIds = ["top", "proof", "skills", "projects", "experience", "contact"];
|
||||||
const brandAssets = {
|
const brandAssets = {
|
||||||
@@ -143,6 +144,7 @@ const projectLogoFor = (id: string) => brandAssets.projects[id] ?? null;
|
|||||||
<body>
|
<body>
|
||||||
<div class="scroll-progress" id="scroll-progress"></div>
|
<div class="scroll-progress" id="scroll-progress"></div>
|
||||||
<canvas class="ambient-canvas" id="ambient-canvas" aria-hidden="true"></canvas>
|
<canvas class="ambient-canvas" id="ambient-canvas" aria-hidden="true"></canvas>
|
||||||
|
<div class="environment-badge" aria-label={`当前环境:${appEnvLabel}`}>{appEnvLabel}</div>
|
||||||
|
|
||||||
<header class="topbar">
|
<header class="topbar">
|
||||||
<a class="brand" href="#top" aria-label={`${displayNameFor(resume)} 简历首页`}>
|
<a class="brand" href="#top" aria-label={`${displayNameFor(resume)} 简历首页`}>
|
||||||
|
|||||||
@@ -101,6 +101,22 @@ a {
|
|||||||
background: linear-gradient(90deg, var(--green), var(--blue), var(--amber));
|
background: linear-gradient(90deg, var(--green), var(--blue), var(--amber));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.environment-badge {
|
||||||
|
position: fixed;
|
||||||
|
top: 72px;
|
||||||
|
right: 16px;
|
||||||
|
z-index: 61;
|
||||||
|
padding: 8px 10px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 750;
|
||||||
|
line-height: 1;
|
||||||
|
letter-spacing: 0;
|
||||||
|
background: rgba(20, 20, 24, 0.86);
|
||||||
|
border-radius: 999px;
|
||||||
|
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
|
||||||
|
}
|
||||||
|
|
||||||
.ambient-canvas {
|
.ambient-canvas {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
inset: 0;
|
inset: 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user