contribution cards

บัตรบริจาค

บัตรบริจาคเป็นโครงการที่สนุกและโต้ตอบซึ่งคุณจะได้รับการออกแบบและปรับแต่งการ์ด HTML โครงการนี้เป็นวิธีที่ยอดเยี่ยมในการเรียนรู้เกี่ยวกับการมีส่วนร่วมของโอเพนซอร์ซปรับปรุง HTML, CSS, JS, ทักษะ GIT และแสดงความคิดสร้างสรรค์ของคุณ ไม่ว่าคุณจะเป็นผู้เริ่มต้นหรือนักพัฒนาที่มีประสบการณ์มีบางอย่างสำหรับคุณที่นี่! -

สารบัญ

• เริ่มต้น
• วิธีการมีส่วนร่วม
  • แยกที่เก็บ
  • โคลนที่เก็บ
  • สร้างสาขา
  • ทำการเปลี่ยนแปลงของคุณ
  • กระทำการเปลี่ยนแปลงของคุณ
  • กดไปที่ gitHub
  • สร้างคำขอดึง
• โครงสร้างโครงการ
• ผู้มีส่วนร่วม
• ใบอนุญาต

เริ่มต้น

ในการเริ่มต้นด้วยบัตรบริจาคให้ทำตามขั้นตอนเหล่านี้:

1. ส้อมที่เก็บนี้ : คลิกปุ่ม 'ส้อม' ที่ด้านบนขวาของหน้านี้

2. โคลนที่เก็บข้อมูลของคุณ :

   git clone https://github.com/your-username/contribution-cards.git

3. นำทางไปยังไดเรกทอรีโครงการ :

    cd contribution-cards

4. เปิด index.html ในเบราว์เซอร์ของคุณเพื่อดูโครงการในการดำเนินการและเพิ่มข้อมูลในตอนท้ายของ index.html ในไดเรกทอรีรูท (เปลี่ยนรหัสเมื่อสิ้นสุดการ์ดแต่ละใบเพื่อทำความเข้าใจโครงสร้าง codebase ที่ดีขึ้น)
   นี่คือตัวอย่าง (แก้ไขพร้อมรายละเอียดของคุณ)

    <!--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-->

5. เปิด users.css ในไดเรกทอรี css เพื่ออัปเดตสีพื้นหลังการ์ดและสีของคุณ (เพิ่มในตอนท้ายสำหรับโครงสร้างการเข้ารหัสที่ดีขึ้น)
   

. john-doe {
  background-color : # ff6b6b ;
  color : white;
}

6. เปิด users.json ใน data Directory เพื่ออัปเดตรายละเอียดบัตรของคุณสำหรับการอัปเดต 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 "
  },

วิธีการมีส่วนร่วม

เรายินดีต้อนรับการมีส่วนร่วมจากทุกคน นี่คือขั้นตอนที่จะมีส่วนร่วม:

แยกที่เก็บ

1. คลิกที่ปุ่ม 'fork' ที่มุมบนขวาของหน้าที่เก็บ

โคลนที่เก็บ

2. โคลนที่เก็บข้อมูลของคุณไปยังเครื่องในพื้นที่ของคุณ:

   git clone https://github.com/your-username/contribution-cards.git

สร้างสาขา

3. สร้างสาขาใหม่สำหรับการเปลี่ยนแปลงของคุณ:

   git switch -c " your-branch-name "

ทำการเปลี่ยนแปลงของคุณ

4. ทำการเปลี่ยนแปลงโครงการ ซึ่งอาจรวมถึงการแก้ไขไฟล์ HTML, CSS หรือ JavaScript

กระทำการเปลี่ยนแปลงของคุณ

5. เพิ่มและกระทำการเปลี่ยนแปลงของคุณด้วยข้อความการกระทำที่มีความหมาย:

   git add .
   git commit -m " Add a meaningful commit message "

กดไปที่ gitHub

6. ผลักดันการเปลี่ยนแปลงของคุณไปยังที่เก็บข้อมูลของคุณ:

   git push origin your-branch-name

สร้างคำขอดึง

7. สร้างคำขอดึงจากที่เก็บส้อมของคุณไปยังที่เก็บเดิม คลิกปุ่ม 'ขอดึงใหม่' บนหน้า repository ดั้งเดิมและทำตามคำแนะนำ

โครงสร้างโครงการ

นี่คือภาพรวมโดยย่อของโครงสร้างโครงการ:

 ├── 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

ผู้มีส่วนร่วม

เราขอขอบคุณการมีส่วนร่วมของบุคคลต่อไปนี้: ผู้มีส่วนร่วม

นี่เป็นเพียงจุดเริ่มต้น! ฉันหวังว่าจะได้มีส่วนร่วมที่มีความหมายมากขึ้นและร่วมมือกับชุมชนที่น่าทึ่งนี้ มาสร้างสิ่งที่ยอดเยี่ยมด้วยกันและทำให้ Sticky-Memo ดีที่สุดเท่าที่จะทำได้! ?

ใบอนุญาต

โครงการนี้ได้รับใบอนุญาตภายใต้ใบอนุญาต MIT ดูไฟล์ใบอนุญาตสำหรับรายละเอียด