mengyaprofile/mengyaprofile-frontend/README.md

萌芽个人主页 - 前端

基于 React 的个人主页前端应用。

功能特性

• ✨ 现代化的界面设计，渐变色背景和流畅动画
• 📱 完美适配移动端和桌面端
• 🎨 精美的卡片式布局
• 🚀 快速响应的用户交互
• 🔗 项目自动获取网站 favicon
• 📋 一键复制联系方式

三大模块

1. 个人信息模块

展示个人基本信息，包括：

• 昵称
• 头像（带动画效果）
• 个人介绍
• 技术定位
• 个人座右铭

2. 精选项目模块

以卡片形式展示项目：

• 项目标题
• 项目简介
• 项目链接
• 项目标签
• 自动获取网站图标

3. 联系方式模块

展示联系方式，支持：

• QQ
• 邮箱
• GitHub
• 一键复制
• 直接跳转

快速开始

安装依赖

npm install

启动开发服务器

npm start

应用将在 http://localhost:3000 上运行。

构建生产版本

npm run build

构建后的文件将生成在 build 目录中。

配置说明

前端会从后端 API 获取数据，请确保后端服务已启动：

• 后端地址：http://localhost:5000
• 如需修改，请编辑 src/App.js 中的 API 地址

技术栈

• React 19
• CSS3 动画
• Fetch API
• 响应式设计

浏览器支持

• Chrome (推荐)
• Firefox
• Safari
• Edge
• 移动端浏览器

自定义

如需自定义样式，可以编辑以下文件：

• src/App.css - 全局样式
• src/components/ProfileSection.css - 个人信息样式
• src/components/ProjectsSection.css - 项目展示样式
• src/components/ContactsSection.css - 联系方式样式