Github：美化 your profile

前言

        GitHub已经成为开发者展示才能、分享代码和建立专业形象的重要平台。然而,仅仅拥有优秀的代码库已经不够了。你的GitHub个人主页就像是你在开源世界的数字名片,它不仅反映了你的技术能力,还展示了你的个性和专业态度。

        想象一下,当潜在雇主、合作伙伴或其他开发者访问你的GitHub主页时,他们看到的不仅仅是一串冰冷的代码贡献统计,而是一个精心设计、富有个性的个人展示页面。这个页面生动地讲述了你的技术旅程、展示了你的技能组合,甚至还能透露出你的兴趣爱好和个人风格。

        在这篇文章中,我们将深入探讨如何将你的GitHub个人主页从普通变得与众不同。我们将介绍各种实用技巧和创新工具,帮助你创建一个既专业又富有个性的GitHub形象。无论你是刚刚踏入编程世界的新手,还是经验丰富的开发者,这篇指南都将帮助你在竞争激烈的技术领域中脱颖而出。

        准备好提升你的GitHub个人主页了吗？让我们开始这段令人兴奋的美化之旅吧!

---

效果展示 & 源码

        先来看看我的 github profile，看看效果，如果你觉得好看的话，接下来跟着我的步骤操作就可以达到类似的效果

（此处图片 + 代码，是配套的，后续我可能改动我的 profile ,源代码也可以在我的github账户找到）

​

​

代码

<h1 align="center">Hi there, I'm @unraveltao 👋</h1>

<p align="center">
  <a href="https://git.io/typing-svg"><img src="https://readme-typing-svg.demolab.com?font=Fira+Code&pause=1000&color=36BCF7FF&center=true&vCenter=true&width=435&lines=A+passionate+developer+from+China;Go+%7C+React+%7C+Docker+Enthusiast;Always+learning+new+things" alt="Typing SVG" /></a>
</p>

<p align="center">
  <img src="https://komarev.com/ghpvc/?username=unraveltao&abbreviated=true" alt="unraveltao" />
</p>

<p align="center">
  <a href="https://github.com/ryo-ma/github-profile-trophy"><img src="https://github-profile-trophy.vercel.app/?username=unraveltao&theme=onestar&no-frame=true&row=1&column=7" alt="unraveltao" /></a>
</p>

<p align="center">
  <img src="https://github-readme-stats.vercel.app/api?username=unravelTao&show_icons=true&theme=transparent&width=495" alt="unraveltao's GitHub stats" />
</p>

<p align="center">
  <img src="https://github-readme-streak-stats.herokuapp.com/?user=unraveltao&theme=transparent&width=495" alt="unraveltao" />
</p>



<h2 align="center">🚀 About Me</h2>🚀 About Me

- 🔭 I'm currently working on **building a personal blog using React and Go**
- 🌱 I'm currently learning **Advanced Go concurrency patterns and React hooks**
- 👯 I'm looking to collaborate on **open-source web development projects**
- 🤝 I'm looking for help with **optimizing Docker containers for Go applications**
- 💬 Ask me about **Go, React, Docker, and modern web development practices**
- 📫 How to reach me: **irontom233@gmail.com**
- ⚡ Fun fact: **I can solve a Rubik's cube in under 2 minutes**


<h2 align="center">🛠 Skills & Most Used Languages</h2>


<p align="center">
  <img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/go/go-original-wordmark.svg" alt="go" width="40" height="40" style="margin: 5px;"/>
  <img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/react/react-original-wordmark.svg" alt="react" width="40" height="40" style="margin: 5px;"/>
  <img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/docker/docker-original-wordmark.svg" alt="docker" width="40" height="40" style="margin: 5px;"/>
  <img src="https://www.vectorlogo.zone/logos/git-scm/git-scm-icon.svg" alt="git" width="40" height="40" style="margin: 5px;"/>
  <img src="https://www.vectorlogo.zone/logos/python/python-icon.svg" alt="python" width="40" height="40" style="margin: 5px;"/>
  <img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/html5/html5-original-wordmark.svg" alt="html5" width="40" height="40" style="margin: 5px;"/>
  <img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/css3/css3-original-wordmark.svg" alt="css3" width="40" height="40" style="margin: 5px;"/>
  <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/javascript/javascript-original.svg" alt="javascript" width="40" height="40" style="margin: 5px;"/>
  <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/vitejs/vitejs-original.svg" alt="vitejs" width="40" height="40" style="margin: 5px;"/>
</p>

<p align="center">
  <img src="https://github-readme-stats.vercel.app/api/top-langs/?username=unravelTao&theme=transparent" alt="Top Langs" width="300" />
</p>

<h2 align="center">📊 This Week I Spent My Time On</h2>

<!--START_SECTION:waka-->
```text
Go         5 hrs 42 mins   ███████████▓░░░░░░░░░░░░░   46.77 % 
React      3 hrs 20 mins   ███████▒░░░░░░░░░░░░░░░░░   29.52 % 
Docker     1 hr 30 mins    ███▓░░░░░░░░░░░░░░░░░░░░░   14.77 % 
HTML/CSS   45 mins         █▓░░░░░░░░░░░░░░░░░░░░░░░   06.42 % 
Git        15 mins         ▓░░░░░░░░░░░░░░░░░░░░░░░░   02.42 %

实践

让我一步步来教你如何定制你的GitHub个人主页:

1. 创建特殊仓库: 首先,创建一个与你的GitHub用户名同名的新仓库。例如,我的用户名是'unraveltao',所以我创建了'unraveltao/unraveltao'仓库。
2. 添加README.md: 在这个仓库中创建一个README.md文件。这个文件的内容将显示在你的个人主页上。
3. 复制基础代码: 将上面展示的HTML代码复制到你的README.md文件中。
4. 个性化你的信息:
   • 将代码中的'unraveltao'替换为你的GitHub用户名。
   • 修改"Hi there, I'm @unraveltao 👋"中的用户名。
   • 在"About Me"部分,根据你自己的情况修改每一项内容。
5. 自定义动态内容：这里操作就去看官方文档
   • 打字效果: 修改typing-svg链接中的文本。
   • 访问计数器: 在komarev链接中替换用户名。
   • GitHub统计: 在所有github-readme-stats链接中替换用户名。
   • 展示Github成就：激励你写代码像玩游戏一样
6. 技能图标: 在"Skills & Most Used Languages"部分,添加或删除你擅长的技术的图标。这里的技术图标可以自行添加

• https://www.vectorlogo.zone/
• DEVICON | All programming languages and development tools related icons font

最后：预览和调整: 提交更改后,访问你的GitHub个人主页查看效果。根据需要进行微调。记住,GitHub可能会限制某些HTML元素和样式,所以最终效果可能略有不同。不断尝试和调整,直到你满意为止!

        通过这些步骤,你就可以创建一个独特、生动的GitHub个人主页,展示你的技能和个性。随着你在编程旅程中的进步,别忘了定期更新你的主页,让它始终反映你最新的成就和技能!