קלות השימוש ב Github בשילוב עם העובדה שהאחסון ניתן בחינם הפכו את Github לבית של פרויקטי קוד פתוח רבים. היתרון עבורנו המשתמשים שקל מאוד לחברים מהקהילה לשלוח עדכוני תוכנה לפרויקטים קיימים וכך אנו יכולים לעזור לפרויקטים בהם אנו משתמשים. במדריך זה נראה צעד אחר צעד כיצד להכין ולשלוח עדכון לפרויקט המנוהל ב Github.

1. מזלגו את הפרויקט

הצעד הראשון נקרא מיזלוג הפרויקט (fork) שזה בסך הכל אומר להעתיק את הפרויקט לחשבון הגיטהאב שלכם (פתחתם כבר חשבון כן?).  הכפתור מסומן בחץ בצילום המסך הבא מתוך מאגר לדוגמא שנקרא react-toolbox:

2. שכפלו את המאגר לעותק מקומי

העבודה עם פרויקט Git מתחילה בפעולת clone, המביאה את כל הקבצים אליכם ומאפשרת לעדכן את הקוד מתוך אותו כלי בקרת תצורה בו מתנהל הפרויקט. במקרה שלי הפקודה היא:

git clone https://github.com/ynonp/react-toolbox.git

אבל שימו לב שהפרמטר האחרון משתנה לפי הפרויקט ועליכם להעתיק אותו מעמוד הפרויקט (תחת הכותרת HTTP Clone url).

למי שלא מכיר git מומלץ לקרוא קצת איך הכלי עובד למשל מהמדריך כאן:
https://backlogtool.com/git-guide/en/intro/intro1_1.html

פרויקטים רבים (במיוחד בעולם הווב) ידרשו מכם להתקין חבילות נוספות שאינן נשמרות במאגר אחרי השכפול. כל פרויקט ושיטת העבודה שלו. במקרה של react-toolbox נצטרך להתקין את המודולים הרלוונטים של node.js באמצעות הפקודה:

npm install

פרויקטים רבים כוללים גם בדיקות יחידה ואם אתם מזהים מנגנון בדיקה כזה כדאי להריץ אותו לראות שהצלחתם לשכפל והכל עובד. במקרה של react-toolbox אנו מריצים את בדיקות היחידה באמצעות הפקודה:

npm test

 

3. עדכנו את הקוד

עכשיו אפשר לכתוב את הקוד שאתם רוצים לתרום. בשביל להגדיל את הסיכויים שיתייחסו לתרומה שלכם, הקפידו להוסיף בדיקות יחידה רלוונטיות ולתקן את התיעוד היכן שהקוד שלכם סותר מידע קיים.

אם אתם רק רוצים להדגים יצירת Pull Request בשביל להרשים את חבריכם, תמיד אפשר להוסיף בדיקות יחידה. הפרויקט react-toolbox מורכב מהמון רכיבי ריאקט אז בשביל הדוגמא הוספתי לו את הקובץ הבא הכולל בדיקות לרכיב הכפתור:

import expect from 'expect';
import style from '../../button/style';
import utils from '../../utils/testing';
import Button from '../index';

describe('Button', function () {
  let button;

  describe('#render', function () {

    it('uses flat and primary styles by default', function () {
      button = utils.shallowRenderComponent(Button);

      expect(button.props.className).toContain(style.flat);
      expect(button.props.className).toContain(style.primary);
    });

    it('renders accent button with accent style', function () {
      button = utils.shallowRenderComponent(Button, { accent: true });
      var expectedClassName = `${style.flat} ${style.accent}`;

      expect(button.props.className).toContain(style.flat);
      expect(button.props.className).toContain(style.accent);
    });

    it('1 renders mini button with mini style', function () {
      button = utils.shallowRenderComponent(Button, { mini: true });

      expect(button.props.className).toContain(style.flat);
      expect(button.props.className).toContain(style.primary);
      expect(button.props.className).toContain(style.mini);
    });

    it('renders mini accented button with both styles', function () {
      button = utils.shallowRenderComponent(Button, { mini: true, accent: true });

      expect(button.props.className).toContain(style.flat);
      expect(button.props.className).toContain(style.accent);
      expect(button.props.className).toContain(style.mini);
    });

  });
});

את הקוד יש לשמור במאגר שלכם באמצעות commit ו push:

git add .
git commit
git push

 

4. צרו בקשת משיכה

בצד ימין של עמוד הפרויקט בגיטהאב יש קישור למסך Pull Requests. הכנסו למסך זה בדף הפרויקט שמיזלגתם (כלומר זה ששמור בשם המשתמש שלכם) ובחרו New Pull Request כפי שמתואר בצילום המסך הבא:

מלאו בתיבות את הפרטים וספרו מה שיניתם. לאחר מכן גיטהאב יעדכן אתכם במייל כשיהיו תגובות חדשות או כשהבקשה שלכם תשולב בתוך הפרויקט.

מכאן והלאה כל commit נוסף שתבצעו ייכנס אוטומטית לבקשת המשיכה, כך שאם אתם מקבלים הערות או הצעות לשיפור הקוד שלכם פשוט תקנו את מה שצריך, עדכנו ונסו שוב.

בקשות משיכה הן דרך מאוד פשוטה ויעילה לשלוח תיקוני קוד ותוספות לפרויקטים קיימים, לקחת חלק בפרויקטי קוד פתוח שאכפת לנו מהם ולהשפיע על הכיוון של פרויקטים אלו. כבונוס כל השינויים שהגשתם לפרויקטים נשמרים לכם במרוכז בחשבון Github שלכם, מה שמחזק את הפרופיל הרשתי שלכם. עכשיו תורכם לנסות: חפשו פרויקט, מזלגו, עדכנו, שילחו בקשת משיכה ושתפו בתגובות קישור לבקשת המשיכה שיצרתם. זה הקישור שלי:
https://github.com/react-toolbox/react-toolbox/pull/55