כיצד לבנות הרחבה לפיירפוקס

מאז שהתחלנומשחרר בַּיִת-מבושל פיירפוקס הרחבותכאן ב-Lifehacker, כמה קוראים שאלו:כמה קשה לבנות תוסף פיירפוקס?עבור מישהו עם קצת ניסיון בתכנות, התשובה היאלא כל כך קשה.

הבשר של תוסף פיירפוקס הוא פשוט Javascript - החומר הלא מאוד מסתורי של סימניות ודפי אינטרנט ישנים רגילים - ושפת סימון שנקראתלִבחוֹר(מבוטא "זאול") כדי לבנות בעצמך, תצטרך קצת ידע ב-Javascript, עריכת קבצי XML נוחה וסקרנות בריאה לגבי כיפוף דפדפן האינטרנט האהוב עליך לרצונך.

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

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

הגדר את סביבת הפיתוח שלך

דבר ראשון: אתה הולך לפתח תוסף לפיירפוקס? באיזשהו רגע מצער, אתה הולך לשטוף לחלוטין את פרופיל Firefox שלך. זו לא אפשרות, זו ערובה. אז עשו לעצמכם טובה, וצרו פרופיל Firefox חדש שבו אתם משתמשים אך ורק לפיתוח.הנה איך ליצור ולנהלמספר פרופילים של Firefox. אני נהנה שפרופיל ברירת המחדל שלי פועל לצורך חיפושי הפניות מהירים של קוד, ולהפעיל את פרופיל ה-"dev" שלי בו-זמנית באמצעות המתג -no-remote המפורט ב-המאמר הזה.

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

שלום, עולם ההרחבות של Firefox!

עוד בדצמבר 2004, במהלך גלישה חסרת מחשבה באינטרנט, נתקלתי במצוין של אריק חמיטר.כיצד ליצור הרחבות Firefoxמדריך וזה היה הקישור היחיד שהביא אותי לדרך לפיתוח הרחבה. המדריך מעט מיושן (במיוחד מאז פיירפוקס 2), אבל הוא השלמה נחמדה לרשמי של Mozilla Developer Centerבניית הרחבהמִסְמָך.

בצע את ההוראות - הכוללות הרבה הצבת קבצי XML ו-Javascript ספציפיים בתיקיות ספציפיות וריחוסם בדיוק בצורה הנכונה - אתה יכול לבנות הרחבה פשוטה שמקפיצה "שלום, עולם!" התראת Javascript. עשה זאת - כל מתכנת מתחיל שפה חדשה באמירת שלום לעולם.

לעזרה נוספת של Hello World, ראהתחילת העבודה של MozillaZine עם פיתוח הרחבות. שלל אחריםמדריכים לפיתוח תוספים זמינים כאן.

אשף ההרחבה

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

המהדר של Greasemonkey

עוזר הרחבות נוסף בצורה קוסמת הוא העזר שפורסם בעברמהדר סקריפטים למשתמש של Greasemonkey.סקריפט של Greasemonkey הוא רק Javascript; והמהדר הזה הופך את הסקריפט הזה להרחבה מלאה. (הערה: הGmail טוב יותרהרחבה וכל האחים הצעירים שלה שפורסמו כאן ב-Lifehacker התחילו להשתמש בקומפיילר זה.)

WTF, בחירה?

אחת מעקומות הלמידה התלולות של פיתוח הרחבות היא להסתכל על XUL, וכיצד היא יוצרת אלמנטים כמו פריטי תפריט ותיבות דו-שיח בפיירפוקס. תחשוב על זה כך: XUL יוצר ממשקי Firefox כמו HTML יוצר דפי אינטרנט. (אבל בהיותו XML, ל-XUL יש כללים מחמירים הרבה יותר לגבי התגים המותרים).

לדוגמה, חלון פשוט מבוסס XUL עם לחצני בחירה לתפוחים, תפוזים ודובדבנים נראה כך ב-XUL:

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

לבסוף, ההתייחסות המלאה ומאגר האם של מדריכי XUL זמינים בכתובתXUL Planet.

הפוך את בניית התוספים שלך לאוטומטיים

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

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

אתה מוכן לנסות למפתחי הרחבה? ספר לנו איך זה הולך בתגובות.