contribution cards
1.0.0
기고 카드는 HTML 카드를 디자인하고 사용자 정의 할 수있는 재미 있고 대화식 프로젝트입니다. 이 프로젝트는 오픈 소스 기부금에 대해 배우고 HTML, CSS, JS, GIT 기술을 개선하며 창의성을 보여주는 환상적인 방법입니다. 당신이 초보자이든 숙련 된 개발자이든, 여기에 당신을위한 것이 있습니다! ??
기여 카드를 시작하려면 다음 단계를 따르십시오.
이 저장소 포크 :이 페이지의 오른쪽 상단에있는 '포크'버튼을 클릭하십시오.
포크 리포지토리를 복제하십시오 .
git clone https://github.com/your-username/contribution-cards.git프로젝트 디렉토리로 이동하십시오 .
cd contribution-cards Browser에서 Open index.html 프로젝트가 작동중인 프로젝트를보고 index.html 에서 데이터를 추가하여 루트 디렉토리에서 데이터를 추가합니다 (코드베이스 구조를 더 잘 이해하려면 각 카드의 끝에서 코드 변경)
다음은 예입니다 (세부 사항과 함께 편집)
<!--John Doe's Card Start-->
< div class =" cards john-doe " >
< div class =" card-head " >
< h5 class =" card-title " > John Doe </ h5 >
< ul class =" card-social-links " >
< li > < a href =" https://www.linkedin.com/in/johndoe " class =" card-link " data-toggle =" tooltip " title =" LinkedIn " > < i class =" bi bi-linkedin " > </ i > </ a > </ li >
< li > < a href =" https://github.com/johndoe " class =" card-link " data-toggle =" tooltip " title =" GitHub " > < i class =" bi bi-github " > </ i > </ a > </ li >
< li > < a href =" https://johndoe.com " class =" card-link " data-toggle =" tooltip " title =" Portfolio " > < i class =" bi bi-globe " > </ i > </ a > </ li >
</ ul >
</ div >
< p class =" card-text " > John is a software developer with a passion for open-source projects and community engagement. </ p >
< ul class =" card-study-links " >
< li > < a href =" https://www.freecodecamp.org " target =" _blank " class =" study-link " data-toggle =" tooltip " title =" FreeCodeCamp " > < i class =" bi bi-book " > </ i > </ a > </ li >
< li > < a href =" https://www.w3schools.com " target =" _blank " class =" study-link " data-toggle =" tooltip " title =" W3Schools " > < i class =" bi bi-mortarboard " > </ i > </ a > </ li >
< li > < a href =" https://docs.github.com " target =" _blank " class =" study-link " data-toggle =" tooltip " title =" GitHub Docs " > < i class =" bi bi-file-code " > </ i > </ a > </ li >
</ ul >
< h6 class =" card-subtitle mb-2 text-muted card-date " > Updated on: July 22, 2024 </ h6 >
</ div >
<!--John Doe's Card End--> css 디렉토리의 Open users.css 카드 배경 색상 및 색상 업데이트 (더 나은 코딩 구조를 위해 추가)
. john-doe {
background-color : # ff6b6b ;
color : white;
}data Directory의 Open users.json auto-merge.yml 업데이트에 대한 카드 세부 정보를 업데이트합니다 (더 나은 코딩 구조를 위해 추가) {
"name" : " John Doe " ,
"title" : " Software Developer " ,
"socialLinks" : {
"linkedin" : " https://www.linkedin.com/in/johndoe " ,
"github" : " https://github.com/johndoe " ,
"portfolio" : " https://johndoe.com "
},
"description" : " John is a software developer with a passion for open-source projects and community engagement. " ,
"studyLinks" : {
"freeCodeCamp" : " https://www.freecodecamp.org " ,
"w3Schools" : " https://www.w3schools.com " ,
"githubDocs" : " https://docs.github.com "
},
"updatedOn" : " July 22, 2024 "
},우리는 모든 사람의 기여를 환영합니다. 기여하는 단계는 다음과 같습니다.
git clone https://github.com/your-username/contribution-cards.gitgit switch -c " your-branch-name "git add .
git commit -m " Add a meaningful commit message "git push origin your-branch-name프로젝트 구조에 대한 간단한 개요는 다음과 같습니다.
├── assets
├── CODE_OF_CONDUCT.md
├── Contributors.md
├── css
│ ├── styles.css
│ └── users.css
├── data
│ └── users.json
├── index.html
├── js
│ └── main.js
├── MIT-LICENSE.txt
└── README.md
우리는 다음 개인의 기여에 감사합니다 : 기고자
이것은 시작에 불과합니다! 나는이 놀라운 커뮤니티와 더 의미있는 기여를하고 협력하기를 기대합니다. 함께 훌륭한 것을 만들고 끈적 끈적한 메모를 최선으로 만들어 봅시다! ❤️?
이 프로젝트는 MIT 라이센스에 따라 라이센스가 부여됩니다. 자세한 내용은 라이센스 파일을 참조하십시오.
