שיתוף | עורך קוד נח לשימוש בתוספת AI מקצועי.

[mont blanc]

מה כולל העורך... הנה סיכום מפי קלוד:

CodeForge Studio – סביבת עריכת קוד בדפדפן

CodeForge Studio היא סביבת פיתוח מלאה בקובץ HTML אחד, בעברית ובכיוון RTL. אין התקנה ואין שרת: פותחים את הקובץ בדפדפן ומתחילים לעבוד.

ניהול פרויקטים
מסך ראשי עם כרטיסי פרויקטים ופרויקט התחלתי מוכן.
פרויקט חדש נוצר עם index.html, style.css ו-script.js.
לכל פרויקט תפריט של שינוי שם ומחיקה (עם אישור לפני מחיקה).
הכול נשמר אוטומטית בדפדפן.
עורך הקוד
עורך Monaco, אותו מנוע של VS Code: צבעי תחביר, השלמה אוטומטית ומיני-מפה.
זיהוי שפה אוטומטי לפי סיומת הקובץ: HTML, CSS, JavaScript, TypeScript, JSON, Markdown, XML, SVG, SQL, Python, PHP, Java, C#, C++, Shell, YAML, Go, Rust, Ruby ועוד.
לשוניות לקבצים פתוחים.
שמירה אוטומטית תוך שבריר שנייה מההקלדה, וכפתור שמירה ידני.
ניהול קבצים
עץ קבצים עם תיקיות.
יצירת קבצים ותיקיות, שינוי שם ומחיקה מתפריט לחיצה ימנית.
העלאת קבצים מהמחשב.
ייצוא הפרויקט כולו כקובץ ZIP.
סרגל קבצים שאפשר לצמצם, עם כפתור להחזרתו.
תצוגה מקדימה חיה
מתעדכנת תוך כדי הקלדה.
מסך מפוצל בין עורך לתצוגה, עם פס שאפשר לגרור לשינוי הגודל.
לחיצה כפולה על הפס מחזירה ל-50/50.
כפתור להחלפת צדדים בין העורך לתצוגה.
עוזר AI מבוסס Gemini
צ'אט שרואה את כל קבצי הפרויקט ועונה בעברית.
כפתורי פעולה מהירה: מציאת באגים, הסבר איך הפרויקט עובד והצעות לשיפור.
כפתור ניתוח פרויקט נפרד.
כשמבקשים שינוי קוד, מתקבל כרטיס שינוי עם הצגת ההבדלים (diff) וכפתור להחלה בלחיצה.
בחירת מודל בהגדרות. בעומס אצל Google המערכת מנסה שוב, ואם צריך עוברת אוטומטית למודל חלופי.
היסטוריית השיחה נשמרת לכל פרויקט, וסגירת פאנל ה-AI לא מוחקת אותה. היא נשמרת כל עוד האתר פתוח בלשונית, ונמחקת בסגירת הלשונית או הדפדפן, או בלחיצה על ניקוי הצ'אט.
ה-AI ממשיך לזכור את השיחה גם אחרי רענון הדף, אבל ההודעות הישנות לא מוצגות מחדש בפאנל.
חוויית שימוש
ערכת נושא כהה ובהירה.
הודעות קופצות ממוסגרות וחלונות הגדרות ואישור.
עיצוב רספונסיבי.
הערות שימוש
נדרש חיבור לאינטרנט, כי העורך, ספריית ה-ZIP והפונטים נטענים מ-CDN.
הקובץ לא מכיל מפתח API. כל משתמש מזין מפתח Gemini משלו בהגדרות, והוא נשמר רק בדפדפן שלו.
הפרויקטים נשמרים מקומית בדפדפן של כל משתמש, ולכן מי שמקבל את הקובץ מתחיל עם פרויקט התחלתי נקי.
התצוגה המקדימה טוענת קבצי CSS ו-JS בשמות style.css ו-script.js מהתיקייה הראשית. קבצים בשמות אחרים או בתיקיות לא ייטענו בה.

להורדת קובץ הHTML:
index.zip

(️לא סיימנו מתכוננים להוסיף חידושים... עם כל חידוש יעודכן כאן הקישור להורדה בקובץ החדש.)

אשמח להערות ולהארות!

[mont blanc]

הוספתי חיבור לגיטהאב... ניתן להעלות את הפרוייקטים ישירות לגיטהאב ללא בעיות.

החיבור מתבצע ע"י אסימוני גישה.

[mont blanc]

עדכונים נוספים :
ייבוא מאגר מ-GitHub: הפעולה ההפוכה להעלאה. מכיוון שהחיבור כבר קיים, קל להוסיף פרויקט חדש ממאגר קיים, ואחריו כפתור Pull לעדכון.
כפתור עצירה לתשובת ה-AI: כרגע סגירת הפאנל לא עוצרת את הבקשה. כפתור "עצור" עם ביטול אמיתי של הבקשה יחסוך זמן וכסף.
חיפוש בכל הפרויקט (Ctrl+Shift+F) והחלפה: חיפוש בין כל הקבצים, עם קפיצה ישירה לשורה.
תצוגה מקדימה חכמה יותר: טעינה של כל קובץ CSV ו-JS לפי הקישורים ב-HTML, כולל תיקיות. זו המגבלה הכי בולטת היום.
קונסולה בתצוגה המקדימה: חלונית שמציגה console.log ושגיאות JavaScript מתוך ה-iframe.
שיפורי עריכה
פורמט אוטומטי (Prettier) בלחיצה או בשמירה.
קיצורי מקלדת: Ctrl+S לשמירה, Ctrl+P לפתיחה מהירה של קובץ, וכן פלטת פקודות.
גרירה ושחרור בעץ הקבצים להזזת קבצים בין תיקיות, ולהעלאת קבצים מהמחשב.
תצוגה צד-לצד של שני קבצים (למשל HTML ו-CSS).
היסטוריית גרסאות מקומית: חזרה לגרסה קודמת של קובץ, בלי צורך ב-git.
Undo להחלת שינוי של ה-AI, למקרה שהשינוי לא מוצא חן בעיניך.
הרחבת ה-AI
הצעת קוד תוך כדי הקלדה, כמו Copilot.
פעולות על קוד מסומן: קליק ימני ובחירה של "הסבר", "תקן" או "שפר".
היסטוריית צ'אט קבועה שנשמרת גם אחרי סגירת הלשונית, ושמוצגת מחדש אחרי רענון.
בחירת קבצים לשליחה ל-AI, במקום כל הפרויקט, כדי לחסוך טוקנים.
שיחת AI עם צילום מסך של התצוגה המקדימה, לתיקוני עיצוב.
פרויקטים ושיתוף
תבניות פרויקט מוכנות: דף נחיתה, אפליקציית React, משחק קטן.
קישור לשיתוף של הפרויקט (דורש שרת או שימוש ב-GitHub Pages).
פריסה בלחיצה ל-GitHub Pages אחרי ההעלאה, כדי שיהיה לך אתר חי.
ייצוא וייבוא ZIP, כשהייבוא מחזיר פרויקט שנשמר קודם.
גיבוי וייבוא של כל הפרויקטים לקובץ JSON, כי הכול נשמר רק בדפדפן ואפשר לאבד את זה בניקוי נתונים.