משאבים חדשים עבור מעצבי אתרים ומפתחים (אוקטובר 2017)

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

בתשלומים אלה, מחצית מהרשימה שלנו תהיה על הכרזות אלה. אז, להיות מוכן להגיד שלום לעתיד!

מיטוב תמונה חיונית

זה מאמר ממצה כדי לייעל תמונה עבור האינטרנט שנכתבה על ידי אדי עוסמני. זה לא כמו לכתוב אחרים קופצים סובבים סביב איך לעשות, או לעשות את זה ו don'ts בלבד.

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

7.2

מקיף התייחסות על מה מגיע PHP 7.2. מלבד תוספות המשפרות את ביצועי היישום PHP, PHP 7.2 מגיע גם עם פחת שבו כמה דברים הולכים להיות מוסרים ואין להשתמש בהם עוד.

ב PHP 7.2, יש שתי פונקציות כי הם הולכים להיות overrecated כלומר create_function () ו __autoload (). אם אתה מפתח אינטרנט, עיין בקוד שלך ובצע שינויים הנדרשים. ראיתי רבים וורדפרס plugins כי הם עדיין באמצעות שתי פונקציות.

ממשק API לשיתוף אינטרנט

אני באמת לא רואה את ה- API מגיע לאינטרנט. עם זאת, כמחצית מהאינטראקציה שלנו באינטרנט היא בערך “שיתוף”, API זה יהיה מאוד לעשות דברים קל יותר עבור מפתחי אינטרנט כדי לבנות חוויית שיתוף יליד, במיוחד על פלטפורמת הניידים.

ממשק API זה זמין כרגע רק ב- Google Chrome עבור מחשב שולחני ו- Android. צפה בסרטון Youtube זה כדי לראות אותו בפעולה.

תמונה Async תכונה

דבר נוסף יהיה מהפכה האינטרנט הוא סינכרון תכונה עבור אלמנט img. בזמן הכתיבה, יש כמה גישות לטעון תמונה אסינכרוני זה כרוך טריק קטן של JavaScript. בקרוב נוכל רק להוסיף async = on על ה img אלמנט.

פיירפוקס

Mozilla תוקפת באגרסיביות עדכונים ל- Firefox עם שיפורים מסוימים, בשם הקוד “פרויקט הקוונטים”. הוא כולל CSS קוונטי - מנוע חדש עבור מהיר מאוד עיבוד CSS, ממשק משתמש חדש, חדש DevTools.

השחרור הוא צובר מתיחה במפתחי אינטרנט וחלקם כבר החליפו את הדפדפן הראשי שלהם ל- Firefox. יש יותר לבוא בפרויקט זה, כולל DOM קוונטי ו WebRender. האם אנחנו הולכים לראות מתחרה Node.js מבוסס על מנוע קוונטית פיירפוקס? טוב, אולי כן.

MS Edge עבור iOS ו- Android

מיקרוסופט רק הודיעה שחררו את הדפדפן האחרון שלה, Edge, ל- iOS ו- Android. כלומר, יש דפדפן אחד נוסף עבור אתרי האינטרנט שלך כדי לבדוק עם.

גוטנברג

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

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

פויטפוט

FoitFout הוא כלי שימושי להשוות שתי גישות שונות שנקרא FOIT ו FOUT ל גופנים מותאמים אישית לטעון באינטרנט - -. בעזרת כלי זה, אתה יכול לחקות את שתי הגישות ולהחליט איזו גישה היא המתאימה ביותר עבור האתר שלך.

ווארה

Vuera הוא ספריית JavaScript המאפשרת לך להשתמש ב- Vue וב- React ביחד. ניתן לכלול רכיב Vue מ .ו או להשתמש ברכיב React ב- Vue. הצוות שלך יכול להיות עכשיו יותר פרודוקטיבי עם כל מסגרת כי הם מעדיפים להשתמש.

דראגבל

“דראגבל” היא ספריה פנטסטי מ Shopify. הוא בנוי על גבי דפדפן יליד Drag-N-Drop API ומאפשר לך API נרחב לעבוד עם. במקרה, זה לא מספק משהו שאתה צריך, אתה יכול לכתוב מודול מותאם אישית כדי להרחיב את הפונקציונליות שלה. בדוק את ההדגמה כדי לראות איך זה עובד.

זרימה

כפי שהשם מרמז, FlowchartJS הוא ספריה המאפשרת בניית תרשים זרימה כמו ב- PowerPoint. באופן דומה, ניתן ליצור צורות שונות של תרשים כולל מעגל, אליפסה, מרובע, יהלום, משולש, וכו '.

מהיר

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

Mocka

Mocka הוא מציין מיקום תוכן שבו אתה יכול להשתמש עבור אתר אינטרנט prototyping. זה רק 500 בתים להתאמה אישית מלאה. אתה יכול בקלות לכלול אותו בקובץ CSS של הפרויקט שלך באמצעות mixin Sass.

ה CSS מספק מספר שיעורים כולל mocka-media כדי ליצור מציין מיקום של תמונה, mocka הכותרת כדי ליצור כותרת, ו טקסט- mocka כדי ליצור טקסט שרירותי.

VueStar

VueStar הוא Vue רכיב להוסיף אפקט מוגזים בעת לחיצה על סמל, בדומה למה טוויטר עושה עם “לב” סמל באפליקציה לנייד שלהם. הרכיב מציג אלמנט חדש בשם כוכב שבו אתה יכול להוסיף אותו בעידן האינטרנט. וסיימת!

רשת משחקים

רשת CSS מציגה תפיסה חדשה באינטרנט כדי לבנות פריסה וזה סוג של מורכבות במבט ראשון בהתחשב בתכונות חדשות רבות יש לה.

GridPlayground הוא בעצם יוזמה מוזילה ללמד CSS רשת לדחוף את ה- CSS רשת אימוץ קדימה. גם Firefox מביא כלי חדש כדי DevTools לבדוק פריסת רשת.

מנהל Snippet

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

ממשק עם כרטיסיות

גדול ללכת על דרך בניין ניווט מתקדם ונגיש עם שימוש מינימלי של JavaScript. משאב נהדר עבור אלה שרוצים ללמוד עוד על עיצוב נגיש.

SwissInCSS

SwissInCSS מציג כמה עיצובי פוסטרים שווייצריים קלאסיים, ללא שימוש ב- CSS. קוד המקור זמין ב- CodePen.