Anonim

אם מעולם לא שמעת על Bootstrap, מסגרת שפותחה על ידי טוויטר לייצור אתרים יפים, אתה מפסיד! Bootstrap הופך את מהיר למדי וקל לעיצוב אתר ללא ידע רב ב- CSS (גיליונות סגנון מדורגים). אם אתה חדש בתכנות לאינטרנט, אינך צריך לדעת דבר על CSS כדי להתחיל ללמוד כיצד Bootstrap עובד; כל מה שתצטרך הוא מסמך HTML יחיד. אנו נבחן את Bootstrap, ונראה לך במה מדובר, איך זה עובד, ואם זו אפשרות טובה לכל אתר שאתה בונה.

הכנסת ממשק ה- API של Bootstrap לקובץ ה- HTML שלך

יש לך כמה אפשרויות להכנסת Bootstrap לקובץ הפרוייקט הראשי שלך. האפשרות הראשונה היא להכניס את כל קבצי ה- Bootstrap הנחוצים לפרויקט שלך. אתה יכול לעשות זאת על ידי הורדת החבילה והעלאתה לתיקיית הפרוייקט שלך. תצטרך, כמובן, לקשר את קובץ ה- Bootstrap CSS הראשי למסמך שלך. באתר הרשמי של Bootstrap יש מדריך שלב אחר שלב כיצד לבצע זאת.

האפשרות השנייה היא לדלג על הורדת החבילה ולהשתמש ברשת אספקת תוכן (CDN). CDN מאפשר לך לקשר את קבצי Bootstrap הראשוניים למסמך HTML שלך מבלי להוריד אותו מעולם. זה כמובן לא תמיד דבר טוב עבור אתרים מקצועיים, מכיוון שלא הייתי ממהר מדי להשאיר את גורל העסקים או הדף שלי בגורל אם השרת הזה אי פעם יירד. עדיף שהקבצים יהיו בפרויקט שלך, אך לצורך הלמידה ה- CDN יעבוד בסדר.

כדי להכניס את Bootstrap למסמך HTML שלך, תצטרך רק להכניס את הקוד הבא בתוך תג במסמך ה- HTML שלך:

ברגע שהקישורים האלה מוכנסים לתג הראשי הזה, עליכם להיות מוכנים להתחיל להשתמש בשיעורי Bootstrap. המסמך שלך אמור להיראות כך:

מגף אתחול ושיעורים

רכיבי Bootstrap מחולקים לשיעורים, שהם רק חבורה של CSS שנכתבו מראש ותוכלו להכניס לסימון שלכם. קל להכניס כיתות לסימון שלך, אתה רק צריך לדעת את שם הכיתה בה אתה רוצה להשתמש ואז להחיל אותו על אחד מרכיבי ה- HTML שלך באמצעות הערך class = "classname", כפי שנדון במאמר קודם.

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

עם זאת, אני מתחנן שתתחיל פרויקט HTML משלך במחשב שלך באמצעות Atom או עורך טקסט אחר, סקור על מה שיעורי HTML ו- CSS עוסקים, ואז להתחיל לשחק עם Bootstrap. ואם אתה יודע מספיק סימון, אולי אפילו צור אתר תיק משלך כתרגיל מבחן.

האם Bootstrap היא אפשרות ברת קיימא לכל אתר?

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

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

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

סגירה

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

Bootstrap באמת הוא כלי מסודר, אך זכרו לא להסתמך עליו בלבד! טוב להכיר את זה ולדעת את הדרך שלך במסגרת, אבל גם לוודא שאתה צולל ב- CSS כדי להבין באמת מה קורה מאחורי הקלעים. לא רק זה, אלא שידע נמרץ ב CSS מחמיא את Bootstrap להרבה, ומאפשר לך באמת ליצור כמה אתרים ייחודיים ויפים בהתאמה אישית משלך.

איך אתה יכול להשתמש בסטריפט boot כדי ליצור אתר יפה