الصفحة الرئيسية » تصميم المواقع » موارد مطور الويب تجميع ضخم

    موارد مطور الويب تجميع ضخم

    الإنترنت ينمو باستمرار وهناك مئات الآلاف من الموارد الجماعية لمطوري الويب القادمين. من المقالات على الإنترنت ، والبرامج التعليمية ، والأدوات ، والأدلة ، إلى مقاطع الفيديو ، يمكنك التعرف على أي شيء عبر الويب. لم يكن من الأسهل مطلقًا القفز عبر الإنترنت!

    لقد وضعت أدناه مجموعة كبيرة من بعض موارد مطور الويب المفيدة للغاية. وتشمل هذه المواد للمبتدئين HTML5 / CSS3 جنبا إلى جنب مع نظريات أكثر تعقيدا للبرمجة جافا سكريبت و PHP. من الممكن أن يقوم مطوران متحمسان بدراسة هذه اللغات وإنشاء تطبيقات ويب شائعة للغاية مثل Twitter أو Tumblr. إذا كنت مهتمًا بأصول مفيدة لمطوري الويب العصريين ، فستحب هذه المجموعة من المصادر الموثوقة.

    مجلات مفيدة على الإنترنت

    لقد انفجر عالم التدوين حيث قام مئات الآلاف من الكتاب الجدد بالانضمام إلى الإنترنت. تركز العديد من هذه المدونات عبر الإنترنت على التصميم وتطوير الويب. يمكنك العثور على الكثير من الموارد المفيدة من خلال التقليب عبر موجز ويب لـ RSS.

    بناءً على نوع اللغة التي ترميزها ، ستحدد مدى اهتمامك بأي من هذه المدونات. يمكننا التركيز على تطوير الويب ونفترض أن هذا يشمل جميع الأعمال الأمامية (HTML5 / CSS3 / JavaScript) وكذلك البرامج النصية الخلفية البسيطة (PHP / RoR / Python / SQL). لقد حصلت على حرية إنشاء قائمة واحدة من مدونات ديف الأكثر شعبية والتي تركز على كل من الواجهة الأمامية والرمز الخلفي.

    • Nettuts+
    • 24 طرق
    • Webmonkey
    • تحطيم الترميز
    • Webitect
    • تدقيق العنصر
    • القطط الذين كود
    • Line25 تصميم مواقع بلوق

    هناك بالتأكيد العديد من الآخرين للنظر فيها. أوصي بضرب Google بحثًا عن البرامج التعليمية والمقالات المتعلقة بلغتك المفضلة. ثم باستخدام أداة تجميع خلاصات RSS مثل Google Reader ، يمكنك إعداد قوائم بجميع أحدث المقالات من هذه المجلات. هذه طريقة رائعة لبدء يوم عملك ، أو حتى قتل القليل من الوقت في البحث عن البرامج التعليمية.

    مسج الإضافات وفرة

    اكتسبت كل من مكتبة jQuery الأساسية و jQuery Mobile الكثير من الجر في العام الماضي. تعمل هذه المكتبات مفتوحة المصدر على تصميم تجربة مقدمة مليئة بالرسوم المتحركة الغنية وميزات Ajax سهلة التنفيذ ، على الرغم من أن مكتبة الهاتف المحمول لم تلتحق بوالدها من حيث المكونات الإضافية ورمز الجهة الخارجية.

    وبالمثل ، يمكن استخدام منتج bgStretcher الرائع كبرنامج نصي ديناميكي للخلفية. سوف يستغرق الأمر سلسلة من الصور ، وبعض التحجيم من الأحجام يتناسب مع دقة شاشة المستخدم الخاص بك. تحقق من عرض رائع لرؤية هذا في العمل. كل من هذه المكونات الإضافية مجانية للتنزيل ، وتتصرف كأمثلة بسيطة لرمز الطرف الثالث الرائع الذي تم إنشاؤه في مسج. العمل مع هذه الموارد سيوفر لك الكثير من الوقت في عمل المشروع حتى لا تضطر إلى إعادة اختراع العجلة.

    بشكل عام ، أوصي أيضًا بتصفح مواقع الويب Ajax Blender و Dynamic Drive للحصول على مقتطفات / مكونات رمز JavaScript. المكتبة ليست ضخمة ولكنها تنمو باستمرار من محتوى جديد مقدم من المستخدم. لا تتضمن المواقع الإضافات jQuery فقط ولكن أيضًا MooTools ومكتبات Prototype.

    إذا انتهى بك الأمر إلى العمل مع مكتبة jQuery Mobile ، فأود أن أوصي بأداة أخرى jqmPhp. إنها فئة PHP ديناميكية حيث يمكنك الرجوع إلى وظائف بسيطة إلى خطوط وخطوط شفرة HTML5 مدعومة من خلال jQuery Mobile. إنها بصراحة أسهل طريقة لنموذج أولي لتطبيقات الجوال الديناميكية المبنية على غلاف PHP. تحتوي مدونة الموقع على الكثير من المراجع التي يمكنك البحث فيها.

    بناء في HTML5 و CSS3

    عندما نتحدث عن تطوير الشبكة الأمامية ، فإن الأمر كله يتعلق بالكفاءة. ليس لديك نفس المشكلات في إنشاء موقع ويب بتنسيق HTML / CSS كما تفعل مع تشفير تطبيق Ruby الخلفي. لا يوجد أي منطق حقيقي أو معالجة الأخطاء في HTML - إنه في الغالب يدور حول مدى السرعة التي يمكنك بها قياس تصميم تخطيط بشكل صحيح في جميع المتصفحات.

    أولاً يجب أن أبدأ بالتوصية بـ HTML5 Boilerplate. هذا هو قالب عارية تجريده الذي يشمل جميع “اساسي” عناصر صفحة الويب HTML5 في حزمة واحدة. يتضمن ذلك ورقة أنماط افتراضية وجافا سكريبت وفافي وأيقونات Apple touch والكثير من الأشياء الجيدة الأخرى. إنه مشروع مجاني بنسبة 100 ٪ ، ويمكنك حتى المساهمة في إعادة شراء Github. يعد هذا مصدرًا ضروريًا لجميع المطورين قبل البدء في أي مشروع ويب جاد.

    الآن إذا كنت تعمل على إيقاف تشغيل هذا النموذج ، فأمامك خيار إضافة جميع التعليمات البرمجية المخصصة الخاصة بك. لكنني أقترح اتخاذ الخطوة التالية والبناء باستخدام تطبيق مثل Initializr. سيؤدي ذلك إلى إنشاء تخطيط موقع إلكتروني نموذجي ، ويسمح لك حتى بتخصيص العناصر التي يتم تضمينها داخل حزمة النمذجة الخاصة بك. تتوفر Google Analytics أو ملفات مسج مصغرة أو ملفات htaccess أو web.config بالإضافة إلى حوالي عشرة خيارات أخرى.

    مصممي CSS

    الآن وبعد أن نظرنا قليلاً في ترميز HTML5 ، يجب علينا أيضًا التفكير في بعض أطر CSS3 الشائعة. هذه هي أكثر مفتوحة من قوالب HTML حيث يمكنك أن تفعل أكثر من ذلك بكثير مع CSS. سوف يدرك المصممون أيضًا صعوبة بناء كود متوافق مع المعايير لجميع متصفحات الويب الحديثة.

    يعد نظام الشبكة الذهبية رائعًا كإطار لتصاميم الويب سريعة الاستجابة. سوف تتكيف هذه المخططات مع شاشات المحمول وستتم طيها إلى الداخل أثناء تغيير حجم نافذة المتصفح. كما أنه يساعد في تخطيط عرض وحجم كل منطقة العمود. Blueprint هو إطار CSS مفيد آخر يجب عليك التحقق منه. انه امر رائع لبناء مواقع مخصصة ويقدم وثائق رائعة.

    عندما يتعلق الأمر بأدوات CSS ، ومع ذلك ، يجب أن يكون CSS3 PIE في قائمة أفضل ثلاثة مفضلة لدي. إنه تطبيق ويب بسيط يقوم بإخراج الشفرة المناسبة لتقديم تأثيرات CSS3 المدعومة في Internet Explorer 6-9. يمكنك إنشاء تدرجات خطية ديناميكية وأركان مستديرة وظلال مربعة بإعدادات قابلة للتخصيص. يحتوي الموقع على أمثلة IE إذا كنت تريد التحقق منها أيضًا.

    سيبحث المطورون أيضًا عن تقليل أحجام ملفاتهم للإنتاج. Clean CSS هو مورد واحد حيث يمكنك الاختيار من بين العديد من الخيارات لتبسيط التعليمات البرمجية وتقليل حجم الملف. لا يقدم Code Beautifier بديل آخر العديد من الخيارات ولكن قد يكون من الأسهل استخدامه.

    تخصيص المواضيع مع وورد

    يعد نشر WordPress هو الأكثر شعبية في CMS في هذا العصر. لقد رأينا الملايين من المدونات والمواقع الإلكترونية الجديدة التي تعمل جميعها بواسطة حل إدارة المحتوى الرائع هذا. وعلى هذا النحو ، فإن مطوري WordPress يطالبون بشدة بإنشاء عناصر واجهة مستخدم مخصصة وموضوعات موقع الويب.

    يوفر الإصدار الجديد من Constellation Theme لمطوري WordPress نقطة بداية أسهل من القوالب الافتراضية. يتميز Twenty Eleven الجديد بمهارة وبساطة ، ولكنه لا يمكنه التنافس مع قالب سمة بأكمله مبني على HTML5Boilerplate. يتضمن سمة Constellation WP حتى استعلامات الوسائط لمختلف قرارات الجهاز مثل أجهزة iPhone و iPad اللوحية.

    Wonderflux هو قالب سمة WordPress آخر ليس بعيدًا عن التطوير. تم إصداره مؤخرًا من الإصدار التجريبي إلى الإصدار 1.0 مع بعض الوثائق عبر الإنترنت. هذا الموضوع أكثر تعقيدًا من كونستيلشن الذي يمنحك المزيد من التحكم في التصميم. قام المطورون بتضمين خطافات PHP مخصصة ووظائف ومرشحات لجعل موقع WordPress الخاص بك أكثر ديناميكية.

    يجب على مطوري WP الخطرين التحقق من كلا الحلين لمعرفة ما إذا كان أي منهما سيساعد في العمل في المشروع في المستقبل.

    العثور على مطور ويب المجانية

    بالمقارنة مع PSDs والرسومات ، يبدو مجتمع تطوير الويب غير موجود قليلاً في معارض الهدية الترويجية. يمكنك دائمًا العثور على برامج نصية رائعة على Github ، ولكن عليك غالبًا البحث حولها واختبارها بنفسك.

    من الصعب العثور على مواقع الويب التي توفر التنزيلات والعروض التوضيحية المجانية وكذلك أمثلة البرامج النصية. المورد الجديد المفضل لدي هو CodeVisually الذي يقوم بتفكيك أدوات التطوير التي يقدمها المستخدم والإضافات والمكتبات وأشياء أخرى أنيقة. يتم الإعداد مثل معرض حيث تحتوي كل صفحة على رابط للمنتج ، لقطة شاشة تجريبية ، وبعض التفاصيل الأخرى.

    يشتمل المعرض على مئات الأمثلة من رمز قالب HTML / HTML5 ، ومكتبات CSS3 ، وبالتأكيد الكثير من عناصر jQuery أيضًا. لقد وجدت أيضًا أن هذا موقع ويب رائع لتقديم شفرة المصدر المفتوح الخاصة بك إلى الجمهور. يرتبط اسمك بالطلب ، بالإضافة إلى أنه يمكنك وضع روابط إلى موقع الويب الخاص بك حيث يمكن للمستخدمين الوصول إلى الرمز.

    واجهات برمجة تطبيقات تطبيق الويب

    هناك اتجاه شائع للغاية في تطوير الويب الحديث وهو بناء واجهات برمجة التطبيقات كتطبيق طرف ثالث. تشتمل معظم ماركات الشبكات الاجتماعية الرئيسية على واجهة برمجة تطبيقات (API) وعملية توثيق مباشرة على موقع الويب الخاص بها. بالإضافة إلى أن هناك الكثير من فصول المجمع المجانية على جيثب مكتوبة بجميع لغات البرمجة الرئيسية.

    يجب أن يشعر المطورون بالراحة في التعامل مع هذه الأنواع من مكتبات الأكواد لأنها تتزايد في الطلب. باستخدام نظام OAuth ، يمكنك إنشاء قاعدة مستخدم بسرعة من العديد من هذه التطبيقات. لقد أدرجت أدناه بعض الإشارات إلى واجهات برمجة التطبيقات الشائعة عبر الإنترنت والوثائق الكاملة الخاصة بها.

    • تويتر API
    • CloudApp API
    • Instagr.am API
    • موقع ئي باي API
    • شخصيات قصص الابطال الخارقين API
    • Dribbble API
    • واجهة برمجة تطبيقات Github

    استفد من هذه الموارد في المشاريع الجديدة كلما أمكن ذلك. أصبحت الويب أكثر اتصالًا ويتدفق المستخدمون دائمًا إلى التطبيق الكبير التالي. يمكنك تجنيد الآلاف من الأعضاء المتفانين في تطبيقك عندما لا يحتاج زوارك إلى تسجيل حساب جديد بالكامل ويمكنك بدلاً من ذلك الاشتراك مباشرة من خلال Twitter أو Facebook.

    سؤال وجواب الموارد

    إن التجربة الأكثر فائدة بين المطورين هي طرح الأسئلة وتعلم تقنيات جديدة. مجتمع المطورين دائمًا ما يكون مفيدًا للوافدين الجدد وعلى استعداد لتقديم خبراتهم في العديد من المواقف. إذا كان لديك أي صراعات أو أسئلة محددة في مشروع ما ، فابحث عبر Google عن منتدى مطور ويب ذي صلة.

    يجب أن أوصي شخصيًا بالانضمام إلى مجتمع Stack Exchange إذا لم تكن عضوًا بالفعل. يتضمن ذلك مواقع ويب مذهلة مثل Stack Overflow و Super User حيث يمكنك الحصول على مساعدة البرمجة على أي شيء بشكل أساسي. أعضاء المجتمع على دراية بجميع لغات الويب الرئيسية بما في ذلك فصول مسج و PHP أصغر.

    إحدى الخدع الأنيقة التي تعلمتها هي البحث عبر Google ومعرفة ما إذا كانت مشكلتك قد تم حلها بالفعل. أدخل بعض الكلمات الرئيسية في بحث Google وألحق اللاحقة الموقع: stackoverflow.com. ستكون جميع نتائج البحث التي تم إرجاعها أسئلة من داخل أرشيفات Stack Overflow - إذا كنت محظوظًا ، فقد تجد بالضبط حل لمشكلتك الحالية.

    اختبار سرعة الصفحة على الإنترنت

    كانت هذه الأداة الجديدة التي وضعها مطورو Google مثيرة للإعجاب حقًا. سيقوم التطبيق Page Speed ​​Online بتحليل محتوى موقع الويب الخاص بك وإنشاء تقرير تحليلي عن سرعاتك. يتضمن ذلك الحلول الممكنة لتقليل أوقات التحميل والحفاظ على زوار موقعك لفترة أطول.

    يمكن أن يساعدك أيضًا في تحديد المشكلات المتعلقة بمعدلات الارتداد وتحويلات أقل. يعد Google Analytics أمرًا ضروريًا لأي موقع ويب ، لكنني أشعر أن سرعة الصفحة تصل إلى مستوى أعلى من التحليل.

    يتم تصنيف مخرجات التقرير من الأولوية العليا إلى المنخفضة وغالبًا ما تتضمن العديد من العناصر المختلفة. إذا فهمت إعدادات LAMP وتعمل على خوادم Apache ، فيمكنك أيضًا التفكير في وحدة mod_pagespeed. يقوم تلقائيًا بتنفيذ العديد من هذه التحسينات على موقع الويب الخاص بك لتقليل أوقات التحميل وذاكرة التخزين المؤقت لبيانات الويب الهامة (الصور والرموز والبرامج النصية).

    أفضل برامج المطور

    بين أكثر أنظمة التشغيل شعبية ، يمكنك العثور على العشرات من البرامج. من برامج الرسومات إلى برامج تحرير التعليمات البرمجية المصدر و IDEs ، هناك العديد من الموارد لمطوري الويب للاختيار من بينها. ولكن إذا كنت تبحث عن اقتراحات شعبية ، أوصي بالعناوين التالية.

    نظام التشغيل Mac OS X

    Panic هي شركة برمجيات قامت بإنشاء Coda - إلى حد بعيد أفضل تطبيق لتطوير الويب لنظام التشغيل Mac. لديك حق الوصول إلى محرر التعليمات البرمجية المصدر ، والطرف ، وعميل FTP حيث يمكنك إجراء تغييرات مباشرة على ملفات الخادم. يدعم Coda بالإضافة إلى ذلك قائمة طويلة من تسليط الضوء على بناء الجملة للغات مثل HTML و XML و CSS وجافا سكريبت و PHP و SQL وغيرها الكثير.

    إذا كنت بحاجة إلى حل مجاني ، فيجب عليك التحقق من تحرير كومودو. تم تطوير البرنامج لنظامي التشغيل Windows و Mac ، مفتوح المصدر ، وهو مجاني تمامًا للتنزيل. ويشمل كل نفس الدعم لتسليط الضوء على بناء الجملة والكثير من الميزات المماثلة مثل Coda (بدون FTP لسوء الحظ). TextWrangler هو حل مجاني آخر قد ترغب في تجربته ، وأيضًا مجرد محرر نصوص بسيط.

    للحصول على تطبيق FTP مجاني ، تحقق من Cyberduck على متجر تطبيقات Mac. على الرغم من أنني شخصياً أفضل بديلًا مدفوعًا مثل Yummy FTP أو Transmit.

    مايكروسوفت ويندوز

    تتبادر مجموعة برامج Adobe دائمًا إلى الذهن عندما تفكر في تصميم المواقع وتطويرها. يمتلك مستخدمو Windows الكثير من البدائل لـ Dreamweaver ، والكثير منهم مجاني تمامًا.

    Notepad ++ هو مثال رائع على بعض برامج Win32 مفتوحة المصدر. لا يزال المشروع قيد التطوير النشط ويصدر تحديثات بشكل متكرر (شهريًا تقريبًا). أنا أحب واجهة كلفه ودعم العديد من الإضافات الإضافية. كما ذكرت أعلاه ، يتم تقديم Komodo Edit أيضًا لنظام التشغيل Windows XP / Vista / 7 ، لذلك يمكنك تجربة ذلك كبديل.

    مطورو الويب على Windows لا يخلو من عميل FTP أيضًا. Filezilla هو على الأرجح البديل المجاني الأكثر شعبية. للحصول على بدائل ، راجع قائمة عملاء FTP المجانية لدينا مع أدوات مماثلة.

    الموارد ديف مفيدة أخرى

    • 100 أدوات تطوير الويب الأساسية
    • أفضل من عام 2011: أفضل الإضافات مسج مفيدة ودروس
    • دروس روبي أون ريلز للمبتدئين في تطوير المواقع الإلكترونية
    • 7 اتجاهات مثيرة لتطوير الويب لعام 2011

    استنتاج

    حتى الآن بدأ الربع الأول من عام 2012 بانفجار! لقد رأينا بالفعل بعض المحتوى المذهل يتدفق من المصممين ومطوري الويب من جميع أنحاء العالم. يمتلك المحترفون الذين يقومون بإنشاء شبكة الويب العديد من الأدوات المتاحة لهم مقارنةً بالسنوات الماضية.

    آمل أن تؤدي هذه المجموعة الضخمة من الأدوات والموارد إلى دفع منهجية تطويرك بشكل أفضل. أحب العمل مع مطوري الويب والتعرف على المشروعات الجديدة طوال الوقت. ومع ذلك ، لا يوجد سوى مجال كبير لموارد جديدة يمكننا تضمينها ، لذلك لا بد لي من فقدان بعض الأحجار الكريمة. إذا كانت لديك أفكار أو اقتراحات بشأن موارد مطور الويب ذات الصلة ، فأخبرنا بذلك في منطقة مناقشة ما بعد المناقشة.