איך מעלים דף לאוויר בחינם, בלי שרת ובלי כרטיס אשראי

GitHub Pages

איור: AI

למה בחרתי בזה

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

הסיבה שאני אוהבת אותו: הוא חינמי (לדפים שהקוד שלהם פומבי), אין כרטיס אשראי, ואין "תקופת ניסיון" שנגמרת לך בשלישי בלילה. פשוט כותבים דף, והוא חי באינטרנט בכתובת אמיתית.

מה צריך

• חשבון GitHub חינמי
• קובץ HTML (גם דף של שורה אחת נחשב, אני לא שופטת)
• חמש דקות. עשר, אם מתלבטים על שם

שלב 1: ריפו חדש

ריפו (repository) הוא פשוט תיקייה באינטרנט שזוכרת כל שינוי. נכנסים ל-github.com, לוחצים New repository, ובוחרים שם קצר באנגלית - אותיות קטנות, בלי רווחים (למשל my-site). חשוב: לבחור Public. בלי זה Pages החינמי לא יעבוד.

טופס הריפו החדש. שם, ו-Public. זהו. (צילום מסך: GitHub)

שלב 2: הקובץ הראשון

בתוך הריפו: Add file ← Create new file. קוראים לקובץ index.html - בדיוק כך, זה השם ש-GitHub מחפש כדי לדעת מה להציג כדף הבית. מדביקים בפנים את ה-HTML, ולוחצים Commit changes (ככה GitHub מתעד "שמרתי גרסה").

כאן נותנים לקובץ את השם index.html (צילום מסך: GitHub)

הנה דף מינימלי להתחלה:

<!doctype html>
<html lang="he" dir="rtl">
<head><meta charset="utf-8"><title>הדף הראשון שלי</title></head>
<body><h1>שלום, אינטרנט!</h1><p>הדף הזה גר ב-GitHub Pages.</p></body>
</html>

שלב 3: מדליקים את Pages

עכשיו הקסם. נכנסים ל-Settings ← Pages. תחת Source בוחרים Deploy from a branch, אחר כך Branch: main והתיקייה / (root), ולוחצים Save.

בצילום הבא רואים את המסך הזה בפרויקט אמיתי שכבר חי. התפריט שנפתח מציג את שתי האפשרויות; אנחנו, המתחילים, בוחרים בשנייה: "Deploy from a branch" (לפרויקטים גדולים עם שלב בנייה יש את האפשרות הראשונה, GitHub Actions, אבל לדף HTML פשוט היא מיותרת).

התפריט של Source. בוחרים "Deploy from a branch" (צילום מסך: GitHub)

שלב 4: מחכים דקה ומציצים

עכשיו הולכים לעשות קפה. אחרי דקה-שתיים, בראש אותו מסך מופיעה הודעה: "Your site is live at...". בכתובת: https://שם-המשתמש.github.io/שם-הריפו/

הודעת ה"האתר חי". לחיצה על Visit site ואתם באוויר (צילום מסך: GitHub)

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

איור: AI

טיפים קטנים

• אחרי שינוי בקובץ, פרסום מחדש לוקח שוב דקה-שתיים. לא לבהלה אם לא רואים מיד.
• אם מופיע 404: בדקו שהקובץ נקרא בדיוק index.html ושבחרתם Public.
• Pages מיועד לדפים אישיים, פרויקטים ובלוגים - לא לחנויות ולא לעסקים שמוכרים דברים, ולא להכניס אליו סיסמאות או פרטי אשראי.
• רוצים כתובת קצרה בלי שם ריפו? קוראים לריפו שם-המשתמש.github.io.

פסק דין

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

מפת מושגים

• ריפו (Repository) - תיקייה באינטרנט שזוכרת את כל הגרסאות של הקבצים שלכם.
• Public - פומבי; כל אחד יכול לראות את הקבצים. נדרש ל-Pages החינמי.
• Commit - "שמירת גרסה" עם הערה קטנה על מה שהשתנה.
• Branch / main - ענף; main הוא הענף הראשי, "הגרסה הרשמית".
• index.html - שם הקובץ שהאתר מציג כדף הבית.
• GitHub Pages - שירות חינמי של GitHub שהופך קבצים בריפו לאתר חי.
• Deploy - לפרסם; להעביר את הקבצים למקום שבו אנשים יכולים לראות אותם.

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

איור: AI. צילומי מסך: GitHub (שם המשתמש ושם הפרויקט הוחלפו בדוגמה).

הפוסט באנגלית: Put a Web Page Online for Free, No Server, No Credit Card