La façon la plus simple de commencer est de visiter notre site Web, où vous pouvez personnaliser et prévisualiser votre carte en direct.
https://github-readme-tech-stack.vercel.app
En tant que développeur, il est important de présenter votre expertise dans différentes technologies pour les collaborateurs et les employeurs potentiels. Avec GitHub ReadMe-Tech-Stack , vous pouvez facilement créer une représentation visuelle des technologies utilisées dans votre référentiel GitHub et l'inclure dans votre lecture de profil . Cela peut vous aider à vous démarquer et à attirer l'attention des autres qui recherchent des développeurs avec des compétences spécifiques.
Les images sont entièrement personnalisables, vous pouvez donc choisir les technologies que vous souhaitez présenter et même ajuster les couleurs, les icônes et l'alignement pour correspondre à votre marque personnelle.
Personnellement, j'ai toujours voulu montrer mes compétences d'une manière propre et moderne. Je pouvais le faire avec juste les badges, mais ils ne correspondent pas au style de GitHub-Readme-Strat-stats et de GitHub-Readme-stats. Avec GitHub Readme-Tech-Stack , ce n'est plus un problème, il correspond naturellement à ces cartes!
profile README .svg si elles n'existent pas déjà.Aucun des champs n'est requis. Chaque paramètre de requête a une valeur par défaut, qui est répertoriée ci-dessous.
| Paramètre | Exemple | Valeur par défaut | Description |
|---|---|---|---|
| titre | title=My%20Title | Ma pile technologique | Le titre de la carte. %20 peut être utilisé comme espace. |
| thème | theme=github_dark | github | Le thème de la carte. Vous pouvez parcourir les thèmes ici. |
| aligner | align=center | gauche | L'alignement des badges. ( left , center , right ) |
| titlealign | align=center | gauche | L'alignement du titre. ( left , center , right ) |
| showborder | showBorder=false | vrai | Affichez la bordure autour de la carte ou non. ( true , false ) |
| refuge | hideTitle=true | FAUX | Affichez le titre de la carte ou non. ( true , false ) |
| hidebg | hideBg=true | FAUX | Si c'est vrai, définit l'arrière-plan en transparent. ( true , false ) |
| frontière | borderRadius=12.5 | 4.5 | Nombre entre 0 et 50. |
| fonte | fontFamily=consolas | Segoe ui | La famille des polices du titre. Si la famille spécifiée n'existe pas, la valeur par défaut est utilisée. |
| s'adapter | fontSize=20 | 18 | La taille du titre. Accepte un nombre entre 15 et 30. |
| poids de la police | fontWeight=normal | semi-same | L'épaisseur du titre. ( thin , normal , semibold , bold ) |
| largeur | width=500 | 495 | La largeur de la carte. Accepte un nombre valide. |
| écart | gap=15 | 10 | L'écart entre les badges. Accepte un nombre entre 0 et 30. |
| lineheight | lineHeight=10 | 7 | L'écart entre les lignes. Accepte un nombre entre 0 et 30. |
| lineCount | lineCount=2 | 1 | Le nombre de lignes que vous souhaitez ajouter à votre carte. |
| lin} | line1=html5,html5,auto | - | La ligne actuelle du badge, où {n} est un nombre. (1 <= n <= lineCount) |
| bg | bg=%2383324c | - | La couleur de l'arrière-plan. |
| frontière | border=%232da7c7 | - | La couleur de la bordure. |
| badge | badge=%2383324c | - | La couleur des badges. |
| titlecolor | titleColor=%232da7c7 | - | La couleur du titre. |
Ces cartes sont livrées avec plusieurs thèmes intégrés que vous pouvez utiliser. Vous pouvez les trouver tous en cliquant ici.
Vous pouvez également personnaliser les thèmes. C'est plus facile à faire avec le site Web de démonstration.
# Clone the project:
git clone https://github.com/0l1v3rr/github-readme-tech-stack.git
cd github-readme-tech-stack
# Install the dependencies:
npm i
npm run prepare
# Running the application:
npm run dev
# Running the storybook:
npm run storybook Toutes les contributions sont les bienvenues.
Vous pouvez trouver une directive contributive ici.
Ce projet est publié sous la licence du MIT.