תוכן העניינים[להתחבא][הופעה]
לאחרונה התעניינתי בגישות פיתוח אתרים מלבד HTML, CSS ו-JavaScript.
עם הנוף ההולך וגדל ללא קוד, לא היה מפתיע לגלות שישנן מספר חלופות לגישות הסטנדרטיות יותר לפיתוח יישומי אינטרנט.
אתה חייב להכיר כמה מפלטפורמות ה-CMS המוכרות יותר, כמו וורדפרס שהן כמעט ללא קוד. אבל, אם אתה רוצה לבנות אפליקציות אינטרנט, פלטפורמות כאלה עשויות להיראות מגבילות.
כאן אני מציג לך את Bubble.io, מוצר רב עוצמה כלי ללא קוד המאפשר לך לבנות אפליקציות אינטרנט כמו שלא היו מעולם.
בואו לחקור את זה לעומק!
מה Bubble.io?
Bubble היא פלטפורמה לא טכנית המשלבת שפת תכנות ויזואלית וא מסגרת לפיתוח אתרים.
משתמשים יכולים להשתמש בכלי תכנות אלה כדי לבנות יישומים מקוונים ייחודיים, לשנות מסדי נתונים ותהליכים, להוסיף רכיבי עמוד (תמונות, טקסט, טפסי קלט, מפות) ולעצב את הממשקים שלהם.
זהו שוק שבו אתה יכול לגלות תבניות, תוספים ושירותים אידיאליים שיעזרו לך בבניית מוצרים חזקים.
מבלי שתצטרך להגדיר מסגרת תכנות טיפוסית, אתה יכול ליצור כל דבר, החל משוק לרשת חברתית ועד ל-CRM (ניהול קשרי לקוחות) באמצעות Bubble.
זה נותן ללקוחות את היכולת ליצור ולהתאים אישית את האפליקציות שלהם באמצעות ממשק ידידותי למשתמש ועורך הצבע והקליק.
אתה יכול להשתמש בו בשילוב עם שירותים המספקים REST API, כגון Facebook, SQL, Analytics ואפליקציות תשלום. זה מאפשר למשתמשים להקדיש זמן לשיפור הפונקציונליות והמראה של היישומים שלהם כך שהם ייראו טוב בטאבלטים ובמכשירים ניידים.
הוא מתאים לכל הגדלים של העסק, מקטן עד בינוני ועד גדול; ונגיש עבור Windows, Mac והאינטרנט.
מהו תכנות ויזואלי?
תכנות חזותי הוא בעצם מה שזה נשמע. במקום לתכנת ידנית על ידי כתיבת קוד, אתה עושה זאת בצורה גרפית על ידי לחיצה וגרירת רכיבים לדפים.
אל תטעה בתיאור הקצר הזה.
זה לא כמו כל אפליקציה אחרת לחותך עוגיות או כלי לבניית אתרים שנתקלת בהם באינטרנט. רוב בוני האפליקציות דורשים ממך להסתמך על תבניות בסיסיות ובעלות פונקציונליות מוגבלת ביותר; הם רק מאפשרים לך לפתח סוגים ספציפיים של אפליקציות ולהגביל את ההתאמה האישית שלך.
למרות שהמושג "תכנות חזותי" ו"גרירה ושחרור" מופיע קל בבאבל, הוא חזק מאוד.
סביבת התכנות החזותית שלו לא רק מאפשרת לך לגרור אובייקטים כגון טקסט, גרפיקה, קלט ועוד אל דף, אלא היא גם מאפשרת לך להגדיר את מה שהאלמנטים האלה עושים.
מה עושה באבל?
המטרה העיקרית של Bubble היא לאפשר לכל אחד ליצור אפליקציות אינטרנט מבלי לכתוב קוד.
עם זאת, למרות שזה מספק הצהרת מטרה לזכור בקלות, זה משאיר חלק משמעותי מהסיפור. הדרך מרעיון לשוק מורכבת יותר מסתם יצירת שורות קוד.
בפיתוח קונבנציונלי נדרש צוות של אנשי מקצוע מיומנים שעובדים על חלקים מסוימים של היצירה, הצמיחה והתחזוקה של האפליקציה. קחו זאת בחשבון.
מה כל אפליקציה דורשת?
- אבטחה כדי לוודא שלאף אחד אין גישה לא מורשית לנתונים.
- מסד נתונים לאחסון ואחזור מידע כגון פריטים, מאמרים ועדכוני מדיה חברתית.
- מדרגיות כדי לאפשר פיתוח ללא הפרעה של בסיס המשתמשים ונפח הנתונים.
- ממשק משתמש נעים להפוך את האפליקציה לאטרקטיבית וקלה לשימוש.
- אינטגרציה עם שירותים ומערכות שונות.
בועה מחליף הרבה יותר מקודד. היא מספקת את כל השירותים הללו בצורה מושכת ויזואלית ואוטומטית ביותר, מה שהופך את זה לאפשרי, אם לא פשוט, לאדם בודד לטפל בהכל.
בעוד שפלטפורמות קודמות ללא קוד ניסו להחליף קידוד בדרכים שונות. הרעיון שלו הוא להסיר כמה שיותר מחסומים לאפליקציה להגיע לשוק, לטפל בכל דבר, החל מעיצוב רספונסיבי ואנימציות ועד לאירוח, פריסת גרסאות, אבטחה ותפעול מסד נתונים.
שימוש במחבר ה-API לחיבור Bubble לשירותים אחרים
מחבר ה-API שלו הוא כנראה התוסף החשוב ביותר בשוק. כפי שהשם מרמז, זה מאפשר לך להתחבר לאפליקציות ושירותים אחרים כדי לשתף פעולות ונתונים.
במקום להתעמק בפרטים הטכניים של איך זה עובד, שקול את הדוגמאות האלה למה שממשקי API עשויים להשיג:
- השגת גישה ל למידת מכונה שיטות כגון זיהוי תמונות ותרגום.
- קבל את מידע מזג האוויר העדכני ביותר מכל מקום על פני כדור הארץ.
- כאשר אירוע מופעל ב-Bubble, מידע מוחלף בין מערכות, כגון יצירת ליד ב-CRM שלך או פגישה ביומן Google שלך.
- הזמינו טיסה או שהות במלון בכל מקום בעולם.
- קבל את מספר הטלפון, המיקום, התמונות, הלוגו והביקורות של כל חברה במפות Google.
שימוש בתוספים כדי לשפר תכונות מקוריות
מבחינה טכנית, הוא מערבב מודולי קוד JavaScript, CSS ו-HTML לצומת פונקציונלי. יישום שנכתב ב-JS.JSON משמש כבסיס לשפתו.
אמנם אינך צריך להבין את המינוח הזה במלואו כדי לבנות אפליקציות, אבל הם מצביעים על עובדה מרכזית אחת: היא עומדת בתקני אינטרנט ידועים ומוכרים, מה שמאפשר למפתחים לשפר את הפונקציונליות המקורית שלו במידה ניכרת.
זה כבר נראה באתר התוספים, שם זמינות מאות הרחבות חינמיות ובתשלום לפונקציונליות הבסיסית. זה גם מרמז שאם אתה מגיע לנקודה שבה היכולות הבסיסיות שלה אינן מספיקות, יש הרבה מומחי JavaScript שמוכנים להציע פתרון מותאם אישית עבורך.
אילו סוגי אפליקציות אתה יכול לפתח?
אתה יכול ליצור מגוון רחב של יישומים, שחלקם מופיעים להלן.
- אפליקציות לשווקים מיוחדים עם קהילה.
- אפליקציות ללוחות דרושים במגוון מגזרים.
- תוכנה לאיוש בתי חולים.
- תוכנת נקודת מכירה לחנויות פיזיות.
- תוכנת משרד שיניים עם תווית לבנה.
- מלאי עסקי אישי ותוכנת שירות לקוחות.
- יישומי צבירת נדל"ן מול מתווך ולקוח.
- אפליקציות לאירועים וקורסים בשוק (ואפילו סירות).
- תעודות מקצועיות מחייבות בקשות לבדיקות פנימיות.
- בקשות למגיבים ראשונים.
- תוכנת ניהול עובדים לשימוש פנימי.
למען האמת, הפלטפורמה לא נועדה לעשות הכל. ייתכן שזו לא הבחירה האידיאלית אם אתה מעצב אפליקציית משחק עם חזותיים ותנועה מורכבים. חוץ מזה, אם אתה יוצר אפליקציה מקורית (אחת לחנויות אפליקציות), תצטרך לשלב אותה עם שירות אחר של צד שלישי.
תכונות עיקריות
בועה עמוסה בתכונות. לא נוכל לכסות את כולם כאן, אבל ננסה לכסות את החיוניים ביותר.
1. תוספים
זה מאפשר לך לכלול פונקציונליות מכלים רבים באינטרנט לתוך שלך יישום אינטרנט. לדוגמה, אם אתה רוצה שהמשתמשים שלך יתחברו באמצעות חשבון הפייסבוק שלהם, תוכל להשתמש בתוסף פייסבוק כדי לעשות זאת.
2. פיתוח
זה מאפשר לך לבנות אפליקציות דינמיות מרובות משתמשים לדפדפני אינטרנט שולחניים וניידים, כמו גם את כל הכלים הנדרשים לבניית אתר דומה לאינסטגרם או Airbnb.
3. עיצוב
אתה יכול ליצור פריסות ידידותיות לנייד ותוכן דינמי כדי לתת את הגימור למוצר שתשמח להשוויץ בפני אחרים.
4. אירוח
לעולם אל תצטרך להיות מודאג לגבי תחזוקה של שרתים, תשתית או תפעול שוב ושוב.
היא דואגת לפריסה ואירוח עבורכם בצורה בטוחה ומאובטחת. מספר המשתמשים, נפח התעבורה ואחסון הנתונים כולם אינם מוגבלים.
בניית אפליקציה עם Bubble (מדריך)
בוא ניכנס עכשיו לפעולה ונחקור איך אתה יכול לבנות אפליקציית חדשות ב-Bubble.
1. תחילת העבודה
כדי להתחיל, עליך קודם הירשם לחשבון בחינם ב-Bubble.
נתחיל בשימוש בכלי העיצוב החזותי של Bubble כדי לעצב את הפלטפורמה שלנו ממשק משתמש. כמה מהדפים המרכזיים שיש לכלול מובאים להלן:
- עמוד העלאה – אתר אינטרנט שבו בעלי אתרים יפתחו ויפיצו מאמרים.
- דף הבית - מוצגת רשימה של סיפורים שפורסמו לאחרונה.
- עמוד סיפורי – עמוד בו ניתן למצוא כל סיפור ייחודי.
- Publisher page- עמוד המציג רשימה של סיפורים ממוציא לאור מסוים.
2. הגדרת מסד נתונים
לאחר שפרסת את התצוגה של המוצר שלך, תוכל להתמקד בבניית שדות הנתונים שיתדלקו את האפליקציה שלך. נשתמש בשדות אלה כדי לקשר את זרימות העבודה שבבסיס המוצר שלך.
עבור דוגמה זו, נקים שני סוגי נתונים נפרדים עבור כל ידיעה. סוג נתונים אחד יכיל את העובדות הבסיסיות של סיפור (כגון הכותרת, התמונה המוצגת והמוציא לאור), בעוד שסוג הנתונים השני יכיל קובצי תוכן גדולים יותר כמו כל הנרטיב עצמו.
על ידי הגדרתם כסוגי נתונים דיסקרטיים, נוכל לטעון את המידע הנדרש רק כאשר הוא נדרש, להגביל את כמות החומר שעורך הבועה יצטרך לייצר.
סוגי הנתונים והשדות הבאים ייווצרו:
סוג מידע: משתמש
שדות you
- שם
- המפרסמים הבאים הם רשימה של מפרסמים. הערה חשובה: יצירת שדה כרשימה המבוססת על סוג נתונים נבדל מאפשרת לך לשלב את כל שדות הנתונים החיוניים שלו ללא מאמץ מבלי ליצור שדות נוספים.
סוג מידע: סיפור
שדות you
- כותרת
- תמונה מצורפת
- סוֹפֵר
- קטגוריה
- מוֹצִיא לָאוֹר
- תוכן הסיפור
סוג מידע: תוכן הסיפור
שדות you
- תוכן הסיפור
סוג מידע: מוֹצִיא לָאוֹר
שדות you
- שם
- לוגו
- עוקבים
3. בניית זרימות עבודה
כעת לאחר שארגנתם את העיצוב ומסד הנתונים של האפליקציה שלכם, הגיע הזמן להתחיל לחבר הכל ולגרום לו לעבוד.
זרימות עבודה הן השיטה העיקרית להשגת זאת ב-Bubble.
כל זרימת עבודה מתרחשת כאשר מתרחש אירוע (למשל, משתמש לוחץ על כפתור) ולאחר מכן מבצע רצף של "פעולות" בתגובה (למשל, "הרשמה למשתמש", "ערוך שינוי במסד הנתונים" וכן הלאה) .
4. יצירת כתבה חדשותית
התכונה הראשונה שנציע היא כלי המאפשר לבעלי אתרים לכתוב ולפרסם מאמרים חדשותיים לאתר.
בדף ההעלאה, נתחיל בשילוב של פריטי קלט רבים שיושמו בהזנת נתונים למסד הנתונים שלנו. קלט טקסט, מעלה תמונה ובחירה נפתחת הם דוגמאות לשדות אלה.
כמו כן, נצטרך להתאים אישית את התפריט הנפתח של בעל האתר כדי להציג רשימה של אפשרויות דינמיות. מכיוון שכל מאמר חדש יתווסף לרשימת המאמרים הכוללים של מפרסם, נצטרך לבחור מפרסם קיים ממסד הנתונים שלנו.
בעת הגדרת התפריט הנפתח הזה, נבחר את סוג האפשרויות להיות בעל אתר.
לאחר מכן, מקור הנתונים שלנו יסרוק את מסד הנתונים שלנו ויחזיר רשימה של כל הפרסומים הנוכחיים. לבסוף, נשנה את כיתוב המקור כך שיכלול את שם המפרסם.
לאחר שכותב הזין את המידע הדרוש לכל ערך בדף, הוא ילחץ על כפתור הפרסום כדי ליצור סיפור חדש.
לאחר מכן, בתוך מסד הנתונים שלך, תיצור דבר חדש עם סוג הנתונים מוגדר לנרטיב.
אז נצטרך להתחיל לאכלס את מסד הנתונים שלנו בשדות הדרושים. חבר כל אחד מרכיבי הקלט בעמוד לעמודות מסד הנתונים המתאימות שלהם.
ראשית, ניצור את סוג תוכן הסיפור, שיקושר לבסוף לסיפור עצמו.
לאחר מכן, נוסיף שלב נוסף להליך הזה, וניצור משהו אחר - הפעם, הסיפור עצמו.
אפשר לשלב את הנתונים האלה ללא מאמץ בכל הפלטפורמה שלך על ידי שילוב החומר הסיפורי הראשון שפיתחנו עם הסיפור הזה.
סיפור חדש יופק בכל פעם שנוהל זה יופעל.
5. הצגת תוכן דינמי בפיד
ברגע שמפרסמים יתחילו להעלות חומר לאפליקציה שלך לנייד, נצטרך להתחיל ליצור את ההיגיון בדף הבית שלך שמציג כל מאמר כרשימה דינמית. ניתן להשיג זאת על ידי שימוש במרכיב הקבוצתי החוזר שלנו.
קבוצות חוזרות עובדות עם מסד הנתונים שלך כדי להציג ולרענן רשימה של חומר דינמי.
בעת החלת קבוצה חוזרת, תחילה עליך לקשר את האלמנט לסוג נתונים במסד הנתונים שלך.
במקרה זה, תסווג את סוג החומר כסיפורים. כמו כן, יהיה עליך לספק את מקור הנתונים כרשימה של כל הטבלאות במסד הנתונים שלך.
אנו גם נסדר את הקבוצה החוזרת הזו לפי תאריך ההתחלה של כל סיפור, ונראה את הרשימה בסדר כרונולוגי הפוך. כעת תוכל להתחיל לארגן את החומר הדינמי שיופיע בתוך כל רשת.
כל שעליך לעשות הוא למלא את השורה העליונה בחומר המתאים שברצונך להציג, והאלמנט החזק הזה יאכלס את העמודות הנותרות בנתונים ממסד הנתונים הנוכחי שלך.
6. שליחת נתונים בין דפים
אפשר גם לבנות אירועים בתוך כל שורה של קבוצה חוזרת. בעת פיתוח תכונות ניווט עבור הפלטפורמה שלך, פונקציונליות זו תהיה שימושית.
דף הבית של אפליקציית החדשות שלנו מציג רק תצוגה מקדימה של כל סיפור, כולל המוציא לאור, תמונה מוצגת וכותרת הסיפור.
עם זאת, הוא אינו מציג את כל התוכן של מאמר עד שהמשתמש יעבור לדף הסיפור. נשתמש בעורך זרימת העבודה שלנו כדי להעביר נתונים בין דפים כדי להציג את החומר הזה.
כדי להתחיל, צור תהליך ששולח משתמש לעמוד הסיפור כאשר לוחצים על התמונה של סיפור.
השתמש באירוע ניווט כדי להעביר משתמש לדף אחר תוך כדי פיתוח תהליך זה.
בחר את סוג דף היעד שיהווה את הדף הנרטיבי מהתפריט הנפתח. לאחר מכן תצטרך לתת מידע נוסף לדף זה כדי שעורך הבועה יבין איזה סיפור ייחודי להציג.
המידע שתצטרך לתת מגיע מסיפור התאים הנוכחי.
7. הצגת תוכן דינמי בעמוד הסיפור
אתה יכול בקלות לאחזר את נתוני האירוע הזה ולהראות את החומר הרלוונטי מהנרטיב כאשר משתמש נשלח לדף סיפור מסוים.
כדי ליצור פונקציה זו, תחילה עליך לבדוק שסוג דף היעד תואם למאפיין הנתונים שאתה מספק דרך זרימת העבודה. במצב זה, עליך לשייך את דף הסיפור למאפיין סיפור.
זה יכול פשוט למשוך ולספק נתונים מתאימים ממקורות קיימים על ידי סיווג סוג התוכן בדף.
כעת תוכל להתחיל להכניס חומר דינמי לשדות המציגים מידע מטבלה בודדת.
8. הצגת המאמר של המפרסם
לאחר קריאת ידיעה, משתמש יכול לבחור לבחון את כל קטלוג המאמרים של המוציא לאור. אם פיתחתם סוג נתונים של מפרסם, יצירת דף נפרד עבור מפרסמים היא פשוטה כמו יצירת דף הבית המקורי שלנו.
בדף זה, נצטרך להתחיל בהגדרת סוג הדף למפרסם.
לאחר מכן, העתק את הקבוצה החוזרת מדף הבית וערוך את ההגדרות.
במקרה זה, מקור הנתונים של הקבוצה החוזרת שלנו יחפש את כל המאמרים הקיימים שהמפרסם שלהם הוא מפרסם הדף הנוכחי.
9. עוקבים אחרי מפרסמים
התכונה הבסיסית השלישית שנבנה עבור ה-MVP שלנו היא היכולת לעקוב אחר מפרסם בפלטפורמה. נוסיף כפתור מעקב בדף המפרסם. כשנלחץ על סמל זה, נשיק תהליך חדש שמשנה דבר.
הוספת מפרסם הדף הנוכחי לרשימת הפרסומים הבאים שלו תשנה את המשתמש הנוכחי.
לאחר מכן, נצטרך לעדכן את רשימת העוקבים של בעל הדף הנוכחי על ידי הוספת המשתמש הנוכחי.
10. תכונות נוספות שניתן להוסיף
כעת, כשאתה מרגיש בנוח עם בניית שדות נתונים מותאמים אישית והצגת מידע דינמי, אתה יכול להיות יצירתי עם החוויות שאתה יוצר עבור המוצר שלך. אתה יכול לכלול גם:
- צור תכונה המאפשרת למשתמשים לשמור תוכן לקריאה מאוחרת יותר.
- בתחתית כל יצירה, ספק אוסף חוזר של מאמרים מוצעים.
- צור כלי חיפוש שיעזור לאנשים למצוא תוכן חדש באתר.
11. התוצאה
האפליקציה הסופית שלך תיראה בערך כך.
Pros
- היכולת להתחבר לממשקי API ותוספים רבים.
- אפליקציה קלה לשימוש ללא קוד.
- אנשים ללא ניסיון בתכנות ייהנו מכך.
- כלים לעיצוב שהם גם צדדיים וגם חזקים.
- עיבוד שאילתות מהיר.
חסרונות
- אמינות מוגברת.
- מהירות עיבוד הנתונים איטית.
- הביצועים מוגבלים.
מחיר כרטיס
התוכנית החינמית מאפשרת לך ללמוד על הפלטפורמה ולפתח את האפליקציה שלך.
מנויים בתשלום כוללים תוספות כמו תווית לבנה, דומיין מותאם אישית, גישה ל-Bubble API וקיבולת שרת שמורה, המפורטים להלן.
- אישי - $25 לחודש (בתשלום שנתי) או $29 לחודש (בתשלום חודשי).
- מקצועי - $115 לחודש (בתשלום שנתי) או $129 לחודש (בתשלום חודשי).
- ייצור - $475 לחודש (בתשלום שנתי) או $529 לחודש (בתשלום חודשי).
סיכום
Bubble היא אלטרנטיבה מצוינת לבניית יישומי אינטרנט שיכולים להציג מידע בלבד או בעלי ממשק משתמש מינימלי.
זה די פשוט לשימוש, והמדריכים שמסופקים על ידי Bubble מועילים ביותר. העורך החזותי המקוון שלו המאפשר לך לעצב אפליקציות אינטרנט על סמך ההעדפות שלך.
והחלק הטוב ביותר הוא שאתה לא צריך שום ניסיון או מומחיות בתכנות. Bubble מתאימה לכולם, לא משנה אם אתה יודע לקודד או לא.
עם זאת, הבנה מוקדמת של שפות קצה יכולה לתת לך יתרון מכיוון שהיא מאפשרת לך להבין במהירות מה היא עושה בנוגע לטיפול באירועים.
אז מה אתה חושב על היכולות של Bubble?
תן לנו לדעת את ההערות!
ארבהי
האם ניתן ליצור חנות למכירת מוצרים באמצעות הכלי bubble.io?