React
-
כיצד לבנות רכיב מאזין לקיצורי מקלדת ניתן לשימוש מחדש ב־React
אם אתה כמוני ואתה אוהב תרמילים, אתה יודע כמה סוחף זה ללחוץ על מספר מקשים ולצפות בקסם שקורה. בין אם זה ה- Ctrl+C – Ctrl+V המוכר שמפתחנים משתמשים בו ל "לשאוף קוד" 😉 מ- LLMs ועמודי קוד, או התרמילים האישיים שאנו מגדירים בכלי העבודה האהובים עלינו, תרמילים במקלדת חוסכים זמן ומעניקים לנו תחושה של מומחה במחשב. אז לא תירא! פיצחתי את הקוד לבניית רכיבים המפעילים ומגיבים לתרמילים במקלדת. במאמר זה, אני אלמד אותך כיצד ליצור אותם עם React, Tailwind CSS,…
-
כיצד ליצור ולשלוח תבניות דוא"ל באמצעות React Email ולשלוח מחדש ב־Next.js
יישומים מודרניים של תוכנה מסתמכים לעיתים קרובות על תקשורת בדוא"ל כדי לקשר עם משתמשים. הם יכולים לשלוח קודי אימות במהלך ניסי הכניסה, דוא"ל שיווקי או עלוני מידע, למשל. זה אומר שהודעות דוא"ל הן בדרך כלל אמצעי התקשורת הנפוץ ביותר עם משתמשים. במדריך זה, תלמד כיצד לעצב תבניות דוא"ל מרהיבות עם React Email ולשלוח אותן באמצעות Resend – פלטפורמת API פשוטה ועוצמתית לדוא"ל. דרישות מוקדמות כדי להפיק את המרב מהמדריך הזה, עליך להבין את React או Next.js בסיסית. נשתמש גם בכלים…
-
כיצד לבנות אפליקציות מרובות שפות עם i18n ב־React
עבדתי לאחרונה על פרויקט מרגש שכולל יצירת אתר אינטרנט שיכול להחליף בין שפות כדי לפנות לקהל רחב יותר. זה עזר לי להבין טוב יותר את המושג "לוקליזציה", שמתייחס בדרך כלל להתאמת תוכן כך שיהיה רלוונטי, נגיש ומעורר הזדהות עבור משתמשים בשפות ואזורי גיאוגרפיים שונים. לוקליזציה אינה רק תרגום של מילים, אלא יצירת חוויה שמאפשרת למשתמשים להרגיש בבית, לא משנה מה השפה שלהם. לדוגמה, פלטפורמות גלובליות כמו אמזון הופכות את ההחלפה בין שפות לכה חלקה שזה כמעט מרגיש קסום. מעבר לשיפור…
-
למדו React מאת בוב זירול
ללמוד React עשוי להרגיש מאתגר בהתחלה, במיוחד כאשר אין לך ביטחון איך להתחיל או כאשר אתה מתבונן ריק בעורך קוד. אך קורס הנכון עשוי לסייע לך להבין את המושגים העיקריים ולהשיג ניסיון פרקטי על ידי בניית פרויקטים בסביבה האמיתית. המאמר הוא מהקורס האחרון שפורסם בערוץ ה-YouTube של freeCodeCamp.org ומלמד אתכם React המודרני בדרך הכי מעורבת ומעשית שיש. נוצר על ידי Bob Ziroll מ-Scrimba, קורס זה מכיל מעל 170 אתגרי קידוד ושישה פרויקטים מרגשים. עם סיום הקורס, יהיה לך את הכישורים…
-
איך לבנות משחק זיכרון באמצעות React
לאחרונה, בזמן שצפה בילדתי 🧒🏻 משחקת משחקי זיכרון חינמיים בטאבלט שלה, שמתי לב שהיא מתמודדת עם מספר עצום של פרסומות ובאנרים מקישים. זה השריע אותי לבניית משחק דומה עבורה. מאחר שהיא נמצאת בתקופה של התמכרות לאנימה, החלטתי ליצור את המשחק באמצעות תמונות בסגנון אנימה חמודות. במאמר זה, אשתף אותך בתהליך בניית המשחק עבורך או עבור ילדיך 🎮. נתחיל בחקירת תכונות המשחק, ולאחר מכן נכסה את הטכנולוגיות ואת מבנה הפרויקט—שניהם ישים. לבסוף, נדון באופטימיזציות ובהבטחת משחק חלק על מכשירים ניידים 📱.…
-
בניית ופריסת אפליקציית משאבי אנוש באמצעות Refine
מבוא במדריך זה, נבנה אפליקציית ניהול משאבי אנוש עם מסגרת Refine ונפרוס אותה על פלטפורמת האפליקציות של DigitalOcean. בתום מדריך זה, תהיה לנו אפליקציית ניהול משאבי אנוש שכוללת: עמוד כניסה: מאפשר למשתמשים להיכנס כמנהל או כעובד. למנהלים יש גישה לעמודי חופשה ובקשות, בעוד שעובדים יש להם גישה רק לעמוד חופשה. עמודי חופשה: מאפשרים לעובדים לבקש, לראות ולבטל את החופשות שלהם. כמו כן, מנהלים יכולים להקצות חופשות חדשות. עמוד בקשות: נגיש רק למנהלי משאבי אנוש לאישור או דחיית בקשות חופשה. הערה:…
-
איך לבנות יישום CRUD בעזרת React ו Convex
משימוש בפעולות CRUD הוא בסיס לכל אפליקציה, לכן חשוב להפוך למומחה בהן בזמן לימוד טכנולוגיות חדשות. במדריך הוראות הזה, תלמדו איך לבנות אפליקציה CRUD בעזרת React ו-Convex. אנחנו נעבור על הפעולות האלה על ידי בניית פרוייקט שנקרא Book Collections. בפרוייקט הזה, משתמשים יוכלות להוסיף ספרים ולעדכון את מצבם אחרי שיגשגו ספר. תוכן המדריך מה הוא Convex? איך להגדיר את הפרוייקט שלך איך ליצור את השיעור איך ליצור את המסגרת המשמשת איך ליצור את הפעולות CRUD סגירה עיצוב סיכום מהו Convex?…
-
איך להעביר ארגומנטים נוספים לפעולות שרת של Next.js
מהיות השינוי האסינכרוני במידע והתייעצות לו הם משימה נחוצה בין היישומים המודרניים באפליקציות הרשת. אולי תרצו לבצע פעולה אסינכרונית נפרדת על השרת על מנת לבצע משימות כמו שימור מידע במאגר המידע, שליחת דוא״ל, הורדת PDFs, עיבוד תמונות ועוד. Next.js מעניק לנו Server Actions שהם פעולות אסינכרוניות שמבצעות על השרת. אנחנו יכולים להשתמש בפעולות השרת למוטציות מידע על השרת, אך פעולות השרת יכולות להיות מוצעות מאחד מהרשת ומהקומפוננט. פעולות השרת הן דרך טובה מאוד לטפל בתשלומים בטפסים על ידי ביצוע הפעולה…
-
איך להשתמש ב RxStomp עם React – בניית אפליקציית שיחה בעזרת STOMP וReact
STOMP הוא פרוטוקול פשוט וחזק באמת לשדרגת מסרים, שמיועד על ידי שרתים פופולריים כמו RabbitMQ, ActiveMQ ו-Apollo. שימוש בSTOMP מעל לWebSocket הוא פרוטוקול פשוט וקל, וזו היא הבחירה פופולרית לשדרגת מסרים מהדף האינטרנטי מפני שפרוטוקולים כמו AMQP מוגבלים על ידי הדפים האינטרנטיים האלה שאינם מאפשרים קישורי TCP. כדי להשתמש בSTOMP מעל לWebSocket, ניתן להשתמש ב@stomp/stompjs, אך לו יש צירופי הגשה מסובכים וAPI מורכב שמוכן לשימוש במקרים מותאמים יותר מיוחדים. למרבה המזל, יש גם את @stompjs/rx-stomp הידוע פחות, שמעניק ממשק נחמד…