🚀 创建有吸引力的 GitHub 个人资料 README 📝

2025-05-26

🚀 创建有吸引力的 GitHub 个人资料 README 📝

使用我的自定义配置文件 README 模板增强您的 GitHub README。

欢迎踏上这段旅程,通过出色的 README 来提升您的 GitHub 个人资料!

你的 GitHub README 是给潜在雇主、合作伙伴和其他开发者的第一印象。一份引人入胜、结构良好的 README 不仅能凸显你的技能和项目,还能展现你的个性和专业素养。在这里,我将指导你如何使用我定制的综合模板来优化你的 GitHub README。

您可以访问我的GitHub 个人资料来查看完成的自述文件是什么样子!

创建您的特殊 README 存​​储库

在此之前,让我带您了解特殊 README 存​​储库的创建阶段。

  • 创建一个 GitHub 帐户并登录你的 GitHub。
  • 转到您的 GitHub 用户资料。
  • 除了标签页之外Overview,你还可以看到Repositories标签页,切换到你的Repositories标签页。它包含你创建的所有仓库。

存储库选项卡

  • 单击New按钮创建一个新的存储库。

新按钮

  • 这是重要的部分,确保您的存储库名称与您的用户名完全相同。

GitHub 存储库名称

  • 检查您的 GitHub 存储库是否Public。您还可以通过打开特定存储库并移至选项卡底部来更改存储库可见性设置Settings

存储库可见性

  • 选择 的选项Add a README file,这将添加一个空的 Markdown 文件。

  • 单击Create Repository按钮最终创建您的帐户。

介绍

我们将使用Markdown编写 README 文件,本文也使用 Markdown 语言编写。README
文件开头应该包含热情的问候语和简短的介绍。您可以使用醒目的标题或 GIF 动图来增添一些个人特色。

确保/icons包含icons用于 GitHub 个人资料的文件夹,并将其推送到 GitHub 个人资料特殊存储库的主分支上。

https://github.com/YourUsername/YourUsername/blob/main/icons/activity.gif
Enter fullscreen mode Exit fullscreen mode
<h1 align="center">Hi <img src="https://github.com/YourUsername/YourUsername/blob/main/icons/Hi.gif" width="28px"/>, I'm [Your Name]</h1>
<h2 align="center">
  <img src="https://komarev.com/ghpvc/?username=[YourUsername]&color=dc143c&style=for-the-badge" alt="Profile Views" style="height:21px;">
  Fullstack Developer
  <a href="https://[your-portfolio-link]">
    <img src="https://img.shields.io/badge/Portfolio-543DE0?style=for-the-badge&logo=About.me&logoColor=white" alt="Portfolio" style="height:22px;">
  </a>
</h2>
<div align="center">
 <img alt="GIF" src="https://media4.giphy.com/media/11KzOet1ElBDz2/giphy.gif?cid=6c09b952ufa3xxbbm0mpuadm2zaik3wjp4m9luz2ly0lyz8d&ep=v1_internal_gif_by_id&rid=giphy.gif&ct=g" />
</div>
Enter fullscreen mode Exit fullscreen mode

关于我部分

简要介绍一下你是谁、你的专长以及你的动力。使用项目符号或简洁的段落来保持可读性。

## <img align ='center' src="https://i.giphy.com/media/v1.Y2lkPTc5MGI3NjExdjh2dDM4bDhyYzM5NmppaHJ6dG56Mmh3bTkyanFkdWRvZ3R1cGoycSZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9ZQ/LOnt6uqjD9OexmQJRB/giphy.gif" width="37" /> About Me

I am a passionate Fullstack Developer with a strong foundation in both frontend and backend technologies. A versatile developer specializing in **MERN, Android Development, and Chatbot Development** with a passion for continuous learning. My expertise lies in integration, improving user interfaces, and enhancing overall user experiences. I thrive on solving challenging problems and creating innovative solutions.
Enter fullscreen mode Exit fullscreen mode

详细章节

利用可折叠的版块有效地组织您的 README 文件。这可以使文档保持简洁易读。以下是如何构建简历、工作经验、代码处理、技术栈和项目版块:

简历和经验

<details>
 <summary>
    <h2> 
      <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/about.png" width="37" /> 
    Resume
    </h2>
</summary>

 <details>
  <summary><h4> <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/academics.gif" width="29"/> Academics</h4></summary>
  <span><img src="https://img.shields.io/badge/BTECH-[YourUniversity]-1877F2?style=for-the-badge"></span>
  <span><img src="https://img.shields.io/badge/GPA-[YourGPA]-EFEEE9?style=for-the-badge"></span>
 </details>

 <details>
  <summary><h4> <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/experience.gif" width="29"/> Experience</h4></summary>
  - **[Your Role] ** at [Company] | [Duration]
    - [Work Description]
 </details>
</details>
Enter fullscreen mode Exit fullscreen mode

编码句柄和技术堆栈

<details>
  <summary><h4> <img align="center" src="https://user-images.githubusercontent.com/74038190/216122041-518ac897-8d92-4c6b-9b3f-ca01dcaf38ee.png" width="29"/> Coding Handles</h4></summary>
  [![LeetCode](https://img.shields.io/badge/LeetCode-000000?style=for-the-badge&logo=LeetCode&logoColor=#d16c06)](https://www.leetcode.com/[your-handle])
  [![Codeforces](https://img.shields.io/badge/Codeforces-445f9d?style=for-the-badge&logo=Codeforces&logoColor=white)](https://codeforces.com/profile/[your-handle])
  [![GeeksForGeeks](https://img.shields.io/badge/GeeksforGeeks-gray?style=for-the-badge&logo=geeksforgeeks&logoColor=35914c)](https://auth.geeksforgeeks.org/user/[your-handle]/practice)
</details>

<details>
  <summary><h4> <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/techstack.gif" width="29"/> Tech Stack</h4></summary>
  ![C++](https://img.shields.io/badge/c++-%2300599C.svg?style=for-the-badge&logo=c%2B%2B&logoColor=white)  
  ![JavaScript](https://img.shields.io/badge/javascript-%23323330.svg?style=for-the-badge&logo=javascript&logoColor=%23F7DF1E) 
  ![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB) 
</details>
Enter fullscreen mode Exit fullscreen mode

项目

重点突出您的关键项目,并附上描述及其影响。使用图标和徽章直观地展示所使用的技术。

<details>
  <summary><h4> <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/projects.gif" width="29"/> Projects</h4></summary>

  #### <a href="https://github.com/[YourUsername]/[Project-Name]">[Project Name]</a>
  <span><img src="https://img.shields.io/badge/Node.js-%2343853D.svg?style=for-the-badge&logo=node.js&logoColor=white"> <img src="https://img.shields.io/badge/MongoDB-%234ea94b.svg?style=for-the-badge&logo=mongodb&logoColor=white"></span>
  - Implemented features to notify users about new opportunities.
  - Achieved a user base of X, surpassing initial projections.
</details>
Enter fullscreen mode Exit fullscreen mode

统计数据和活动

使用 GitHub 统计数据和活动图表展示您的编码活动和贡献。

GitHub ReadMe 统计信息

GitHub 贡献统计

<details>
  <summary><h2> <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/stats.gif" width="32"/> Stats</h2></summary>
  <div align="center">
    ![](https://github-readme-stats.vercel.app/api?username=[YourUsername]&theme=tokyonight&hide_border=false&include_all_commits=true&count_private=false)<br/>
    ![](https://github-readme-streak-stats.herokuapp.com/?user=[YourUsername]&theme=tokyonight&hide_border=false)<br/>
    ![](https://github-readme-stats.vercel.app/api/top-langs/?username=[YourUsername]&theme=tokyonight&hide_border=false&include_all_commits=true&count_private=false&layout=compact)<br/>
    ![](https://github-readme-activity-graph.vercel.app/graph?username=[YourUsername]&theme=tokyo-night)
  </div>
</details>
Enter fullscreen mode Exit fullscreen mode

除了 GitHub Stats 之外,你还可以像这样展示你的 LeetCode Stats/Codeforces Stats:-

Leetcode 统计

GitHub 统计信息

  ### Leetcode
  <div align="center">

  ![LeetCode Stats](https://leetcode.card.workers.dev/YourUsername?theme=auto&font=baloo&extension=null)

  </div>

  ### Codeforces
  <div align="center">

  ![Codeforces Stats](https://codeforces-readme-stats.vercel.app/api/card?username=YourUsername)

  </div>

Enter fullscreen mode Exit fullscreen mode

社交链接和联系方式

接触

在您的 README 结尾处添加您的社交链接和联系信息,以便其他人轻松与您联系。

接触

<details>
  <summary><h2> <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/Contact.gif" width="37"/> Contact Me</h2></summary>
  <p>
    <i>You can reach out to me via</i>
    <a href="mailto:[your-email]">
      <img align="center" src="https://github.com/[YourUsername]/[YourUsername]/blob/main/icons/Gmail.gif" width="100"/>
    </a>
  </p>
</details>
Enter fullscreen mode Exit fullscreen mode

添加笑话/歌曲/名言

随机笑话

<details>
  <summary>Click to see a random joke</summary>
  <div align="center">

  ![Jokes Card](https://readme-jokes.vercel.app/api?theme=halloween)

  </div>
</details>
Enter fullscreen mode Exit fullscreen mode

同样,您也可以利用SpotifyQuotes

Spotify

引号

使用 GitHub Actions

合并 PR GitHub Action

合并 PR GitHub Action

这是一个简单的项目,我用它来自动化我最近合并的 PR,你可以按照这个博客来设置合并的 PR GitHub Action。

### ✅ Merged PRs
<!--Start Count Merged PRs-->
  <span><img src="https://img.shields.io/badge/Total_Merged_PRs-34-1877F2?style=for-the-badge"></span>
<!--Finish Count Merged PRs-->

<!--Start Merged PRs-->
1. 🥳 Merged PR [379](https://github.com/pymc-labs/CausalPy/pull/379) - [pymc-labs/CausalPy](https://github.com/pymc-labs/CausalPy)
<!--Finish Merged PRs-->
Enter fullscreen mode Exit fullscreen mode

最近活动

通过此“最近活动 GitHub 操作”,您可以自动化最近的活动并在个人资料上展示。

最近活动

### <img align="center" src="https://github.com/YourUsername/YourUsername/blob/main/icons/activity.gif"  width="25"/> Recent Activity
<!--START_SECTION:activity-->
1. 🗣 Commented on [#2944](https://github.com/actualbudget/actual/issues/2944#issuecomment-2197605111) in [actualbudget/actual](https://github.com/actualbudget/actual)
<!--END_SECTION:activity-->
Enter fullscreen mode Exit fullscreen mode

贡献图蛇形游戏

贡献图 GitHub Action可自动创建蛇吃掉您的贡献单元的动画 svg。

GitHub 蛇形动画

附加卡

实时 Spotify 音乐这将在您的 GitHub 个人资料上播放实时 Spotify 音乐。

Waka 时间统计此操作将设置 waka 时间统计,以在您的 GitHub 个人资料上展示。

GitHub Trophy将根据您的 GitHub 个人资料动态生成统计数据。

ReadME Terminal这会为您的 GitHub 个人资料生成一个基于终端的独特 gif。

指标这将根据您的 GitHub 个人资料生成详细的统计信息图。

个人资料标题生成器- @leviarista的这个工具将帮助您生成具有不同背景和主题的自定义 GitHub 个人资料标题。

按照此模板,您可以创建内容全面、视觉精美的 README 文件,有效展示您的技能、项目和个性。请记住,关键在于保持文件条理清晰、引人入胜,并体现您的独特风格和贡献。

致谢

  1. https://github.com/antonkomarev/github-profile-views-counter
  2. https://github.com/Ileriayo/markdown-badges
  3. https://github.com/anuraghazra/github-readme-stats
  4. https://github.com/Ashutosh00710/github-readme-activity-graph
  5. https://github.com/JacobLinCool/LeetCode-Stats-Card
  6. https://github.com/RedHeadphone/codeforces-readme-stats
  7. https://github.com/ABSphreak/readme-jokes
  8. https://github.com/JeffreyCA/spotify-recently-played-readme
  9. https://github.com/PiyushSuthar/github-readme-quotes
  10. https://github.com/ParthJohri/github-mergedpr-readme
  11. https://github.com/jamesgeorge007/github-activity-readme
  12. https://github.com/Platane/snk
  13. https://github.com/novatorem/novatorem
  14. https://github.com/athul/waka-readme
  15. https://github.com/ryo-ma/github-profile-trophy
  16. https://github.com/x0rzavi/github-readme-terminal
  17. https://github.com/lowlighter/metrics
  18. https://github.com/leviarista/github-profile-header-generator

信封

给自己一个掌声👏,你的自定义 GitHub Profile README 终于完成了!在评论区分享你的 GitHub Profile README,如果我遗漏了什么,请告诉我,我很乐意补充。

文章来源:https://dev.to/parth_johri/create-an-attractive-github-profile-readme-noj
PREV
10 个免费公共 API,供开发人员在下一个项目中使用
NEXT
🔧 高级 JavaScript 性能优化:技术和模式