La forma más fácil de comenzar es visitar nuestro sitio web, donde puede personalizar y obtener una vista previa de su tarjeta en vivo.
https://github-readme-tech-stack.vercel.app
Como desarrollador, es importante mostrar su experiencia en diferentes tecnologías a posibles colaboradores y empleadores. Con GitHub-ReadMe-Tech-Stack , puede crear fácilmente una representación visual de las tecnologías utilizadas en su repositorio de GitHub e incluirlo en su readme de perfil . Esto puede ayudarlo a destacar y atraer la atención de otros que buscan desarrolladores con habilidades específicas.
Las imágenes son totalmente personalizables, por lo que puede elegir las tecnologías que desea mostrar e incluso ajustar los colores, los iconos y la alineación para que coincida con su marca personal.
Personalmente, siempre he querido mostrar mis habilidades de una manera limpia y moderna. Podría hacer eso solo con las insignias, pero no coincidieron con el estilo de las estadísticas github-readme-stretreak y las estadísticas github-readme. Con GitHub-Readme-Tech-Stack , eso ya no es un problema, ¡naturalmente coincide con esas cartas!
profile README .svg si aún no existen.No se requiere ninguno de los campos. Cada parámetro de consulta tiene un valor predeterminado, que se enumera a continuación.
| Parámetro | Ejemplo | Valor predeterminado | Descripción |
|---|---|---|---|
| título | title=My%20Title | Mi pila tecnológica | El título de la tarjeta. %20 se puede usar como espacio. |
| tema | theme=github_dark | github | El tema de la tarjeta. Puedes navegar entre los temas aquí. |
| alinear | align=center | izquierda | La alineación de las insignias. ( left , center , right ) |
| Titlealign | align=center | izquierda | La alineación del título. ( left , center , right ) |
| showforder | showBorder=false | verdadero | Muestre el borde alrededor de la tarjeta o no. ( true , false ) |
| escondite | hideTitle=true | FALSO | Muestre el título de la tarjeta o no. ( true , false ) |
| hilera | hideBg=true | FALSO | Si es verdadero, establece el fondo en transparente. ( true , false ) |
| fronterradio | borderRadius=12.5 | 4.5 | Número entre 0 y 50. |
| huella | fontFamily=consolas | Segoe ui | La familia de fuentes del título. Si la familia especificada no existe, se usa el valor predeterminado. |
| fontisor | fontSize=20 | 18 | El tamaño del título. Acepta un número entre 15 y 30. |
| peso de la fuente | fontWeight=normal | semibold | El grosor del título. ( thin , normal , semibold , bold ) |
| ancho | width=500 | 495 | El ancho de la tarjeta. Acepta un número válido. |
| brecha | gap=15 | 10 | La brecha entre las insignias. Acepta un número entre 0 y 30. |
| lineheight | lineHeight=10 | 7 | La brecha entre las líneas. Acepta un número entre 0 y 30. |
| lindaza | lineCount=2 | 1 | La cantidad de líneas que desea agregar a su tarjeta. |
| lino} | line1=html5,html5,auto | - | La línea actual de la insignia, donde {n} es un número. (1 <= n <= lineCount) |
| BG | bg=%2383324c | - | El color del fondo. |
| borde | border=%232da7c7 | - | El color de la frontera. |
| insignia | badge=%2383324c | - | El color de las insignias. |
| titlecolor | titleColor=%232da7c7 | - | El color del título. |
Estas tarjetas vienen con varios temas incorporados que puedes usar. Puede encontrarlos todos haciendo clic aquí.
También puede personalizar los temas. Es más fácil hacer con el sitio web de demostración.
# 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 Todas las contribuciones son bienvenidas.
Puede encontrar una guía contribuyente aquí.
Este proyecto se publica bajo la licencia MIT.