zgy/zhaoguiyang.site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(profile): centralize personal info in data module and update components

Browse Source 
Move all personal information to a centralized data module and update components to use this source. This improves maintainability by having a single source of truth for profile data and makes it easier to update information across the application.
This commit is contained in:
joyzhao
2025-06-19 11:00:39 +08:00
parent 5b6b9f5d58
commit 62df420d80
4 changed files with 77 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/AuthorCard.tsx
View File

@@ -1,4 +1,5 @@
import type { Lang } from '../i18n/utils'; import type { Lang } from '../i18n/utils';
import { personalInfo } from '@/lib/data';
interface AuthorCardProps { interface AuthorCardProps {
lang: Lang; lang: Lang;
@@ -14,17 +15,17 @@ interface AuthorCardProps {
} }
export default function AuthorCard({ lang, author }: AuthorCardProps) { export default function AuthorCard({ lang, author }: AuthorCardProps) {
// Default author info // Default author info based on personalInfo
const defaultAuthor = { const defaultAuthor = {
name: 'Zhao Guiyang', name: personalInfo.name,
bio: lang === 'zh' bio: lang === 'zh'
? '全栈开发者，专注于现代Web技术和用户体验设计。热爱分享技术见解和最佳实践。' ? personalInfo.description.zh
: 'Full-stack developer passionate about modern web technologies and user experience design. Love sharing technical insights and best practices.', : personalInfo.description.en,
avatar: 'https://avatars.githubusercontent.com/u/24975063?v=4', // You can replace with actual avatar avatar: personalInfo.avatar,
website: 'https://zhaoguiyang.com', website: personalInfo.website || 'https://zhaoguiyang.com',
github: 'https://github.com/zhaoguiyang', github: personalInfo.github,
twitter: 'https://twitter.com/zhaoguiyang', twitter: personalInfo.twitter || 'https://twitter.com/zhaoguiyang',
linkedin: 'https://linkedin.com/in/zhaoguiyang' linkedin: personalInfo.linkedin
}; };
const authorInfo = author || defaultAuthor; const authorInfo = author || defaultAuthor;

45
src/lib/data.ts
View File

@@ -1,10 +1,47 @@
export const personalInfo = { export const personalInfo = {
name: "Guiyang Zhao", name: "Joy Zhao",
location: "Shanghai, China", location: "China",
avatar: "/images/avatar.jpg", avatar: "https://avatars.githubusercontent.com/u/24975063?v=4",
email: "zhaoguiyang@gmail.com", email: "zhaoguiyang18@gmail.com",
github: "https://github.com/zhaoguiyang", github: "https://github.com/zhaoguiyang",
linkedin: "https://linkedin.com/in/zhaoguiyang", linkedin: "https://linkedin.com/in/zhaoguiyang",
website: "https://zhaoguiyang.com",
twitter: "https://twitter.com/zhaoguiyang",
position: {
en: "Full Stack Engineer",
zh: "全栈工程师"
},
description: {
en: "Crafting elegant solutions to complex problems with clean code and innovative thinking. Welcome to my personal dev workspace where ideas come to life.",
zh: "用优雅的代码和创新的思维，为复杂问题打造精致的解决方案。欢迎来到我的个人开发工作空间，这里是想法变为现实的地方。"
},
about: {
en: [
"I'm a passionate developer with 5+ years of experience building web applications and contributing to open source projects. I specialize in creating clean, efficient, and maintainable code.",
"When I'm not coding, you can find me exploring new technologies, writing tech articles, or enjoying a fresh cup of coffee while debugging complex problems.",
"I believe in continuous learning and staying up-to-date with the latest industry trends and best practices."
],
zh: [
"我是一名充满激情的全栈开发者，专注于构建现代化的Web应用程序。我热爱学习新技术，并将它们应用到实际项目中。",
"在前端开发方面，我精通React、Vue.js和现代JavaScript框架。在后端，我有丰富的Node.js、Python和Go语言开发经验。",
"我相信代码的力量可以改变世界，致力于编写干净、高效且可维护的代码。我也热衷于开源项目，喜欢与开发者社区分享知识和经验。"
]
},
stats: {
repositories: 152,
commits: "42K",
contributions: 87
},
skills: {
frontend: ["React", "Vue.js", "Angular", "HTML5", "CSS3", "JavaScript/TypeScript"],
backend: ["Node.js", "Express", "Django", "Flask", "Spring Boot"],
database: ["MongoDB", "PostgreSQL", "MySQL", "Redis"],
devops: ["Docker", "Kubernetes", "AWS", "Azure", "CI/CD pipelines"],
mobile: ["React Native", "Flutter"]
},
terminal: {
username: "joy@dev-workspace" // 更新终端用户名
}
}; };
export const projects = { export const projects = {

30
src/pages/index.astro
View File

@@ -35,17 +35,17 @@ const pageTitle = t('site.title');
<!-- Main title --> <!-- Main title -->
<h1 class="text-6xl md:text-8xl font-bold mb-6 bg-gradient-to-r from-gray-900 via-purple-600 to-purple-800 dark:from-white dark:via-purple-200 dark:to-purple-300 bg-clip-text text-transparent"> <h1 class="text-6xl md:text-8xl font-bold mb-6 bg-gradient-to-r from-gray-900 via-purple-600 to-purple-800 dark:from-white dark:via-purple-200 dark:to-purple-300 bg-clip-text text-transparent">
Joy Zhao {personalInfo.name}
</h1> </h1>
<!-- Subtitle --> <!-- Subtitle -->
<p class="text-2xl md:text-3xl text-muted-foreground mb-8 font-light"> <p class="text-2xl md:text-3xl text-muted-foreground mb-8 font-light">
Full Stack Engineer 👨‍💻 {personalInfo.position.en} 👨‍💻
</p> </p>
<!-- Description --> <!-- Description -->
<p class="text-lg text-muted-foreground max-w-3xl mx-auto mb-12 leading-relaxed"> <p class="text-lg text-muted-foreground max-w-3xl mx-auto mb-12 leading-relaxed">
Crafting elegant solutions to complex problems with clean code and innovative thinking. Welcome to my personal dev workspace where ideas come to life. {personalInfo.description.en}
</p> </p>
<!-- Action buttons --> <!-- Action buttons -->
@@ -61,7 +61,7 @@ const pageTitle = t('site.title');
</a> </a>
<a <a
href="mailto:rkesh2003@gmail.com" href={`mailto:${personalInfo.email}`}
class="border border-purple-500 text-purple-500 hover:bg-purple-500 hover:text-white px-8 py-3 rounded-lg font-semibold transition-colors flex items-center gap-2" class="border border-purple-500 text-purple-500 hover:bg-purple-500 hover:text-white px-8 py-3 rounded-lg font-semibold transition-colors flex items-center gap-2"
> >
<svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -118,7 +118,7 @@ const pageTitle = t('site.title');
<div class="w-3 h-3 rounded-full bg-green-500"></div> <div class="w-3 h-3 rounded-full bg-green-500"></div>
</div> </div>
<div class="text-gray-400 text-sm font-mono"> <div class="text-gray-400 text-sm font-mono">
john@dev-workspace {personalInfo.terminal.username}
</div> </div>
<div></div> <div></div>
</div> </div>
@@ -224,15 +224,11 @@ const pageTitle = t('site.title');
About Me About Me
</h3> </h3>
<div class="prose prose-lg dark:prose-invert max-w-none"> <div class="prose prose-lg dark:prose-invert max-w-none">
<p class="text-gray-700 dark:text-gray-300 leading-relaxed"> {personalInfo.about.en.map((paragraph) => (
I'm a passionate developer with 5+ years of experience building web applications and contributing to open source projects. I specialize in creating clean, efficient, and maintainable code. <p class="text-gray-700 dark:text-gray-300 leading-relaxed">
</p> {paragraph}
<p class="text-gray-700 dark:text-gray-300 leading-relaxed"> </p>
When I'm not coding, you can find me exploring new technologies, writing tech articles, or enjoying a fresh cup of coffee while debugging complex problems. ))}
</p>
<p class="text-gray-700 dark:text-gray-300 leading-relaxed">
I believe in continuous learning and staying up-to-date with the latest industry trends and best practices.
</p>
</div> </div>
</div> </div>
@@ -243,7 +239,7 @@ const pageTitle = t('site.title');
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"></path>
</svg> </svg>
<div class="text-2xl font-bold text-gray-900 dark:text-white mb-1"> <div class="text-2xl font-bold text-gray-900 dark:text-white mb-1">
152 {personalInfo.stats.repositories}
</div> </div>
<div class="text-xs text-gray-600 dark:text-gray-400"> <div class="text-xs text-gray-600 dark:text-gray-400">
Repositories Repositories
@@ -255,7 +251,7 @@ const pageTitle = t('site.title');
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.618 5.984A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016zM12 9v2.25"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.618 5.984A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016zM12 9v2.25"></path>
</svg> </svg>
<div class="text-2xl font-bold text-gray-900 dark:text-white mb-1"> <div class="text-2xl font-bold text-gray-900 dark:text-white mb-1">
42K {personalInfo.stats.commits}
</div> </div>
<div class="text-xs text-gray-600 dark:text-gray-400"> <div class="text-xs text-gray-600 dark:text-gray-400">
Commits Commits
@@ -267,7 +263,7 @@ const pageTitle = t('site.title');
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path>
</svg> </svg>
<div class="text-2xl font-bold text-gray-900 dark:text-white mb-1"> <div class="text-2xl font-bold text-gray-900 dark:text-white mb-1">
87 {personalInfo.stats.contributions}
</div> </div>
<div class="text-xs text-gray-600 dark:text-gray-400"> <div class="text-xs text-gray-600 dark:text-gray-400">
PRs Merged PRs Merged

30
src/pages/zh/index.astro
View File

@@ -35,17 +35,17 @@ const pageTitle = t('site.title');
<!-- Main title --> <!-- Main title -->
<h1 class="text-6xl md:text-8xl font-bold mb-6 bg-gradient-to-r from-gray-900 via-purple-600 to-purple-800 dark:from-white dark:via-purple-200 dark:to-purple-300 bg-clip-text text-transparent"> <h1 class="text-6xl md:text-8xl font-bold mb-6 bg-gradient-to-r from-gray-900 via-purple-600 to-purple-800 dark:from-white dark:via-purple-200 dark:to-purple-300 bg-clip-text text-transparent">
Joy Zhao {personalInfo.name}
</h1> </h1>
<!-- Subtitle --> <!-- Subtitle -->
<p class="text-2xl md:text-3xl text-muted-foreground mb-8 font-light"> <p class="text-2xl md:text-3xl text-muted-foreground mb-8 font-light">
全栈工程师 👨‍💻 {personalInfo.position.zh} 👨‍💻
</p> </p>
<!-- Description --> <!-- Description -->
<p class="text-lg text-muted-foreground max-w-3xl mx-auto mb-12 leading-relaxed"> <p class="text-lg text-muted-foreground max-w-3xl mx-auto mb-12 leading-relaxed">
用优雅的代码和创新的思维，为复杂问题打造精致的解决方案。欢迎来到我的个人开发工作空间，这里是想法变为现实的地方。 {personalInfo.description.zh}
</p> </p>
<!-- Action buttons --> <!-- Action buttons -->
@@ -61,7 +61,7 @@ const pageTitle = t('site.title');
</a> </a>
<a <a
href="mailto:rkesh2003@gmail.com" href={`mailto:${personalInfo.email}`}
class="border border-purple-500 text-purple-500 hover:bg-purple-500 hover:text-white px-8 py-3 rounded-lg font-semibold transition-colors flex items-center gap-2" class="border border-purple-500 text-purple-500 hover:bg-purple-500 hover:text-white px-8 py-3 rounded-lg font-semibold transition-colors flex items-center gap-2"
> >
<svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -118,7 +118,7 @@ const pageTitle = t('site.title');
<div class="w-3 h-3 rounded-full bg-green-500"></div> <div class="w-3 h-3 rounded-full bg-green-500"></div>
</div> </div>
<div class="text-gray-400 text-sm font-mono"> <div class="text-gray-400 text-sm font-mono">
john@dev-workspace {personalInfo.terminal.username}
</div> </div>
<div></div> <div></div>
</div> </div>
@@ -224,15 +224,11 @@ const pageTitle = t('site.title');
关于我 关于我
</h3> </h3>
<div class="prose prose-lg dark:prose-invert max-w-none"> <div class="prose prose-lg dark:prose-invert max-w-none">
<p class="text-gray-700 dark:text-gray-300 leading-relaxed"> {personalInfo.about.zh.map((paragraph) => (
我是一名充满激情的全栈开发者，专注于构建现代化的Web应用程序。我热爱学习新技术，并将它们应用到实际项目中。 <p class="text-gray-700 dark:text-gray-300 leading-relaxed">
</p> {paragraph}
<p class="text-gray-700 dark:text-gray-300 leading-relaxed"> </p>
在前端开发方面，我精通React、Vue.js和现代JavaScript框架。在后端，我有丰富的Node.js、Python和Go语言开发经验。 ))}
</p>
<p class="text-gray-700 dark:text-gray-300 leading-relaxed">
我相信代码的力量可以改变世界，致力于编写干净、高效且可维护的代码。我也热衷于开源项目，喜欢与开发者社区分享知识和经验。
</p>
</div> </div>
</div> </div>
@@ -243,7 +239,7 @@ const pageTitle = t('site.title');
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"></path>
</svg> </svg>
<div class="text-2xl font-bold text-gray-900 dark:text-white mb-1"> <div class="text-2xl font-bold text-gray-900 dark:text-white mb-1">
152 {personalInfo.stats.repositories}
</div> </div>
<div class="text-xs text-gray-600 dark:text-gray-400"> <div class="text-xs text-gray-600 dark:text-gray-400">
仓库数量 仓库数量
@@ -255,7 +251,7 @@ const pageTitle = t('site.title');
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.618 5.984A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016zM12 9v2.25"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.618 5.984A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016zM12 9v2.25"></path>
</svg> </svg>
<div class="text-2xl font-bold text-gray-900 dark:text-white mb-1"> <div class="text-2xl font-bold text-gray-900 dark:text-white mb-1">
42K {personalInfo.stats.commits}
</div> </div>
<div class="text-xs text-gray-600 dark:text-gray-400"> <div class="text-xs text-gray-600 dark:text-gray-400">
提交次数 提交次数
@@ -267,7 +263,7 @@ const pageTitle = t('site.title');
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path>
</svg> </svg>
<div class="text-2xl font-bold text-gray-900 dark:text-white mb-1"> <div class="text-2xl font-bold text-gray-900 dark:text-white mb-1">
87 {personalInfo.stats.contributions}
</div> </div>
<div class="text-xs text-gray-600 dark:text-gray-400"> <div class="text-xs text-gray-600 dark:text-gray-400">
PR合并数 PR合并数