משאבי מפתח אינטרנט מגה קומפילציה

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

להלן יש לי להרכיב אוסף עצום של כמה ממש שימושי מפתח משאבי אינטרנט. אלה כוללים חומר למתחילים עבור HTML5 / CSS3 יחד עם תיאוריות מורכבות יותר עבור JavaScript ו- PHP תכנות. זה אפשרי עבור כמה מפתחים נלהבים ללמוד שפות אלה ולבנות יישומי אינטרנט פופולריים בפראות דומה טוויטר או Tumblr. אם יש לך עניין נכסים מועילים עבור מפתחי אינטרנט מודרני אז אתה אוהב את זה אוסף של משאבים מהימנים.

מגזינים מקוונים מועילים

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

בהתאם לסוג השפה שאתה מקודד, היא תקבע את העניין שלך בכל אחד מהבלוגים האלה. אנו יכולים להתמקד בפיתוח אינטרנט ולניחוש זה כולל את כל העבודה הקדמית (HTML5 / CSS3 / JavaScript) וכן סקריפטים פשוטים עורפיים (PHP / RoR / Python / SQL). לקחתי את החופש של בניית רשימה אחת של הבלוגים הפופולריים ביותר dev אשר מתמקדים הן הקדמי ואת קוד העורפיים.

• Nettuts+
• 24 דרכים
• Webmonkey
• פיצוץ קידוד
• Webitect
• בדוק את האלמנט
• חתולים מי קוד
• בלוג עיצוב בלוג 25

יש בהחלט רבים אחרים לשקול. אני ממליץ להכות את Google בחיפוש אחר הדרכות ומאמרים על שפת dev המועדפת עליך. לאחר מכן באמצעות צובר להאכיל RSS כמו Google Reader אתה יכול להגדיר רשימות של כל המאמרים האחרונים מתוך מגזינים אלה. זוהי דרך מצוינת להתחיל את יום העבודה שלך, או אפילו להרוג קצת זמן chugging באמצעות הדרכות.

תוספים jQuery גאלור

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

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

באופן כללי אני גם ממליץ לגלוש באתרי אינטרנט של Ajax Blender ו- Dynamic Drive עבור קטעי קוד / plugins של JavaScript. הספרייה אינה ענקית, אך היא גדלה בהתמדה מתוכן חדש שנשלח על ידי משתמשים. האתרים כוללים לא רק plugins jQuery אלא גם MooTools ו ספריות אב טיפוס.

אם אתה עושה בסופו של דבר לעבוד עם הספרייה jQuery נייד אני רוצה להמליץ ​​על כלי אחר jqmPhp. זה בכיתה PHP דינמי שבו אתה יכול להתייחס פונקציות פשוטות קווי פלט וקווים של קוד HTML5 מופעל באמצעות jQuery נייד. זה באמת הדרך הקלה ביותר אב טיפוס דינמי Apps ניידים בנוי סביב פגז PHP. הבלוג באתר יש שפע של הפניות לדוגמה לחפור.

בניית HTML5 ו- CSS3

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

ראשית אני צריך להתחיל על ידי recommending HTML5 Boilerplate. זוהי תבנית חשוף חשוף בתבנית הכוללת את כל “רגיל” HTML5 אלמנטים בדף אינטרנט בחבילה אחת. זה כולל גליון סגנונות ברירת מחדל, JavaScript, סמל מועדף, סמלים לגעת Apple, ועוד הרבה דברים טובים אחרים. זה פרוייקט חינם 100% ואתה יכול אפילו לתרום על ריפו Github שלהם. זהו משאב חובה עבור כל המפתחים לפני שמתחילים על כל פרויקט אינטרנט רציני.

עכשיו אם אתה עובד מחוץ boilerplate אז יש לך את האפשרות של הוספת כל קוד מותאם אישית משלך. אבל אני מציע לקחת את הצעד הבא ואת הבניין עם יישום כגון Initializr. זה יפיק פריסת אתר טיפוסי ואפילו מאפשרים לך להתאים אישית אילו אלמנטים כלולים בתוך החבילה boilerplate שלך. קוד Google Analytics, קבצי jQuery, קבצי htaccess או web.config, ועוד כ -12 אפשרויות אחרות זמינות.

מעצבי CSS

עכשיו שאנחנו כבר נראה קצת HTML5 קידוד אנחנו צריכים גם לשקול כמה מסגרות CSS3 פופולרי. אלה יותר פתוחים מאשר תבניות HTML מאז אתה יכול לעשות הרבה יותר עם CSS. המעצבים יבינו גם את הקושי בבניית קוד תואם לתקנים לכל דפדפני האינטרנט המודרניים.

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

כשמדובר CSS כלים, עם זאת, CSS3 Pie צריך להיות בראש שלי שלושה מועדפים. זה יישום אינטרנט פשוט אשר פלט את הקוד הנכון לעבד CSS3 תופעות הנתמכות ב- Internet Explorer 6-9. ניתן ליצור שיפוע ליניארי דינמי, פינות מעוגלות, וצללי תיבות עם הגדרות הניתנות להתאמה אישית. באתר יש דוגמאות IE אם אתה רוצה לבדוק אותם גם כן.

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

התאמה אישית של ערכות נושא עם WordPress

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

המהדורה החדשה של קונסטליישן Theme מעניקה למפתחי וורדפרס נקודת התחלה קלה יותר מאשר תבניות ברירת המחדל. הנושא החדש עשרים עשרה הוא ערמומי מאוד מינימליסטי, אבל זה לא יכול להתחרות עם תבנית נושא שלם בנוי על גבי HTML5Boilerplate. ערכת הנושא WP של קבוצת הכוכבים כוללת גם שאילתות מדיה עבור רזולוציות מכשירים שונות, כגון טאבלטים של iPhone ו- iPad.

Wonderflux עוד נושא תבנית וורדפרס אשר לא ממש רחוק לאורך הפיתוח. זה היה רק ​​לאחרונה יצא מתוך ביתא לתוך v1.0 יחד עם כמה תיעוד מקוון. נושא זה הוא קצת יותר מסובך קונסטליישן אשר נותן לך שליטה רבה יותר על הפריסה. היזמים כללו ווים מותאמים אישית PHP, פונקציות, מסננים כדי להפוך את האתר שלך וורדפרס דינמי יותר.

מפתחי WP רציניים צריכים לבדוק את שני הפתרונות כדי לראות אם אחד מהם יעזור לעבוד על הפרויקט בעתיד.

מציאת מפתח אינטרנט

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

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

הגלריה כוללת מאות דוגמאות של HTML / HTML5 קוד תבנית, CSS3 ספריות, ובוודאי הרבה דברים jQuery גם כן. אני גם מצאתי את זה הוא אתר אינטרנט גדול כדי להגיש קוד מקור משלך לציבור. השם שלך קשור להגשה, ובנוסף תוכל להציב קישורים לאתר שלך שבו המשתמשים יכולים לגשת לקוד.

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

מגמה מאוד פופולרי בפיתוח האינטרנט המודרני הוא בניית APIs כמו צד שלישי App. רוב המיינסטרים הרשתות החברתיות המותגים כוללים API עובד קטע התיעוד הנכון באתר האינטרנט שלהם. בנוסף יש טונות של שיעורים חינם עטיפה על Github שנכתבו בכל הגדולות תכנות עורפיים סוף שפות.

מפתחים צריכים להרגיש בנוח לעבוד עם סוגים אלה של ספריות קוד כפי שהם גדלים בביקוש. באמצעות מערכת OAuth אתה יכול לבנות במהירות userbase מ רבים של יישומים אלה. אני המפורטים להלן רק כמה הפניות APIs מקוונים פופולריים ותיעוד מלא שלהם.

• ממשק API של Twitter
• ממשק API של CloudApp
• ממשק API של Instagr.am
• API API
• Foursquare API
• Dribbble API
• ממשק API של Github

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

Q & A משאבים

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

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

טריק מסודר למדתי היא לחפש באמצעות Google ולראות אם הבעיה שלך כבר נפתרה. הזן כמה מילות מפתח בחיפוש Google שלך ​​וציין את הסיומת אתר: stackoverflow.com. כל תוצאות החיפוש שהוחזרו יהיו שאלות מתוך ארכיון ערימת מחסניות - אם יש לך מזל, ייתכן שתמצא בדיוק את הפתרון לבעיה הנוכחית שלך.

בדיקת מהירות דף מקוון

זה כלי חדש הוצא על ידי Google מפתחים למעשה היה מרשים באמת. האפליקציה Speed ​​Page Online תנתח את תוכן האתר שלך ותיצור דוח ניתוח במהירויות שלך. זה כולל פתרונות אפשריים כדי להפחית את זמני הטעינה ולשמור את המבקרים באתר יותר.

הוא גם יכול לעזור לך לקבוע בעיות בשיעורי יציאה מדף כניסה ובהמרות נמוכות יותר. Google Analytics הוא חובה עבור כל אתר, אבל אני מרגיש כי מהירות דף רק משיגה רמה גבוהה יותר של ניתוח.

פלט הדו"ח מדורגת מעדיפות גבוהה עד נמוכה ולעתים קרובות כוללת פריטים רבים ושונים. אם אתה מבין setups LAMP ועובד על שרתי Apache אז אתה יכול גם לשקול את מודול mod_pagespeed. זה מבצע באופן אוטומטי רבים של אופטימיזציות אלה באתר שלך כדי להקטין את זמני הטעינה במטמון נתונים חשובים באינטרנט (תמונות, סמלים, סקריפטים).

התוכנה של המפתחים הטובים ביותר

בין שתי מערכות ההפעלה הפופולריות ביותר, ניתן למצוא עשרות תוכניות. מ תוכנות גרפיקה קוד המקור עורכי IDEs, ישנם משאבים רבים עבור מפתחי אינטרנט לבחירה. אבל אם אתה מחפש הצעות פופולריות אני ממליץ על הכותרות הבאות.

Mac OS X

פאניקה היא חברת תוכנה שיצרה קודה - על ידי יישום האינטרנט הטוב ביותר עבור Mac. יש לך גישה לעורך קוד מקור, מסוף ולקוח FTP שבו באפשרותך לבצע שינויים ישירות בקובצי השרת. Coda בנוסף תומך רשימה ארוכה של הדגשת תחביר עבור שפות כגון HTML, XML, CSS, JavaScript, PHP, SQL, ועוד רבים.

אם זאת אתה צריך פתרון חינם, אתה צריך לבדוק Komodo ערוך. התוכנה פותחה עבור Windows ו- Mac, קוד פתוח, לגמרי בחינם להורדה. זה כולל את כל התמיכה תחביר הדגשת שפע של תכונות דומות כמו Coda (לא FTP לצערי). TextWrangler הוא עוד פתרון חינם ייתכן שתרצה לנסות, גם רק עורך טקסט פשוט.

לקבלת יישום חינם FTP לבדוק את Cyberduck על Mac App Store. למרות אישית אני מעדיף חלופה שילם כגון Yummy FTP או Transmit.

Microsoft Windows

חבילת התוכנה Adobe תמיד מגיע דעתך כאשר אתה חושב על עיצוב אתרים ופיתוח. משתמשי Windows יש הרבה חלופות Dreamweaver, ורבים מהם לגמרי בחינם.

Notepad + + הוא דוגמה מצוינת של כמה תוכנות קוד פתוח Win32. הפרויקט נמצא עדיין בפיתוח פעיל ומשחרר עדכונים תכופים (כמעט חודשיים). אני אוהב את ממשק לשוניות שלהם ותמיכה עבור כל כך הרבה תוספים נוספים. כפי שציינתי לעיל Komodo ערוך מוצע גם עבור Windows XP / Vista / 7, אז אתה יכול לנסות את זה כחלופה.

מפתחי אינטרנט ב- Windows הם גם ללא לקוח FTP. Filezilla היא כנראה החלופה החופשית הפופולרית ביותר. לקבלת חלופות, לבדוק את רשימת לקוחות FTP בחינם יחד עם כלים דומים.

משאבים אחרים שימושי Dev

• 100 Essential אינטרנט כלי פיתוח
• המיטב של 2011: הטוב ביותר שימושי jQuery תוספים הדרכות
• רובי on Rails הדרכות למתחילים פיתוח אינטרנט
• 7 מרגש פיתוח מגמות אינטרנט עבור 2011

סיכום

עד כה הרבע הראשון של 2012 יש בבעיטה עם המפץ! כבר ראינו כמה תוכן מדהים שנשפך מתוך מעצבים ומפתחי אינטרנט מכל רחבי העולם. מקצועני הבניין עבור האינטרנט יש כל כך הרבה כלים לרשותם לעומת לפני 1-2 שנים.

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