רוצים שהאתר שלכם ב-React יהיה מהיר ונגיש ככל האפשר? הגעת למקום הנכון!
React היא ספריית קוד פתוח שמקלה על הבנייה של ממשקי משתמש. בתוכנית הלימודים הזו תלמדו על ממשקי API וכלים שונים בסביבה העסקית, שכדאי להשתמש בהם כדי לשפר את הביצועים והשימוש באפליקציה.
במדריך הזה מוסבר איך להתחיל להשתמש באפליקציית React. כל מדריך אחר בקטע הזה עוסק בנושאים שקשורים לאופטימיזציה של המהירות או הנגישות של אפליקציית React.
למה זה שימושי?
יש הרבה תוכן שמסביר איך לפתח אפליקציות מהירות ואמינות, אבל לא הרבה מהן שמסבירות איך לפתח אפליקציות React מהירות ואמינות. המדריכים האלה מתארים את כל הנושא מנקודת המבט של אפליקציית React, שבה מוזכרים רק ספריות, ממשקי API ותכונות שספציפיים לסביבה העסקית של React.
מה תלמדו?
המדריכים בתוכנית הלימודים הזו לא מתמקדים בנושאים הבאים:
- איך משתמשים בתגובה
- איך React פועלת לעומק
אומנם נעסוק בשני המושגים האלה במקרה הצורך, אבל כל המדריכים ו-codelabs בקטע הזה יתמקדו במקום זאת ביצירה של אתרי React מהירים ונגישים. לכן נדרש ידע בסיסי ב-React.
יצירת אפליקציית React
הדרך הקלה ביותר להתחיל ביצירת אפליקציות של React היא Create React App (CRA). הוא מספק הגדרת ברירת מחדל עם כמה תכונות ליבה מובנות, כולל מערכת build שמכילה Bundler של מודולים (webpack) וטרנספילר (Babel).
במעטפת שורת הפקודה צריך רק להריץ את הפקודה הבאה כדי ליצור אפליקציה חדשה:
npx create-react-app app-name
כשהרצת הפקודה תסתיים, תוכלו לעבור לאפליקציה ולהריץ אותה באמצעות הפקודות הבאות:
cd new-app
npm start
בהטמעה הבאה אפשר לראות את מבנה הספרייה ואת דף האינטרנט בפועל של אפליקציית CRA חדשה שהופעלה מחדש.
יש מספר קובצי תצורה וסקריפטים ליצירת סקריפטים שמשמשים את CRA כדי להגדיר תהליך build של Webpack ו-Babel, והוא כולל הגדרת Jest בסיסית לצורך בדיקה. כדי להקל על המשתמש, הקבצים האלה מוסתרים ואי אפשר לגשת אליהם עד שמוציאים מה-CRA. תמיד מומלץ להימנע מהוצאה כשזה אפשרי, כי המשמעות היא לקחת את כל קובצי התצורה האלה כקוד מקור משלכם, דבר שעלול להיות קשה לניהול.
מבנה הספריות של אפליקציית CRA חדשה מכיל רק את הקבצים שצריך לשנות כדי לעבוד על האפליקציה. תוכלו למצוא הסבר מפורט במסמכי התיעוד של CRA.
מה השלב הבא?
עכשיו, אחרי שהבנתם איך להתחיל לפתח אפליקציית Create React, תוכלו ללמוד איך לשפר את הביצועים והנגישות של האפליקציה בעזרת כל המדריכים בתוכנית הלימודים הזו: