大家好,我是南城余。
最近在搞项目的开源 README.md 时,看到有的大佬的 README.md 前面都会有 badge 标识和多彩的 tag 标签。都看着超级高级,就想着也来实践下。
今天一篇文章带着大家个性化你的 README.md。如下图片:
这里我先放下适用于所有 Spring Boot 项目和 React 项目的通用模板。方便大家直接 COPY。
❝因为搞这东西,还挺费时的,这里直接给大家放下通用的模板。
下方也有自定义你的专属 README.md 步骤哦~
通用模板
Spring Boot 项目
❝
只需要修改下方 nanchengcyu/TechMindWave-backend 为你自己的名字和仓库即可
另外:如果项目的 Java 版本和 SpringBoot 版本与下方不一致,也可以修改下方对应数字即可
<h1 align="center">自动图文生成系统</h1> <p align="center"> <img src="https://img.shields.io/github/languages/code-size/nanchengcyu/TechMindWave-backend" alt="code size"/> <img src="https://img.shields.io/badge/Spring%20Boot-2.5.4-brightgreen" alt="Spring Boot"/> <img src="https://img.shields.io/github/languages/count/nanchengcyu/TechMindWave-backend" alt="languages"/> <img src="https://img.shields.io/badge/Java-8-blue" alt="Java"/> <img src="https://img.shields.io/github/last-commit/nanchengcyu/TechMindWave-backend" alt="last commit"/><br> <img src="https://img.shields.io/badge/Author-nanchengyu-orange" alt="Author" /> </p> <hr>
效果图展示
React 项目
<h1 align="center">自动图文生成系统</h1> <p align="center"> <img src="https://img.shields.io/github/languages/code-size/nanchengcyu/TechMindWave-frontend" alt="code size"/> <img src="https://img.shields.io/badge/React-17.0.2-blue" alt="React"/> <img src="https://img.shields.io/badge/Ant%20Design%20Pro-5.0.0-brightgreen" alt="Ant Design Pro"/> <img src="https://img.shields.io/github/languages/count/nanchengcyu/TechMindWave-frontend" alt="languages"/> <img src="https://img.shields.io/github/last-commit/nanchengcyu/TechMindWave-frontend" alt="last commit"/> <br> <img src="https://img.shields.io/badge/Author-nanchengyu-orange" alt="Author" /> </p> <hr>
效果图展示
自定义你的 README.md
步骤如下:
1)你可以用下面这个网站,自定义你的标签
❝https://shields.io/
2)点击 Get Started,进入下面这个页面自定义你的 badge 标识和多彩的 tag 标签
❝如下方红色箭头所示,推荐使用 HTML 粘贴到 README.md 中。
❝
此步骤参考于
https://www.cnblogs.com/knuzy/p/15320038.html
但是步骤有点过时,推荐使用上方我的通用模板!