वेब डेवलपर संसाधन एक मेगा-संकलन

इंटरनेट लगातार बढ़ रहा है और आगामी वेब डेवलपर्स के लिए हजारों-हजारों सामूहिक संसाधन हैं। ऑनलाइन लेख, ट्यूटोरियल, टूल, गाइड से लेकर वीडियो तक, आप वेब पर कुछ भी सीख सकते हैं। ऑनलाइन कूदना वास्तव में कभी आसान नहीं रहा!

नीचे मैंने कुछ बहुत उपयोगी वेब डेवलपर संसाधनों का एक बड़ा संग्रह एक साथ रखा है। इनमें जावास्क्रिप्ट और PHP प्रोग्रामिंग के लिए अधिक जटिल सिद्धांतों के साथ HTML5 / CSS3 के लिए शुरुआती सामग्री शामिल है। उत्साही डेवलपर्स के एक जोड़े के लिए इन भाषाओं का अध्ययन करना और ट्विटर या टंबलर के समान बेतहाशा लोकप्रिय वेब एप्लिकेशन बनाना संभव है। यदि आपके पास आधुनिक वेब डेवलपर्स के लिए सहायक परिसंपत्तियों में रुचि है, तो आप भरोसेमंद संसाधनों के इस संकलन को पसंद करेंगे.

सहायक ऑनलाइन पत्रिकाएँ

इंटरनेट पर ले जा रहे सैकड़ों नए लेखकों के साथ ब्लॉगिंग की दुनिया में विस्फोट हो गया है। इन ऑनलाइन ब्लॉगों में से कई डिजाइन और वेब विकास के आसपास केंद्रित हैं। आप इन आरएसएस फ़ीड के माध्यम से फ़्लिप करके बहुत से सहायक संसाधन पा सकते हैं.

आप किस प्रकार की भाषा पर निर्भर करते हैं, यह इन ब्लॉगों में से किसी में भी आपकी रुचि का निर्धारण करेगा। हम वेब विकास पर ध्यान केंद्रित कर सकते हैं और मान सकते हैं कि इसमें सभी फ्रंट-एंड काम (HTML5 / CSS3 / जावास्क्रिप्ट) और साथ ही सरल बैक-एंड स्क्रिप्ट (PHP / RoR / पायथन / SQL) शामिल हैं। मैंने सबसे लोकप्रिय देव ब्लॉगों की एकल सूची बनाने की स्वतंत्रता ली है जो फ्रंट-एंड और बैक-एंड कोड दोनों पर ध्यान केंद्रित करते हैं.

• Nettuts+
• 24 तरीके
• Webmonkey
• कोडिंग स्मैशिंग
• Webitect
• तत्व का निरीक्षण
• बिल्लियों कौन कोड
• Line25 वेब डिज़ाइन ब्लॉग

विचार करने के लिए निश्चित रूप से कई अन्य हैं। मैं आपकी पसंदीदा देव भाषा पर ट्यूटोरियल और लेखों की खोज में Google को मारने की सलाह देता हूं। फिर Google रीडर जैसे RSS फीड एग्रीगेटर का उपयोग करके आप इन पत्रिकाओं के सभी नवीनतम लेखों की सूची सेट कर सकते हैं। यह आपके कार्यदिवस को शुरू करने का एक शानदार तरीका है, या यहां तक ​​कि ट्यूटोरियल के माध्यम से थोड़े समय के लिए हत्या करना है.

jQuery प्लगइन्स जालोर

पिछले वर्ष में jQuery कोर लाइब्रेरी और jQuery मोबाइल दोनों ने बहुत अधिक कर्षण प्राप्त किया है। ये ओपन सोर्स लाइब्रेरी समृद्ध एनीमेशन और आसान-से-अजाक्स सुविधाओं से भरे फ्रंट-एंड अनुभव को डिजाइन करने के लिए काम करते हैं, हालांकि मोबाइल लाइब्रेरी अपने माता-पिता के साथ प्लगइन्स और तीसरे पक्ष के कोड के मामले में काफी नहीं पकड़ा गया है.

इसी तरह एक और शानदार उत्पाद bgStretcher को एक गतिशील पृष्ठभूमि स्क्रिप्ट के रूप में उपयोग किया जा सकता है। यह छवियों की एक श्रृंखला लेगा, और आकार के कुछ स्केलिंग आपके उपयोगकर्ता के स्क्रीन रिज़ॉल्यूशन के अनुपात में होंगे। कार्रवाई में यह देखने के लिए अद्भुत डेमो देखें। ये दोनों प्लगइन्स डाउनलोड करने के लिए स्वतंत्र हैं, और jQuery से निर्मित भयानक 3 पार्टी कोड के लिए सरल उदाहरणों के रूप में व्यवहार करते हैं। इन संसाधनों के साथ काम करने से आपको परियोजना के काम में समय की बचत होगी जिससे आपको पहिया का फिर से आविष्कार नहीं करना पड़ेगा.

सामान्य तौर पर मैं वेबसाइटों को अजाक्स ब्लेंडर और जावास्क्रिप्ट कोड स्निपेट्स / प्लगइन्स के लिए डायनामिक ड्राइव ब्राउज़ करने की सलाह देता हूं। लाइब्रेरी विशाल नहीं है, लेकिन यह नए उपयोगकर्ता द्वारा सबमिट की गई सामग्री से लगातार बढ़ रही है। साइटों में न केवल jQuery प्लगइन्स शामिल हैं, बल्कि MooTools और प्रोटोटाइप लाइब्रेरी भी शामिल हैं.

यदि आप jQuery मोबाइल लाइब्रेरी के साथ काम करना समाप्त करते हैं तो मैं एक और उपकरण jqmPhp की सिफारिश करना चाहता हूं। यह एक गतिशील PHP वर्ग है जहाँ आप सरल कार्यों को आउटपुट लाइनों और HTML5 कोड की लाइनों को jQuery मोबाइल के माध्यम से संचालित कर सकते हैं। यह ईमानदारी से एक PHP खोल के आसपास बनाया गतिशील मोबाइल एप्लिकेशन प्रोटोटाइप के लिए सबसे आसान तरीका है। साइट ब्लॉग के माध्यम से खुदाई करने के लिए बहुत सारे उदाहरण संदर्भ हैं.

HTML5 और CSS3 में बिल्डिंग

जब हम फ्रंट-एंड वेब डेवलपमेंट के बारे में बात करते हैं, तो यह आम तौर पर दक्षता के बारे में होता है। HTML / CSS में वेबसाइट बनाने में आपको उतनी समस्याएँ नहीं होती हैं, जितनी कि आप एक बैक-एंड रूबी एप्लिकेशन को कोड करने में करते हैं। HTML में कोई वास्तविक तर्क या त्रुटि हैंडलिंग नहीं है - यह अधिकतर इस बारे में है कि आप सभी ब्राउज़रों में लेआउट डिज़ाइन को ठीक से कैसे माप सकते हैं.

पहले मुझे एचटीएमएल 5 बॉयलरप्लेट की सिफारिश करके शुरू करना होगा। यह एक पट्टीदार नंगे हड्डियों का टेम्पलेट है जिसमें सभी शामिल हैं “मानक” एक पैकेज में एचटीएमएल 5 वेबपेज तत्व। इसमें एक डिफ़ॉल्ट स्टाइलशीट, जावास्क्रिप्ट, फ़ेविकॉन, ऐप्पल टच आइकन और बहुत सारी अन्य अच्छाइयाँ शामिल हैं। यह एक 100% निशुल्क परियोजना है और आप उनके गितुब रेपो पर भी योगदान दे सकते हैं। यह किसी भी गंभीर वेब परियोजना को शुरू करने से पहले सभी डेवलपर्स के लिए जरूरी संसाधन होना चाहिए.

अब यदि आप इस बॉयलरप्लेट को बंद करते हैं तो आपके पास अपने सभी कस्टम कोड जोड़ने का विकल्प है। लेकिन मैं सुझाव देता हूं कि अगला कदम और बिल्डिंग जैसे कि एपिग्निज्र के साथ एक ऐप बनाऊं। यह एक विशिष्ट वेबसाइट लेआउट उत्पन्न करेगा और यहां तक ​​कि आपको अनुकूलित करने की अनुमति देगा कि आपके बॉयलरप्लेट पैकेज के अंदर कौन से तत्व शामिल हैं। Google Analytics कोड, छोटा jQuery, .htaccess या web.config फ़ाइलें, प्लस एक दर्जन से अधिक अन्य विकल्प उपलब्ध हैं.

सीएसएस डिजाइनर

अब जब हमने HTML5 कोडिंग में थोड़ा सा देखा है तो हमें कुछ लोकप्रिय CSS3 रूपरेखाओं पर भी विचार करना चाहिए। ये HTML टेम्प्लेट की तुलना में अधिक खुले हुए हैं क्योंकि आप सीएसएस के साथ इतना अधिक कर सकते हैं। डिजाइनर सभी आधुनिक वेब ब्राउज़रों के लिए मानक-अनुरूप कोड बनाने में कठिनाई का भी एहसास करेंगे.

गोल्डन ग्रिड सिस्टम उत्तरदायी वेब डिजाइन पर एक रूपरेखा के रूप में शानदार है। जैसे ही आप ब्राउज़र विंडो को आकार देंगे, ये लेआउट मोबाइल स्क्रीन के लिए अनुकूल हो जाएंगे और अंदर की तरफ मोड़ेंगे। यह प्रत्येक स्तंभ क्षेत्र की चौड़ाई और आकार की योजना बनाने में भी मदद करता है। ब्लूप्रिंट एक और आसान सीएसएस फ्रेमवर्क है जिसकी आपको जांच करनी चाहिए। यह कस्टम वेबसाइटों के निर्माण के लिए बहुत अच्छा है और शानदार प्रलेखन प्रदान करता है.

जब सीएसएस टूल्स की बात आती है, तो, सीएसएस 3 पीआईई मेरे शीर्ष तीन पसंदीदा में होना है। यह एक सरल वेब ऐप है जो इंटरनेट एक्सप्लोरर 6-9 में समर्थित CSS3 के प्रभावों को प्रस्तुत करने के लिए उचित कोड को आउटपुट करता है। आप अनुकूलन सेटिंग्स के साथ गतिशील रैखिक ग्रेडिएंट, गोल कोनों, और बॉक्स छाया बना सकते हैं। साइट के पास IE उदाहरण हैं यदि आप उन्हें भी जांचना चाहते हैं.

डेवलपर्स भी उत्पादन के लिए अपने फ़ाइल आकार को कम करने के लिए देख रहे होंगे। क्लीन सीएसएस एक संसाधन है जहां आप अपने कोड को सरल बनाने और फ़ाइल आकार को कम करने के लिए कई विकल्पों में से चयन कर सकते हैं। एक अन्य वैकल्पिक कोड ब्यूटिफायर कई विकल्पों की पेशकश नहीं करता है, लेकिन इसका उपयोग करना आसान हो सकता है.

WordPress के साथ विषयों को अनुकूलित करना

वर्डप्रेस प्रकाशन इस युग में आसानी से सबसे लोकप्रिय सीएमएस है। हमने संभवतः इस शानदार सामग्री प्रबंधन समाधान द्वारा संचालित लाखों नए ब्लॉग और वेबसाइटें देखी हैं। और इस तरह के वर्डप्रेस डेवलपर्स कस्टम विजेट और वेबसाइट थीम बनाने के लिए उच्च मांग में हैं.

तारामंडल थीम की नई रिलीज वर्डप्रेस डेवलपर्स को डिफ़ॉल्ट टेम्प्लेट की तुलना में एक आसान शुरुआती बिंदु देती है। नया ट्वेंटी इलेवन विषय बहुत चालाक और न्यूनतावादी है, लेकिन यह HTML5Boilerplate के शीर्ष पर निर्मित संपूर्ण थीम टेम्पलेट के साथ प्रतिस्पर्धा नहीं कर सकता है। नक्षत्र WP थीम में विभिन्न डिवाइस संकल्प जैसे कि iPhone और iPad टैबलेट के लिए मीडिया क्वेरी शामिल हैं.

वंडरफ्लक्स एक अन्य वर्डप्रेस थीम टेम्प्लेट है जो विकास में बहुत दूर नहीं है। यह अभी हाल ही में कुछ ऑनलाइन प्रलेखन के साथ v1.0 में बीटा से बाहर जारी किया गया था। यह विषय नक्षत्र की तुलना में थोड़ा अधिक जटिल है जो आपको लेआउट पर अधिक नियंत्रण प्रदान करता है। डेवलपर्स ने आपकी वर्डप्रेस साइट को अधिक गतिशील बनाने के लिए कस्टम PHP हुक, फ़ंक्शंस और फ़िल्टर शामिल किए हैं.

गंभीर WP डेवलपर्स को यह देखने के लिए दोनों समाधानों की जांच करनी चाहिए कि क्या भविष्य के प्रोजेक्ट कार्य में कोई मदद करेगा या नहीं.

वेब डेवलपर मुफ्त पा रहे हैं

PSDs और ग्राफिक्स की तुलना में वेब डेवलपमेंट समुदाय freebie दीर्घाओं में कुछ कमी लगती है। आप गितुब पर हमेशा महान स्क्रिप्ट पा सकते हैं, लेकिन आपको अक्सर अपने आसपास खोज करनी होगी और उनका परीक्षण करना होगा.

ऐसी वेबसाइटें खोजना मुश्किल है जो मुफ्त डाउनलोड और डेमो के साथ-साथ स्क्रिप्ट के उदाहरण पेश करती हैं। मेरा पसंदीदा नया संसाधन CodeVisually है जो उपयोगकर्ता द्वारा प्रस्तुत विकास उपकरण, प्लगइन्स, लाइब्रेरी और अन्य साफ-सुथरी चीजों को सूचीबद्ध करता है। लेआउट एक गैलरी की तरह सेटअप होता है जहां प्रत्येक पृष्ठ में उत्पाद का लिंक, डेमो स्क्रीनशॉट और कुछ और विवरण शामिल होते हैं.

गैलरी में HTML / HTML5 टेम्पलेट कोड, CSS3 लाइब्रेरी, और निश्चित रूप से बहुत सारे jQuery के सामान के सैकड़ों उदाहरण शामिल हैं। मैंने यह भी पाया है कि यह अपना खुद का ओपन सोर्स कोड जनता के सामने प्रस्तुत करने के लिए एक शानदार वेबसाइट है। आपका नाम सबमिशन से जुड़ा हुआ है, साथ ही आप अपनी खुद की वेबसाइट पर लिंक डाल सकते हैं जहाँ उपयोगकर्ता कोड का उपयोग कर सकते हैं.

वेब एप्लिकेशन एपीआई

आधुनिक वेब विकास में एक बहुत लोकप्रिय प्रवृत्ति एक तीसरे पक्ष के ऐप के रूप में एपीआई का निर्माण कर रही है। मुख्य धारा के सोशल नेटवर्किंग ब्रांडों में से अधिकांश में अपनी वेबसाइट पर एक काम करने वाला एपीआई और प्रलेखन खंड शामिल हैं। इसके अलावा सभी प्रमुख बैक-एंड प्रोग्रामिंग भाषाओं में लिखे गए जीथब पर मुफ्त रैपर कक्षाएं हैं.

डेवलपर्स को इस प्रकार के कोड पुस्तकालयों के साथ काम करने में सहज महसूस करना चाहिए क्योंकि वे मांग में बढ़ रहे हैं। OAuth प्रणाली का उपयोग करके आप इनमें से कई एप्लिकेशन से एक उपयोगकर्ताबेस को जल्दी से बना सकते हैं। मैंने लोकप्रिय ऑनलाइन एपीआई और उनके पूर्ण प्रलेखन के कुछ संदर्भों को नीचे सूचीबद्ध किया है.

• ट्विटर एपीआई
• CloudApp एपीआई
• Instagr.am एपीआई
• ईबे एपीआई
• फोरस्क्वेयर एपीआई
• Dribbble API
• गितूब एपीआई

जब भी संभव हो नई परियोजनाओं पर इन संसाधनों का लाभ उठाएं। वेब अधिक जुड़ा हुआ है और उपयोगकर्ता हमेशा अगले बड़े ऐप के लिए आते हैं। आप अपने ऐप में हजारों और समर्पित सदस्यों को भर्ती कर सकते हैं जब आपके आगंतुकों को एक नया खाता पंजीकृत करने की आवश्यकता नहीं होती है और इसके बजाय सीधे ट्विटर या फेसबुक के माध्यम से साइनअप कर सकते हैं.

क्यू एंड ए संसाधन

डेवलपर्स के बीच सबसे फायदेमंद अनुभव सवाल पूछना और नई तकनीक सीखना है। डेवलपर समुदाय हमेशा नए लोगों के लिए इतना मददगार होता है और कई स्थितियों में अपनी विशेषज्ञता की पेशकश करने को तैयार रहता है। यदि आपके पास किसी प्रोजेक्ट पर कोई संघर्ष या विशिष्ट प्रश्न हैं, तो संबंधित वेब डेवलपर के फोरम के लिए Google पर खोजें.

यदि आप पहले से सदस्य नहीं हैं, तो मुझे व्यक्तिगत रूप से स्टैक एक्सचेंज समुदाय में शामिल होने की सिफारिश करनी होगी। इसमें स्टैक ओवरफ्लो और सुपर यूजर जैसी अद्भुत वेबसाइट शामिल हैं जहां आप मूल रूप से कुछ भी पर प्रोग्रामिंग सहायता प्राप्त कर सकते हैं। समुदाय के सदस्य सभी प्रमुख वेब भाषाओं के जानकार हैं जिनमें jQuery और छोटे PHP वर्ग शामिल हैं.

एक साफ-सुथरी ट्रिक जो मैंने सीखी वह है गूगल के माध्यम से खोज करना और यह देखना कि क्या आपकी समस्या पहले ही हल हो गई है। अपनी Google खोज में कुछ कीवर्ड दर्ज करें और प्रत्यय संलग्न करें साइट: stackoverflow.com. सभी लौटे खोज परिणाम स्टैक ओवरफ्लो अभिलेखागार के भीतर से प्रश्न होंगे - यदि आप भाग्यशाली हैं तो आप अपनी वर्तमान समस्या का समाधान पा सकते हैं.

परीक्षण पृष्ठ गति ऑनलाइन

Google डेवलपर्स द्वारा डाला गया यह नया टूल वास्तव में वास्तव में प्रभावशाली रहा है। ऐप पेज स्पीड ऑनलाइन आपकी वेबसाइट की सामग्री का विश्लेषण करेगा और आपकी गति पर एक एनालिटिक्स रिपोर्ट तैयार करेगा। इसमें लोड समय को कम करने और साइट पर अपने आगंतुकों को लंबे समय तक रखने के संभावित समाधान शामिल हैं.

यह आपको उछाल दरों और कम रूपांतरण के साथ समस्याओं को निर्धारित करने में भी मदद कर सकता है। Google Analytics किसी भी वेबसाइट के लिए बहुत जरूरी है, लेकिन मुझे लगता है कि पेज स्पीड सिर्फ उच्च स्तर के विश्लेषण को प्राप्त करता है.

रिपोर्ट आउटपुट को उच्च-से-निम्न प्राथमिकता से रैंक किया जाता है और अक्सर इसमें कई अलग-अलग आइटम शामिल होते हैं। यदि आप LAMP सेटअप को समझते हैं और Apache सर्वर पर काम करते हैं तो आप mod_pagespeed मॉड्यूल पर भी विचार कर सकते हैं। यह आपकी वेबसाइट पर लोड समय को कम करने और महत्वपूर्ण वेब डेटा (चित्र, आइकन, स्क्रिप्ट) को कैश करने के लिए स्वचालित रूप से इनमें से कई अनुकूलन करता है।.

सर्वश्रेष्ठ डेवलपर का सॉफ्टवेयर

दो सबसे लोकप्रिय ऑपरेटिंग सिस्टम के बीच, आप दर्जनों प्रोग्राम पा सकते हैं। ग्राफिक्स सॉफ्टवेयर से लेकर सोर्स कोड एडिटर और आईडीई तक, वेब डेवलपर्स के लिए चुनने के लिए कई संसाधन हैं। लेकिन अगर आप लोकप्रिय सुझावों की तलाश कर रहे हैं तो मैं निम्नलिखित शीर्षक सुझाता हूं.

मैक ओएस एक्स

पैनिक एक सॉफ्टवेयर कंपनी है, जिसने कोडा को मैक के लिए अब तक का सबसे अच्छा वेब डेवलपमेंट ऐप बनाया है। आपके पास एक स्रोत कोड संपादक, टर्मिनल और एफ़टीपी क्लाइंट तक पहुंच है जहां आप सर्वर फ़ाइलों में सीधे परिवर्तन कर सकते हैं। कोडा इसके अतिरिक्त HTML, XML, CSS, जावास्क्रिप्ट, PHP, SQL जैसी भाषाओं के लिए वाक्य रचना हाइलाइटिंग की एक लंबी सूची का समर्थन करता है।.

यदि आपको एक नि: शुल्क समाधान की आवश्यकता है, तो आपको कोमोडो एडिट की जांच करनी चाहिए। सॉफ्टवेयर विंडोज और मैक, ओपन सोर्स, और डाउनलोड करने के लिए पूरी तरह से मुक्त है। इसमें सिंटैक्स हाइलाइटिंग के लिए सभी समान समर्थन और कोडा (समान रूप से एफ़टीपी नहीं) के समान समान विशेषताएं शामिल हैं। TextWrangler एक और मुफ्त समाधान है जिसे आप आज़माना चाहते हैं, बस एक साधारण टेक्स्ट एडिटर.

एक मुफ्त एफ़टीपी अनुप्रयोग के लिए मैक ऐप स्टोर पर साइबरडक देखें। हालांकि व्यक्तिगत रूप से मैं एक भुगतान विकल्प पसंद करता हूं जैसे कि यमी एफ़टीपी या ट्रांसमिट.

माइक्रोसॉफ़्ट विंडोज़

जब आप वेब डिज़ाइन और विकास के बारे में सोचते हैं तो Adobe सॉफ़्टवेयर सूट हमेशा दिमाग में आता है। विंडोज उपयोगकर्ताओं के पास ड्रीमविवर के बहुत सारे विकल्प हैं, और उनमें से कई पूरी तरह से स्वतंत्र हैं.

नोटपैड ++ कुछ ओपन सोर्स Win32 सॉफ्टवेयर का एक शानदार उदाहरण है। परियोजना अभी भी सक्रिय विकास में है और अक्सर (लगभग मासिक) अपडेट जारी करती है। मुझे उनके वर्जित इंटरफ़ेस से प्यार है और इतने सारे अतिरिक्त प्लगइन्स के लिए समर्थन है। जैसा कि मैंने ऊपर बताया कि कोमोडो एडिट को विंडोज एक्सपी / विस्टा / 7 के लिए भी पेश किया जाता है, इसलिए आप विकल्प के रूप में कोशिश कर सकते हैं.

विंडोज पर वेब डेवलपर्स एफ़टीपी क्लाइंट के बिना नहीं हैं। Filezilla शायद सबसे लोकप्रिय मुफ्त विकल्प है। विकल्पों के लिए, समान उपकरणों के साथ हमारे मुफ्त एफ़टीपी ग्राहकों की सूची देखें.

अन्य सहायक देव संसाधन

• 100 आवश्यक वेब विकास उपकरण
• 2011 का सर्वश्रेष्ठ: सर्वश्रेष्ठ उपयोगी jQuery प्लगइन्स और ट्यूटोरियल
• वेब विकास शुरुआती के लिए रेल ट्यूटोरियल पर रूबी
• 2011 के लिए 7 रोमांचक वेब विकास रुझान

निष्कर्ष

अब तक 2012 की पहली तिमाही में धमाकेदार शुरुआत हुई है! हम पहले से ही दुनिया भर के डिजाइनरों और वेब डेवलपर्स से बाहर कुछ अद्भुत सामग्री डाल रहे हैं। वेब के लिए निर्माण करने वाले पेशेवरों के पास 1-2 साल पहले की तुलना में अपने निपटान में बहुत सारे उपकरण हैं.

यह मेरी आशा है कि उपकरण और संसाधनों का यह विशाल संकलन बेहतर विकास के लिए आपकी कार्यप्रणाली को आगे बढ़ाएगा। मुझे वेब डेवलपर्स के साथ काम करना और हर समय नई परियोजनाओं के बारे में सीखना बहुत पसंद है। फिर भी नए संसाधनों के लिए केवल इतना ही स्थान है जिसे हम शामिल कर सकते हैं, इसलिए मैं कुछ रत्नों से चूक गया हूं। यदि आपके पास संबंधित वेब डेवलपर संसाधनों के लिए विचार या सुझाव हैं, तो हमें पोस्ट चर्चा क्षेत्र में बताएं.