איך לבנות אתר עם קלוד קוד (Claude Code) ב-2026 — שרת, מיילים, דאטהבייס והכול

כן, אפשר לבנות ב-2026 אתר אמיתי ומקצועי — עם דומיין, דאטהבייס, טפסים, מיילים אוטומטיים ואבטחה — באמצעות קלוד קוד (Claude Code) בלבד, גם בלי רקע בתכנות. הסטאק המנצח: Next.js כפריימוורק, ורסל (Vercel) לאחסון ופריסה, סופאבייס (Supabase) לדאטהבייס, Resend או Amazon SES למיילים, וקלאודפלר (Cloudflare) לדומיין ו-DNS. העלות החודשית להתחלה: אפס שקלים (חוץ מהדומיין ומנוי Claude). המדריך הזה עובר על כל שלב — כולל הפקודות והפרומפטים המדויקים.

בקצרה TL;DR

• הכלי: קלוד קוד (Claude Code) — סוכן AI שרץ בטרמינל וכותב, מריץ ופורס קוד בעצמו.
• הסטאק: Next.js (App Router) + Vercel + Supabase + Resend/SES + Cloudflare.
• עלות התחלה: 0 ₪ לתשתית. משלמים רק על דומיין (כ-10–15 דולר לשנה) ועל מנוי Claude.
• זמן לאתר חי ראשון: שעה אחת מרגע שהסביבה מוכנה.
• דאטהבייס: Supabase נותן Postgres מלא בחינם — ולפעמים מספיק אפילו Storage bucket עם קבצי JSON.
• מיילים: Resend לשלב הראשון (3,000 בחודש חינם), Amazon SES כשגדלים (זול פי 20 בערך).
• מיילים נכנסים: Cloudflare Email Routing מעביר את office@yourdomain.com לג'ימייל — בחינם.
• החוק החשוב ביותר: מפתחות סודיים (Service Keys) חיים רק בשרת, לעולם לא בדפדפן.

למה 2026 היא נקודת המפנה: עידן ה-Vibe Coding

התשובה הקצרה: ב-2026 המחסום האחרון בין "יש לי רעיון לאתר" ל"יש לי אתר חי" הוא כבר לא ידע טכני — אלא היכולת לנסח מה אתם רוצים. זה מה שנקרא Vibe Coding.

מה זה Vibe Coding? גישת פיתוח שבה האדם מתאר בשפה חופשית מה הוא רוצה שיקרה, וסוכן AI כותב, מריץ, בודק ומתקן את הקוד בעצמו. האדם מנהל את הכיוון והטעם ("הווייב") — המכונה מבצעת.

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

המספרים מספרים את הסיפור: לפי סקר המפתחים של Stack Overflow לשנת 2025, כ-84% מהמפתחים כבר משתמשים בכלי AI או מתכננים להשתמש בהם. וזה רק בקרב מפתחים מקצועיים — הגל האמיתי הוא דווקא האנשים שמעולם לא כתבו שורת קוד ועכשיו בונים מוצרים שלמים.

מה השתנה בפועל?

• הסוכן רואה הכול. קלוד קוד לא עובד על קטע קוד בודד — הוא מכיר את כל הפרויקט, קורא כל קובץ, ומבין את ההקשר.
• הסוכן מריץ בעצמו. הוא לא רק מציע קוד; הוא מריץ את הפקודות, רואה את השגיאות, ומתקן.
• התשתיות נהיו חינמיות. Vercel, Supabase, Cloudflare ו-Resend — כולם עם שכבת חינם נדיבה שמספיקה לאתר אמיתי עם תנועה אמיתית.

אם אתם חדשים לגמרי בעולם הזה, מומלץ לקרוא קודם את המדריך לקלוד קוד למתחילים — ואז לחזור לכאן. ואם מעניין אתכם איך הגישה הזאת משנה גם את עולם קידום האתרים, יש לנו מדריך שלם על Vibe Coding ו-SEO.

שלב 1: הכנת הסביבה — התקנת קלוד קוד

התשובה הקצרה: צריך שלושה דברים בלבד — טרמינל, Node.js ומנוי Claude. ההתקנה כולה לוקחת פחות מעשר דקות.

מה זה טרמינל? חלון טקסטואלי שבו מקלידים פקודות למחשב במקום ללחוץ על כפתורים. במק הוא נקרא Terminal, בווינדוס מומלץ PowerShell או WSL. אל תפחדו ממנו — בפועל תקלידו בו בעיקר משפטים בעברית לקלוד.

הנה הצעדים, אחד-אחד:

1. פתחו טרמינל. במק: חיפוש Spotlight ← הקלידו Terminal. בווינדוס: התקינו WSL (תת-מערכת לינוקס) או השתמשו ב-PowerShell.
2. התקינו Node.js (סביבת ההרצה של JavaScript) מהאתר הרשמי nodejs.org — גרסת LTS. בדקו שהכול תקין עם הפקודה:

node --version

3. התקינו את קלוד קוד:

npm install -g @anthropic-ai/claude-code

4. הריצו אותו והתחברו:

claude

בהרצה הראשונה קלוד יבקש להתחבר לחשבון Claude שלכם. נדרש מנוי בתשלום (Pro ומעלה) — זו ההוצאה המשמעותית היחידה בכל המדריך הזה, והיא מחליפה בפועל מפתח, ולפעמים צוות שלם.

5. בדיקה ראשונה. בתוך קלוד קוד, כתבו בעברית פשוטה:

צור לי תיקייה חדשה בשם my-website ותסביר לי מה אתה מתכנן לעשות בה

אם קיבלתם תשובה קוהרנטית ותיקייה חדשה — אתם מוכנים.

כמה טיפים לעבודה נכונה מהיום הראשון:

• דברו עברית חופשי. קלוד קוד מבין עברית מצוין. אין צורך "לדבר טכני".
• אשרו פעולות בהתחלה. קלוד מבקש אישור לפני פעולות מסוכנות. בשבוע הראשון — קראו מה הוא מבקש לפני שאתם מאשרים. ככה לומדים.
• קובץ CLAUDE.md הוא הזיכרון של הפרויקט. בהמשך תבקשו מקלוד לכתוב שם את הכללים הקבועים שלכם ("כל הטקסטים באתר בעברית", "תמיד RTL"), והוא יקרא אותם בכל שיחה חדשה.

שלב 2: פרויקט Next.js ופריסה ראשונה ל-Vercel תוך שעה

התשובה הקצרה: מקימים פרויקט Next.js בפקודה אחת, מחברים אותו ל-GitHub, ופורסים ל-Vercel — ותוך שעה יש לכם כתובת אינטרנט חיה עם האתר שלכם.

מה זה Next.js? פריימוורק (מסגרת עבודה) לבניית אתרים מעל React, שנחשב לסטנדרט בתעשייה. הוא נותן "בחינם" דברים שפעם דרשו שבועות: ניתוב בין דפים, רינדור בצד השרת (קריטי ל-SEO), אופטימיזציית תמונות ו-API מובנה.

מה זה Vercel? פלטפורמת אחסון ופריסה שנבנתה על ידי יוצרי Next.js. כל פעם שאתם דוחפים קוד ל-GitHub — ורסל בונה ופורסת את האתר אוטומטית, עם תעודת SSL ורשת CDN עולמית. תוכנית Hobby שלה חינמית לפרויקטים אישיים.

הנה תהליך העבודה המלא:

1. צרו את הפרויקט. אפשר ידנית עם הפקודה:

npx create-next-app@latest my-website --typescript --tailwind --app

או פשוט לבקש מקלוד קוד: "הקם לי פרויקט Next.js חדש עם App Router, TypeScript ו-Tailwind, מותאם לעברית RTL". הוא יריץ את הפקודה, יענה על השאלות של האשף, ויגדיר את כיוון הטקסט.

2. הריצו מקומית. קלוד יריץ עבורכם:

npm run dev

ותקבלו את האתר בכתובת localhost:3000 בדפדפן. כל שינוי שקלוד עושה — מופיע מיד.

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

4. חברו ל-GitHub. בקשו מקלוד: "צור ריפוזיטורי גיט, עשה קומיט ראשון והעלה ל-GitHub". אם עדיין אין לכם חשבון GitHub — פתחו (חינם), והתקינו את הכלי gh לפי ההנחיות שקלוד ייתן.

5. פרסו ל-Vercel. שתי דרכים:

   • דרך הדפדפן: vercel.com ← New Project ← בחרו את הריפו מ-GitHub ← Deploy. זהו.
   • דרך הטרמינל: התקינו את ה-CLI ופרסו:

npm install -g vercel
vercel --prod

6. קבלו כתובת חיה. בסיום תקבלו כתובת בסגנון my-website.vercel.app — האתר שלכם חי באינטרנט, עם HTTPS, מהיום הראשון.

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

שלב 3: דומיין ו-DNS בקלאודפלר

התשובה הקצרה: קונים דומיין, מנהלים אותו בקלאודפלר (Cloudflare), ומחברים אותו ל-Vercel עם שתי רשומות DNS. כל התהליך — פחות מחצי שעה, רובו המתנה.

מה זה DNS? ספר הטלפונים של האינטרנט. כשמישהו מקליד yourdomain.com, מערכת ה-DNS מתרגמת את השם לכתובת השרת שבו יושב האתר. "רשומת DNS" היא שורה אחת בספר הטלפונים הזה.

למה דווקא קלאודפלר לניהול ה-DNS? שלוש סיבות:

• מחירי עלות על דומיינים. קלאודפלר מוכרת דומיינים במחיר הרישום ללא עמלה — בדרך כלל 10–15 דולר לשנה לדומיין com.
• DNS מהיר וחינמי עם ממשק נוח שקלוד קוד מכיר היטב ויכול להדריך אתכם בו צעד-צעד.
• Email Routing חינמי — נגיע אליו בפרק המיילים. זה פיצ'ר ששווה לבד את כל המעבר.

וזו לא בחירה נישתית: לפי נתוני W3Techs, קרוב ל-20% מכלל האתרים בעולם משתמשים בשירותי Cloudflare.

התהליך:

1. פתחו חשבון ב-cloudflare.com (חינם).
2. קנו דומיין דרך Domain Registration, או העבירו דומיין קיים (Transfer). אם הדומיין נקנה במקום אחר (GoDaddy וכו') — אפשר גם רק להעביר את ניהול ה-DNS לקלאודפלר על ידי החלפת ה-Nameservers.
3. חברו ל-Vercel. בפרויקט ב-Vercel: Settings ← Domains ← הוסיפו את yourdomain.com. ורסל תציג לכם בדיוק אילו רשומות להוסיף — בדרך כלל רשומת A לדומיין הראשי ורשומת CNAME ל-www.
4. הוסיפו את הרשומות בקלאודפלר: DNS ← Records ← Add record. העתיקו את הערכים מ-Vercel אחד-לאחד.
5. שימו לב למתג הענן הכתום. ברשומות שמפנות ל-Vercel מומלץ לכבות את ה-Proxy (ענן אפור, DNS only) — ורסל כבר מספקת CDN משלה, וכפל שכבות עלול לגרום לבעיות בתעודת ה-SSL.
6. המתינו. בדרך כלל תוך דקות (ולעיתים עד שעות בודדות) yourdomain.com יציג את האתר, כולל HTTPS אוטומטי.

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

שלב 4: דאטהבייס עם Supabase — טבלאות, Storage, ומתי מספיק JSON

התשובה הקצרה: סופאבייס (Supabase) נותנת דאטהבייס Postgres אמיתי, אחסון קבצים ומערכת התחברות — הכול בחינם בשלב הראשון. ולסוד קטן מהשטח: להרבה צרכים לא צריך בכלל טבלאות — מספיק bucket עם קבצי JSON.

מה זה Supabase? פלטפורמת "בקאנד כשירות" בקוד פתוח: דאטהבייס PostgreSQL מנוהל, אחסון קבצים (Storage), הרשאות והתחברות משתמשים (Auth) — עם ממשק גרפי נוח ו-API מוכן. החלופה המודרנית להקים שרת דאטהבייס לבד.

מקימים כך:

1. פתחו חשבון ב-supabase.com וצרו פרויקט חדש (בחרו region קרוב — eu-central מתאים לישראל).
2. העתיקו שלושה ערכים מ-Settings ← API: כתובת הפרויקט (Project URL), המפתח הציבורי (anon key) והמפתח הסודי (service_role key).
3. שמרו אותם כמשתני סביבה — בקובץ .env.local בפיתוח, וב-Vercel תחת Settings ← Environment Variables בפרודקשן:

NEXT_PUBLIC_SUPABASE_URL=https://xxxx.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJ...
SUPABASE_SERVICE_ROLE_KEY=eyJ...

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

4. בקשו מקלוד קוד להתקין את הספרייה ולחבר:

npm install @supabase/supabase-js

מתי טבלאות ומתי Storage? זו ההחלטה הארכיטקטונית החשובה בפרק הזה:

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

מניסיוננו בבניית אתרים אמיתיים בשיטה הזו: bucket של JSON מכסה חלק מפתיע מהצרכים של אתר עסקי — כל פנייה נשמרת כקובץ inquiry-123.json, נקראת בלוח הניהול, בלי סכמות, בלי מיגרציות, בלי כאב ראש. כשהאתר גדל ומתחילים לשאול שאלות מורכבות על הנתונים — מעבירים לטבלה. אל תבנו קתדרלה כשצריך סוכת גינה.

ומה לגבי התחברות משתמשים? Supabase Auth נותן הרשמה, התחברות, קוד חד-פעמי במייל (OTP) ו-Google OAuth — מוכנים מהקופסה. בקשו מקלוד "הוסף התחברות עם קוד למייל באמצעות Supabase Auth" והוא יבנה את כל הזרימה.

מגבלות שכבת החינם (נכון לכתיבת שורות אלה): דאטהבייס עד 500MB ואחסון קבצים עד 1GB — הרבה מעבר למה שאתר עסקי מתחיל צורך. רק שימו לב שבתוכנית החינם פרויקט לא פעיל מושהה אחרי שבוע — כניסה ללוח הבקרה מעירה אותו.

שלב 5: טפסים ולידים — ה-API Route הראשון שלכם

התשובה הקצרה: טופס יצירת קשר הוא צומת של כל מה שלמדנו — הדפדפן שולח נתונים ל-API Route בשרת, השרת מוודא (ולידציה), שומר ב-Supabase ושולח מייל. וקלוד קוד בונה את כל השרשרת בפרומפט אחד.

מה זה API Route? קובץ בפרויקט Next.js (למשל app/api/contact/route.ts) שרץ בשרת, לא בדפדפן. זה המקום היחיד שבו מותר להשתמש במפתחות סודיים, לכתוב לדאטהבייס ולשלוח מיילים.

הארכיטקטורה הנכונה, בחמישה צעדים:

1. קומפוננטת טופס בדף — שם, טלפון, אימייל, הודעה. עם מצבי טעינה ("שולח..."), הצלחה ושגיאה. חוויית משתמש היא לא קישוט — טופס שלא מגיב זה ליד שאבד.
2. שליחה ל-API Route — הטופס שולח POST ל-/api/contact עם הנתונים כ-JSON.
3. ולידציה בשרת. לעולם לא סומכים על הדפדפן. בשרת בודקים: האם יש שם? האם האימייל תקין? האם הטלפון בפורמט ישראלי סביר? ספריית zod עושה את זה אלגנטית, וקלוד קוד שולף אותה כברירת מחדל.
4. שמירה. הפנייה נכתבת ל-Supabase — טבלת inquiries או קובץ JSON ב-bucket, כמו שראינו בפרק הקודם.
5. התראה. מייל אליכם ("ליד חדש באתר!") ומייל אישור ללקוח ("קיבלנו את פנייתך"). על זה — בפרק הבא.

שתי תוספות שכדאי לבקש מקלוד כבר בגרסה הראשונה:

• שדה דבש (Honeypot): שדה נסתר בטופס שבני אדם לא רואים ובוטים ממלאים. אם הוא מלא — זורקים את הפנייה. מסנן את רוב הספאם בלי לייסר משתמשים אמיתיים עם CAPTCHA.
• שמירת מקור הליד: מאיזה עמוד הגיעה הפנייה, ומאילו פרמטרי UTM. אתם תודו לעצמכם כשתתחילו לפרסם ותרצו לדעת איזה קמפיין באמת עובד.

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

שלב 6: מיילים — Resend לשליחה, אימות דומיין, ו-SES כשגדלים

התשובה הקצרה: מתחילים עם Resend (פשוט להפליא, 3,000 מיילים בחודש בחינם), מאמתים את הדומיין עם רשומות DKIM ו-SPF, שולחים מתת-דומיין ייעודי — וכשהנפחים גדלים עוברים ל-Amazon SES, שעולה בערך פי 20 פחות. מיילים נכנסים? Cloudflare Email Routing מעביר אותם לג'ימייל בחינם.

זה הפרק שבו הכי הרבה אתרים חדשים נופלים, אז נפרק אותו לשלושה חלקים.

שליחת מיילים עם Resend

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

1. פתחו חשבון ב-resend.com (חינם — עד 3,000 מיילים בחודש, 100 ביום).
2. צרו API Key ושמרו אותו כמשתנה סביבה RESEND_API_KEY (בלי NEXT_PUBLIC_!).
3. בקשו מקלוד לחבר: npm install resend ושליחה מתוך ה-API Route של הטופס.

אימות דומיין — DKIM ו-SPF

מה זה SPF ו-DKIM? שתי "תעודות זהות" של דומיין בעולם המייל. SPF מצהיר אילו שרתים מורשים לשלוח מייל בשם הדומיין שלכם; DKIM חותם כל מייל בחתימה דיגיטלית שמוכיחה שהוא לא זויף. בלעדיהן — ג'ימייל ואאוטלוק יזרקו אתכם לספאם כמעט בוודאות.

התהליך פשוט ממה שהוא נשמע:

1. ב-Resend: Domains ← Add Domain.
2. הוסיפו תת-דומיין שליחה, לא את הדומיין הראשי — למשל mail.yourdomain.com. למה? כי מוניטין שליחה נצבר לפי דומיין. אם יום אחד קמפיין שיווקי יקבל תלונות ספאם — ייפגע רק תת-הדומיין, והמייל האישי שלכם על הדומיין הראשי יישאר נקי.
3. Resend יציג 3–4 רשומות DNS (TXT ו-MX). העתיקו אותן לקלאודפלר, רשומה-רשומה. גם כאן — צילום מסך לקלוד קוד והוא ילווה אתכם.
4. המתינו לסטטוס Verified (דקות עד שעות).

מעכשיו אתם שולחים מ-noreply@mail.yourdomain.com או hello@mail.yourdomain.com — מאומתים ומכובדים.

עוד שני כללים מניסיוננו: התחילו בנפחים קטנים (אל תשלחו ביום הראשון 5,000 מיילים מדומיין צעיר — חממו אותו בהדרגה), ותמיד שלחו לעצמכם מייל בדיקה לפני כל תפוצה.

Amazon SES — כשגדלים

כשהניוזלטר עובר כמה אלפי נמענים, הכלכלה משתנה. Amazon SES (Simple Email Service) — שירות המיילים של אמזון — גובה $0.10 לכל 1,000 מיילים. לשם השוואה, תוכניות בתשלום של שירותי מייל ידידותיים מתחילות בדרך כלל בעשרות דולרים בחודש לאותם נפחים — פער של בערך פי 20 לטובת SES.

המחיר של הזול: SES פחות ידידותי. נדרש אימות דומיין דומה (DKIM/SPF דרך ה-Console של AWS), ובעיקר — חשבון חדש מתחיל ב-Sandbox ומחייב בקשת production access קצרה שבה מסבירים לאמזון מה שולחים ולמי. האסטרטגיה החכמה: לבנות את הקוד עם שכבת שליחה אחת מופשטת ("mailer"), כך שמעבר מ-Resend ל-SES הוא החלפת משתנה סביבה אחד ולא שכתוב.

אגב, אם היעד שלכם הוא ניוזלטר של ממש — כתבנו מדריך ייעודי על בניית מערכת ניוזלטר עם Vercel, Supabase ו-Resend.

מיילים נכנסים — Cloudflare Email Routing

ומה כשמישהו שולח מייל אל office@yourdomain.com? לא צריך לקנות תיבת מייל עסקית. Cloudflare Email Routing — חינמי לגמרי — מעביר כל מייל שנשלח לדומיין שלכם לתיבת הג'ימייל הקיימת:

1. בקלאודפלר: בחרו את הדומיין ← Email ← Email Routing ← Enable.
2. צרו כתובת (למשל office@yourdomain.com) והפנו אותה לג'ימייל שלכם. אפשר גם Catch-all — כל כתובת שהיא על הדומיין תגיע אליכם.
3. אשרו את המייל שקלאודפלר שולחת לתיבת היעד.
4. קלאודפלר תוסיף לבד את רשומות ה-MX הנדרשות.

התוצאה: כתובת מייל עסקית מקצועית, אפס עלות, והכול זורם לתיבה שאתם כבר בודקים ממילא. (רוצים גם לענות מהכתובת הזו? בג'ימייל מגדירים "Send mail as" עם שרת ה-SMTP של Resend או SES.)

שלב 7: SEO ו-GEO מהיום הראשון

התשובה הקצרה: אתר שנבנה עם Next.js מתחיל עם יתרון SEO מובנה (רינדור בשרת, מהירות) — אבל צריך לבקש מקלוד קוד במפורש ארבעה דברים: metadata לכל עמוד, sitemap, סכמות מובנות (Schema), ותוכן שבנוי גם למנועי תשובות AI — מה שנקרא GEO.

מה זה GEO? Generative Engine Optimization — אופטימיזציה למנועי חיפוש גנרטיביים. אם SEO שואל "איך גוגל ידרג אותי", GEO שואל "איך ChatGPT, Claude ו-Perplexity יצטטו אותי כשמישהו שואל אותם שאלה בתחום שלי". ב-2026 זה כבר לא נחמד-שיהיה — זה מקור תנועה ולידים אמיתי.

הצ'ק-ליסט שכדאי לתת לקלוד קוד מילה במילה:

1. Metadata לכל עמוד. ב-App Router של Next.js כל עמוד מייצא אובייקט metadata — title ייחודי (עד ~60 תווים), description משכנע (עד ~155 תווים), ותגיות Open Graph לשיתוף יפה ברשתות.
2. sitemap.xml ו-robots.txt. ל-Next.js יש תמיכה מובנית — קובץ sitemap.ts שמייצר את המפה אוטומטית מכל העמודים. אחרי הפריסה, הגישו את ה-sitemap ב-Google Search Console.
3. נתונים מובנים (Schema.org). JSON-LD בכל עמוד רלוונטי: Organization ו-LocalBusiness בדף הבית, Article במאמרים, FAQPage בעמודי שאלות, Service בעמודי שירות. זו השפה שגם גוגל וגם מנועי ה-AI קוראים.
4. מהירות. Next.js על Vercel נותן בסיס מצוין, אבל בקשו מקלוד לשמור על הכללים: קומפוננטת next/image לכל תמונה (לעולם לא תגית img רגילה), גופנים דרך next/font, ומינימום JavaScript צד-לקוח. מדדו עם PageSpeed Insights של גוגל ושאפו לציון ירוק במובייל.
5. מבנה תוכן ידידותי ל-AI. תשובה ישירה בפתיחת כל עמוד, כותרות היררכיות, שאלות-ותשובות, ועובדות עם מקורות. מנועי תשובות מצטטים תוכן שקל לחלץ ממנו תשובה.

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

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

שלב 8: אוטומציות עם Vercel Crons

התשובה הקצרה: Vercel Cron Jobs מריצים קוד שלכם לפי לוח זמנים — דוח יומי, תזכורות, ניקוי נתונים — בלי שרת, בלי מחשב דולק, בהגדרה של חמש שורות.

מה זה Cron? מנגנון תזמון ותיק מעולם היוניקס: "הרץ את המשימה הזאת כל יום ב-06:00". ב-Vercel, cron הוא פשוט API Route רגיל שהפלטפורמה קוראת לו אוטומטית לפי לוח הזמנים שהגדרתם.

ההגדרה כולה יושבת בקובץ vercel.json בשורש הפרויקט:

{
  "crons": [
    { "path": "/api/cron/daily-report", "schedule": "0 6 * * *" }
  ]
}

חמשת השדות של ה-schedule הם דקה, שעה, יום בחודש, חודש ויום בשבוע — אבל אל תשננו: תגידו לקלוד "כל יום ב-8 בערב שעון ישראל" והוא יכתוב את הביטוי הנכון (וגם יזכיר לכם ש-Vercel עובדת לפי UTC, כלומר ישראל פחות שעתיים-שלוש).

דוגמאות לאוטומציות שאתר עסקי אמיתי מרוויח מהן מהחודש הראשון:

1. דוח יומי — כמה מבקרים, כמה לידים, כמה הרשמות — נשלח אליכם במייל או בוואטסאפ כל ערב.
2. תזכורות ללקוחות — יום לפני פגישה שנקבעה דרך האתר.
3. החזרת עגלות נטושות — מייל עדין למי שהתחיל תהליך ולא סיים.
4. תחזוקה שקטה — ניקוי רשומות ישנות, חידוש קאש, בדיקת תקינות.

ואבטחה, כי cron הוא דלת חיצונית: כל cron route חייב לבדוק סוד. Vercel שולחת כותרת Authorization עם ערך משתנה הסביבה CRON_SECRET — ה-route מוודא אותה ודוחה כל קריאה אחרת. אחרת כל מי שניחש את הכתובת יכול להריץ לכם את הדוח (או גרוע מזה). בקשו מקלוד להוסיף את הבדיקה — זה חמש שורות.

מגבלה שכדאי להכיר: בתוכנית Hobby ה-crons מוגבלים במספר ובתדירות (ריצות יומיות), ובזמן ריצה של פונקציות. לתדירות גבוהה יותר צריך Pro — או טריק ותיק: שירות חינמי כמו cron-job.org שקורא ל-route שלכם כל שעה, עם אותו סוד בדיוק.

שלב 9: אבטחה בסיסית — שלושת הכללים שאסור לעבור עליהם

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

בואו נפרק:

1. סודות במשתני סביבה בלבד. אף API key לא נכתב בתוך הקוד. הכול ב-.env.local (שחייב להופיע ב-.gitignore — קלוד עושה זאת כברירת מחדל) וב-Environment Variables של Vercel. למה זה קריטי? כי הקוד שלכם יושב ב-GitHub, וסורקים אוטומטיים של תוקפים מוצאים מפתחות חשופים ברפוזיטוריז תוך דקות. אם בטעות דחפתם סוד לגיט — החליפו אותו (rotate) מיד; מחיקה מההיסטוריה לא מספיקה.

2. Service keys רק בשרת. נחזור על ההבחנה כי היא לב העניין: ב-Next.js, משתנה עם קידומת NEXT_PUBLIC_ נארז לתוך הקוד שנשלח לכל דפדפן — כלומר הוא ציבורי בהגדרה. המפתח האנונימי של Supabase בנוי לזה; מפתח ה-service_role, שעוקף את כל מנגנוני ההרשאה, חייב לחיות רק ב-API Routes. אותו כלל חל על מפתח Resend, סודות של ספקי תשלום, וכל token ניהולי. מבחן פשוט לתת לקלוד: "עבור על הפרויקט וודא שאף סוד לא נגיש מצד הלקוח".

3. הגבלת קצב (Rate Limiting). טופס בלי הגבלה הוא הזמנה לבוטים: אלפי פניות זבל, ניפוח הדאטהבייס, ושריפת מכסת המיילים החינמית שלכם ביום אחד. הפתרון המדורג: honeypot (כבר עשינו), הגבלת בקשות לפי IP בחלון זמן (ספריות מוכנות כמו Upstash Ratelimit עובדות מצוין על Vercel), וולידציה קפדנית בשרת.

ובונוס — שני הרגלים של מבוגרים אחראיים:

• בדיקת אבטחה תקופתית עם קלוד עצמו: "סרוק את הפרויקט ואתר בעיות אבטחה: סודות חשופים, routes בלי הרשאות, קלט לא מסונן". קלוד קוד מפתיע לטובה בביקורות כאלה.
• גיבויים: Supabase שומרת גיבויים בתוכניות בתשלום; בתוכנית חינם — בקשו מקלוד סקריפט ייצוא שבועי של הנתונים (אפשר כ-cron!).

שלב 10: כמה זה באמת עולה? פירוק עלויות

התשובה הקצרה: תשתית האתר עצמה מתחילה ב-0 ₪ לחודש ונשארת שם עד תנועה רצינית. ההוצאות הקבועות היחידות: דומיין (כ-10–15 דולר לשנה) ומנוי Claude.

בואו נעבור שירות-שירות, לפי המחירונים הפומביים נכון לכתיבת שורות אלה:

Vercel — תוכנית Hobby: חינם. כוללת פריסות ללא הגבלה, HTTPS, CDN עולמי ו-Serverless Functions, לשימוש אישי ולא-מסחרי. תוכנית Pro ($20 לחודש למשתמש) נדרשת לשימוש מסחרי, ומוסיפה crons תכופים, יותר משאבים וסביבת עבודה לצוות. בפועל: מתחילים ב-Hobby, עוברים ל-Pro כשהאתר הופך לעסק.

Supabase — תוכנית Free: חינם. דאטהבייס 500MB, אחסון 1GB, ומכסת משתמשי Auth נדיבה. המגבלה המורגשת: השהיית פרויקט לא פעיל אחרי שבוע. תוכנית Pro ($25 לחודש) מסירה את ההשהיה, מגדילה מכסות ומוסיפה גיבויים יומיים. רוב האתרים החדשים חיים על Free חודשים ארוכים.

Resend — חינם עד 3,000 מיילים בחודש (מקסימום 100 ביום). התוכנית הבאה ($20 לחודש) מקפיצה ל-50,000. וכשמגיעים לעשרות אלפי מיילים — Amazon SES ב-$0.10 לאלף הופך את חשבון המיילים מזניח: 100,000 מיילים = 10 דולר.

Cloudflare — DNS, Email Routing והגנת CDN בסיסית: חינם. הדומיין עצמו במחיר עלות.

GitHub — רפוזיטוריז פרטיים: חינם.

נשארו שתי עלויות אמיתיות:

1. דומיין: ‎~10–15 דולר לשנה. אין דרך לעקוף, וגם לא צריך.
2. מנוי Claude: מתחיל ב-$20 לחודש (Pro); מי שבונה בקצב אינטנסיבי ירצה תוכנית גבוהה יותר עם יותר שעות קלוד קוד.

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

שלב 11: חמשת הפרומפטים שעובדים — להדבקה ישירה בקלוד קוד

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

פרומפט 1 — הקמת הפרויקט:

הקם פרויקט Next.js חדש עם App Router, TypeScript ו-Tailwind בתיקייה הנוכחית.
האתר בעברית מלאה: כיוון RTL גלובלי, גופן עברי נעים דרך next/font,
ומבנה תיקיות נקי. צור קובץ CLAUDE.md עם כללי הפרויקט:
כל התוכן בעברית, RTL תמיד, מובייל תחילה, ואף סוד לא נכנס לקוד.
בסוף — הרץ את שרת הפיתוח וודא שהכול עולה בלי שגיאות.

פרומפט 2 — דף הבית:

בנה דף בית לעסק [תיאור קצר: תחום, קהל יעד, מה מייחד אותו].
מבנה: Hero עם כותרת שממוקדת בתועלת ללקוח וכפתור פנייה,
3-4 כרטיסי שירותים, פסקת "למה אנחנו", המלצות (פלייסהולדר),
שאלות נפוצות, וטופס יצירת קשר בסוף.
דרישות: מובייל תחילה, נגישות בסיסית (aria, ניגודיות),
טעינה מהירה — תמונות רק דרך next/image.
אל תמציא עובדות על העסק — סמן במפורש כל מקום שדורש טקסט ממני.

פרומפט 3 — טופס לידים מלא:

בנה מערכת לידים מלאה:
1. קומפוננטת טופס (שם, טלפון, אימייל, הודעה) עם מצבי טעינה/הצלחה/שגיאה
   והודעות בעברית.
2. API Route ב-/api/contact עם ולידציה בעזרת zod בצד השרת.
3. שדה honeypot נסתר נגד בוטים.
4. שמירת כל פנייה ב-Supabase, כולל עמוד המקור ופרמטרי UTM.
5. שליחת מייל התראה אליי ומייל אישור לפונה דרך Resend.
המפתחות נמצאים במשתני סביבה — ודא ששום סוד לא חשוף לדפדפן.
בסוף, שלח פנייה אמיתית לבדיקה וודא שהיא נשמרה ושהמיילים נשלחו.

פרומפט 4 — SEO/GEO לכל האתר:

עבור על כל עמודי האתר והשלם תשתית SEO ו-GEO:
metadata ייחודי לכל עמוד (title עד 60 תווים, description עד 155),
תגיות Open Graph, קובץ sitemap.ts אוטומטי, robots.txt,
ו-JSON-LD מתאים: Organization בדף הבית, Service בעמודי שירות,
FAQPage בכל עמוד עם שאלות ותשובות.
ודא שכל עמוד נפתח בפסקת תשובה ישירה ושיש קישורים פנימיים
בין כל העמודים. בסוף — תן לי טבלת סיכום: עמוד, title, סטטוס סכמה.

פרומפט 5 — אוטומציה ואבטחה לפני עלייה לאוויר:

הכן את האתר לפרודקשן:
1. צור cron יומי ב-/api/cron/daily-report שמסכם לידים ופניות
   מה-24 שעות האחרונות ושולח לי מייל מסודר. הגן עליו עם CRON_SECRET.
2. הוסף הגבלת קצב לכל ה-API Routes הציבוריים.
3. סרוק את כל הפרויקט: ודא שאין סודות בקוד, ש-service keys
   לא נגישים מצד הלקוח, ושכל קלט משתמש עובר ולידציה.
4. הצג לי רשימת ממצאים ותקן אותם אחד-אחד באישור שלי.

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

טעויות נפוצות — ואיך להימנע מהן

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

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

2. לשלוח מיילים בלי לאמת דומיין. "למה כל המיילים שלי בספאם?" — כי דילגתם על DKIM/SPF. חמש דקות של הדבקת רשומות DNS חוסכות חודשים של מיילים שנעלמים.

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

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

5. לאשר לקלוד הכול בעיניים עצומות. קלוד קוד מצוין, אבל אתם המנהלים. קראו את הסיכומים שלו, בדקו את האתר אחרי כל שינוי משמעותי, ובקשו ממנו להסביר החלטות. Vibe Coding זה לא Blind Coding.

6. דאטהבייס מנופח מהיום הראשון. עשר טבלאות, קשרים, טריגרים — לאתר עם טופס אחד. התחילו פשוט (זוכרים את ה-JSON bucket?), הסתבכו רק כשהמציאות דורשת.

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

8. SEO כמחשבה מאוחרת. לחכות חצי שנה ואז "לעשות SEO" זה לוותר על חצי שנה של תנועה חינמית. metadata, sitemap וסכמות נכנסים מהעמוד הראשון — במיוחד כשקלוד עושה את זה בשבילכם ממילא.

שורה תחתונה

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

זה בדיוק מה שעברנו: קלוד קוד כמנוע, Next.js כשלד, Vercel כבית, Cloudflare ככתובת, Supabase כזיכרון, Resend ו-SES כקול. כל רכיב בחינם או קרוב לזה, וכל השרשרת מחוברת בפרומפטים שכבר קיבלתם מוכנים.

הצעד הבא תלוי בכם:

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

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