לא צריך לדעת HTML, CSS או JavaScript. מתארים מה רוצים ו-Claude Code בונה את הכל.
2
איטרציה בזמן אמת
לא אהבתם משהו? אומרים ל-Claude מה לשנות והוא מעדכן מיד. צבעים, פריסה, תוכן — הכל.
3
רספונסיבי אוטומטית
מבקשים רספונסיביות ו-Claude מוודא שהאתר עובד על מחשב, טאבלט ופלאפון.
4
פרסום חינמי
GitHub Pages, Vercel, Netlify — אפשר לפרסם אתר בחינם ולהגיע אליו מכל מקום.
🧠
בדקו את עצמכם
1משלוש שכבות של אתר (HTML, CSS, JavaScript), מה תפקיד ה-CSS?
תוכן — טקסטים, תמונות, כפתורים
עיצוב — צבעים, פונטים, פריסה
התנהגות — מה קורה בלחיצה על כפתור
2מה הכוונה ב"רספונסיביות" של אתר?
שהאתר נטען מהר
שהאתר מתאים את עצמו לכל גודל מסך
שהאתר עונה לשאלות של משתמשים
3מה הגישה המומלצת לבניית אתר עם Claude Code?
לתת פרומפט ענק אחד עם כל הפרטים
ללמוד HTML ואז לבקש עזרה
להתחיל פשוט ולשפר בהדרגה (איטרציה)
4איזה שירות מאפשר לפרסם אתר סטטי בחינם?
רק שרת בתשלום
GitHub Pages, Vercel, או Netlify
רק דרך Google Workspace
תשובות נכונות מתוך 4
✍️
תרגול — העתיקו ונסו ב-Claude Code
תרחיש: בניית פורטפוליו אישי
בנה לי אתר פורטפוליו אישי. שם: [השם שלך]. תפקיד: [מה שאתה עושה]. צבעים: כחול כהה ולבן. סקשנים: אודות, פרויקטים (3 כרטיסים עם תיאור), צור קשר עם טופס. עיצוב מודרני ונקי, רספונסיבי, עם אנימציות חלקות בגלילה.
תרחיש: דף נחיתה לעסק
בנה דף נחיתה לעסק בשם [שם העסק]. השירות: [תיאור קצר]. כולל: Hero section עם כותרת גדולה וכפתור CTA, 3 תכונות מרכזיות עם אייקונים, סקשן המלצות לקוחות, טבלת תמחור עם 3 מסלולים, ופוטר. עיצוב כהה ומקצועי. רספונסיבי.
תרחיש: קורות חיים אונליין
בנה אתר קורות חיים אונליין. השם שלי: [שם]. תפקיד: [תפקיד]. כולל: תמונת פרופיל (placeholder), ניסיון מקצועי (timeline), כישורים (progress bars), השכלה, ואפשרות להורדת CV כקובץ. עיצוב אלגנטי ומינימליסטי. רספונסיבי.
תרחיש: שיפור אתר קיים
תשפר את האתר שבנינו: 1) תחליף את הצבע הראשי לירוק (#10B981). 2) תוסיף אנימציית fade-in לכל סקשן בגלילה. 3) תוסיף כפתור "חזרה למעלה" שמופיע אחרי גלילה. 4) תוודא שהתפריט הופך ל-hamburger menu בנייד.
