הכירות עם מבנה ה- Layout של אפליקציית Grid ב- Windows 8

יום שלישי, ספטמבר 18, 2012

תבנית ה- Grid ב- Visual Studio היא התבנית הפופולרית ביותר לפיתוח אפליקציות Windows 8. בפוסט בניית קורא RSS ל- Windows 8 עם HTML5 עשיתי שימוש בתבנית הזאת לבניית קורא RSS פשוט, ואני ממליץ להתחיל בו לצורך לימוד פיתוח אפליקציות ל- Windows 8 עם HTML ו- JavaScript. ברוב המקרים, נרצה לקסטם את מראה האפליקציה שלנו, וכדי שנוכל לעשות את זה באופן יעיל ופשוט, כדאי להכיר את מבנה ה- Layout של תבנית ה- Grid. תבנית ה- Grid מורכבת מ- 3 סוגי מסכים: המסך הראשי, הכולל נתונים מקובצים לפי קטגוריות, עמוד קטגוריה, המכיל...
no comments

מדריך: בניית אפליקציית מטרו לניוזגיק עבור Windows 8 עם JavaScript ו- HTML5

יום שני, מאי 7, 2012

במדריך זה נראה צעד אחרי צעד כיצד לבנות אפליקציית מטרו ל- Windows 8 באמצעות JavaScript ו- HTML5. האפליקציה מציגה את הכתבות האחרונות מניוזגיק בחלוקה לקטגוריות השונות. המדריך מבוסס על גירסת ה- Consumer Preview של Windows 8 ועל גירסת ה- Beta של Visual Studio 11, כך שיתכנו שינויים בתבניות, ב- API’s ובכלי הפיתוח ביום בו תעשו שימוש במדריך הזה. מה צריך להכין לפני? כדי לפתח אפליקציות ל- Windows 8 צריך להוריד ולהתקין Windows 8. ניתן גם להתקין כ-...
no comments

הבטחות לעתיד: תכנות אסינכרוני ב- JavaScript עם Promises

יום שני, דצמבר 12, 2011

תכנות אסינכרוני הופך פופולרי יותר ויותר באפליקציות ה- Web, אך מצד שני, ב- JavaScript הוא אינו קל לביצוע כיום. ספריות ה- JavaScript הפופולריות (כמו jQuery, Dojo ועוד) הוסיפו רמת אבסטרקציה בשם Promise (לפעמים נקראת deferred) כדי להפוך את התכנות האסינכרוני ב- JavaScript לפשוט יותר. בפוסט זה נראה איך להשתמש ב- Promises באפליקציות Web. נדגים את השימוש ב- Promisses עם XMLHttpRequest2 (בקיצור XHR2). תכנות אסינכרוני: למה זה כ”כ קשה? די ברור שאפליקציה שמבצעת חלק מהעבודה ברקע מגיבה טוב יותר למשתמש ויכולה לבצע יותר משימות. אך...
no comments

מדריך jQuery Mobile – רשימות

יום רביעי, אוקטובר 19, 2011

אפליקציות רבות מציגות נתונים בצורת רשימות, ובעת התאמת האפליקציות לדפדפן סלולרי עלינו להשקיע מחשבה לגבי איך יראו הרשימות באפליקציה הסלולרית. jQuery Mobile מכילה תמיכה מצויינת ברשימות, ובפוסט זה נראה זאת ע”י בניית אפליקציה המציגה רשימה מעוצבת שלמשתמשים בטוויטר התומכת בקטגוריות, סינון ועוד, שנראית כך: בסוף הפוסט תמצאו את ה- HTML המלא של הדוגמא. רשימה פשוטה נתחיל מרשימה פשוטה של הכינויים בטוויטר של מספר אנשי מיקרוספוט מוכרים וכן מספר MVP’s, הבנוייה מתגיות HTML סטנדרטיות. <div data-role="content">  <ul>    <li>@bursteg</li>    <li>@maordp</li>    <li>@scottgu</li>   ...
8 comments

פיתוח אתרי HTML5 מודרניים עם Modernizr

יום שני, יולי 25, 2011

בזמן שפיתוח אתרים מודרניים העושים שימוש במגוון יכולות של HTML5, CSS3 ו- JavaScript API’s חדשים הולך וצובר תאוצה, עלינו להתמודד עם בעיית התאימות למגוון גירסאות הדפדפנים שנמצאים בשימוש אצל המשתמשים. כיוון שכל דפדפן תומך באלמנטים אחרים של הסטנדרטים המתקדמים באופן טיפה שונה וקצב שונה, עלינו לדעת אילו יכולות עומדות לרשות המשתמש שלנו בדפדפן בו הוא משתמש כדי להציג לו את האתר ולאפשר לו להינות ממנו. Feature Detection במקום Browser Detection במשך שנים הדרך לזהות אילו יכולות נתמכות בדפדפן המשתמש הייתה לבדוק את ה- user agent של...
4 comments

HTML5: קריאת תוכן קובץ בצד הלקוח ב- JavaScript עם File API

יום שישי, יולי 22, 2011

פוסט זה הוא פוסט נוסף בסדרה עבודה עם קבצים בצד הלקוח באמצעות File API. בפוסט הקודם הבנו את המוטיבציה לשימוש ב- File API, הכרנו את האובייקטים המרכזיים ב- API וראינו דוגמא פשוטה לקבלת פרטי קבצים שנבחרו ע”י המשתמש. בפוסט זה, נראה כיצד לקרוא את תוכן הקובץ בצד הלקוח ב- JavaScript ומה אפשר לעשות עם התוכן הזה. קריאת תוכן הקובץ עם האובייקט FileReader בפוסט הקודם, ראינו דוגמא שבה המשתמש בוחר קבצים מהמחשב המקומי, ובפונקציית הטיפול באירוע בחירת הקבצים קיבלנו גישה לאובייקטים מסוג File, שאפשר לנו ללמוד מספר פרטים בסיסיים על הקובץ...
one comment

HTML5: עבודה עם קבצים בצד הלקוח באמצעות File API

יום רביעי, יולי 20, 2011

HTML5 מאפשר לגשת בצד הלקוח לקבצים המקומיים באמצעות ספסיפיקציית ה- File API. בפוסט זה אתן מעט רקע ומוטיבציה לשימוש ב- File API ואציג דוגמא בסיסית לשימוש בו. למה בכלל צריך את זה? עד היום, מפתחים נאלצו להעלות את קבצים לשרתי האתר כדי לפתוח אותם ולעבוד עם התוכן שלהם, לעיתים, רק כדי לגלות שה- mime type של הקובץ אינו נכון, או שהוא גדול מדי לדרישות האתר. חוסר היכולת לגשת לקובץ בצד הלקוח, הביא לא פעם לעומס מיותר על הרשת, בזבוז שטח אחסון וניצול זמן CPU מיותר בצד השרת. ...
no comments

HTML5: טעינה וביצוע של JavaScript באופן אסינכרוני

יום חמישי, יולי 14, 2011

טעינת קבצי JavaScript היא אחד הגורמים הפופולרים לבעיות ביצועים של אפליקציות באינטרנט. כאשר הדפדפן נתקל בתגית script, הוא עוצר את תהליך הרינדור, טוען את קובץ ה- script ומריץ את הקוד. באותו זמן, הדפדפן לא ממשיך את תהליך הרינדור של הדף או מבצע שום דבר שימושי אחר, כיוון שהסקריפט יכול לכתוב לדף, לשנות אלמנטים קיימים או אפילו לנתב את הגולש לדף אחר. פיתרון נפוץ – סקריפט בסוף הדף פיתרון נפוץ, הוא לשים את תגי ה- script בסוף עמוד ה- HTML, ממש לפני התגית <body/>. אמנם זה לא יפתור את העובדה שהדפדפן...
no comments