איך בניתי את הבלוג הזה: Next.js, MDX ו-AI כשותף הנדסי
כשהחלטתי להקים את האתר שלי, ידעתי דבר אחד: אני לא רוצה עוד אתר וורדפרס עם 40 פלאגינים שנשברים בכל עדכון. בתור מי שבונה ארכיטקטורות תוכנה ואוטומציה בשביל לקוחות, האתר שלי חייב להיות השתקפות של אותה גישה – פשוט, מהיר, ובנוי נכון מהיסוד.
בפוסט הזה אני מפרטת את ה-Stack הטכנולוגי שבחרתי, ואיך AI שימש אותי כשותף הנדסי לאורך הדרך – לא ככותב תחליפי, אלא ככלי לחשיבה על החלטות ארכיטקטורה ולפתרון בעיות טכניות ספציפיות.
ה-Stack הטכנולוגי: למה דווקא אלו?
בחרתי בכלים שמאפשרים לי ביצועים מטורפים (SEO) מצד אחד, וגמישות עיצובית מלאה מצד שני:
- Next.js 15 (App Router): הפריימוורק הכי חזק היום בשוק. הוא מאפשר לי ליצור אתר סטטי (Static Export) שנטען במהירות שיא, בלי שרת שצריך לתחזק.
- MDX (Markdown + React): כל הפוסטים נכתבים בפורמט Markdown נקי, עם אפשרות "להזריק" רכיבי React חיים במידת הצורך.
- Tailwind CSS: לעיצוב המודרני של האתר, בלי קובצי CSS נפרדים שמצטברים.
- Lucide React: לאייקונים המינימליסטיים שנותנים את הטאץ' המקצועי.
איפה AI באמת עוזר – ואיפה לא
כאן חשוב לי להיות מדויקת, כי יש הרבה רעש סביב "בניתי אתר שלם עם AI". המציאות פחות דרמטית ויותר שימושית: אני משתמשת ב-AI כשותף לחשיבה הנדסית – לבדוק כמה גישות ארכיטקטורה לפני שמחליטים, לזהות באגים מהר יותר, ולהאיץ כתיבת קוד שגרתי (boilerplate). ההחלטות עצמן, והתוכן שאתם קוראים עכשיו, נשארים שלי.
דוגמה קונקרטית: כשרציתי שלינקדאין "יקרא" את הפוסטים שלי נכון בשיתוף, גיליתי שתגי ה-Open Graph היו חסרים ברמת הפוסט הבודד. השתמשתי ב-AI כדי לעבור מהר על אפשרויות שונות למימוש generateMetadata דינמי לכל פוסט, ולבדוק Edge Cases (מה קורה כשחסרה תמונה? כשהתיאור ארוך מדי?) – אבל אני זו שבחרה את המבנה הסופי ובדקה שהוא באמת עובד בפרודקשן.
הטרייד-אוף שחשוב להכיר: AI מצוין לזירוז חשיבה על קוד ולסקירת אפשרויות, אבל הוא לא תחליף לבדיקה בפועל. כל שורת קוד שהוא הציע עברה אצלי הרצה אמיתית לפני שעלתה לאוויר – במיוחד כשמדובר בקבצים שרצים בזמן build (כמו sitemap.ts או generateMetadata), כי טעות שם לא נראית מקומית, היא שוברת את כל האתר.
השוואה: בלוג בוורדפרס מול הבלוג הזה
| פרמטר | בלוג בוורדפרס / וויקס | הבלוג שלי (Next.js) |
|---|---|---|
| מהירות טעינה | בינונית (תלוי פלאגינים) | מהירות שיא (Static Export) |
| גמישות עיצובית | מוגבלת לתבנית | חופש מוחלט בקוד |
| תחזוקה | עדכוני פלאגינים תדירים | קוד יציב, בלי תלות חיצונית |
| עלות אחסון | תשלום חודשי קבוע | אפס (Vercel / Static Hosting) |
מה הלאה?
הבלוג הזה הוא רק ההתחלה. השלב הבא הוא לחבר אותו לתשתית שמראה לי אילו פוסטים באמת מביאים פניות איכותיות, כדי שהתוכן הבא שאני כותבת יהיה ממוקד יותר – לא רק "עוד פוסט", אלא חלק מארכיטקטורת תוכן שעובדת.
רוצים לבנות אתר או מערכת שלא רק נראים טוב, אלא גם עובדים נכון מתחת למכסה המנוע?
רוצים ליישם את זה אצלכם?
אני עוזרת לעסקים לבנות ארכיטקטורת אוטומציה חכמה. בואו נבדוק איך הכלים האלו יכולים לעבוד בשבילכם.
בואו נדבר על זה