React

קומפוננטות ריאקטיות מממשות מתודת render() הלוקחת קלט מידע ומחזירה מה להציג. הדוגמא הזאת משתמשת בתחביר הדומה לXML ונקרא JSX. קלט מידע המועבר לקומפוננטה יהיה נגיש לrender() באמצעות this.props.

JSX הוא אופציונלי ולא חובה כדי להשתמש ב React. נסה את Babel REPL כדי לראות את הקוד JavaScript הגולמי שמיוצר על ידי שלב הקומפילציה של JSX.

בנוסף ללקיחת מידע קלט (הנגיש באמצעות this.props), קומפוננטה יכולה לשמור מידע על state פנימי (הנגיש באמצעות this.state). כאשר הstate של הקומפוננטה משתנה, הmarkup המעובד יעודכן על ידי קריאה מחדש ל render().

עם שימוש בpropsו-state, אנחנו יכולים ליצור אפליקצית צ’קליסט קטנה. הדוגמא הזאת משתמשת בstate כדי לעקוב אחרי רשימה של פריטים והטקסט שהמשתמש הכניס. למרות שהטיפול באירועים נראה מעובד באותה שורה. הם יאספו וימומשו באמצעות event delegation.

React מאפשרת לך להתממשק עם ספריות ופריימוורקים אחרים. הדוגמא הזאת משתמשת בremarkable, ספריה חיצונית של Markdown, הממירה את הערך של הtextarea בזמן אמת.