कोडपेन: बिल्ट, चाचणी, सामायिक करा आणि डिस्कव्हर एचटीएमएल, सीएसएस आणि जावास्क्रिप्ट
सामग्री व्यवस्थापन प्रणालीसह एक आव्हान म्हणजे स्क्रिप्टेड टूल्सची चाचणी आणि निर्मिती. तंत्रज्ञान प्रकाशन म्हणून बहुतेक प्रकाशकांसाठी ही आवश्यकता नसली तरी, इतर लोकांना मदत करण्यासाठी मला अधूनमधून कार्यरत स्क्रिप्ट शेअर करणे आवडते. मी पासवर्ड सामर्थ्य तपासण्यासाठी JavaScript कसे वापरावे, रेग्युलर एक्सप्रेशन्स (Regex) सह ईमेल अॅड्रेस सिंटॅक्स कसे तपासायचे ते सामायिक केले आहे आणि ऑनलाइन पुनरावलोकनांच्या विक्री प्रभावाचा अंदाज लावण्यासाठी हे कॅल्क्युलेटर अगदी अलीकडे जोडले आहे. मी साइटवर डझनभर साधने जोडण्याची आशा करतो परंतु वर्डप्रेस असे प्रकाशित करण्यास अनुकूल नाही… ही एक सामग्री प्रणाली आहे, विकास प्रणाली नाही.
म्हणून, माझ्या छोट्या स्क्रिप्ट्स कार्य करण्यासाठी, मला कोडपेन वापरण्यात आनंद होतो. कोडपेन हे HTML पॅनेल, एक CSS पॅनेल, JavaScript पॅनेल, कन्सोल आणि परिणामी कोडचे प्रकाशन असलेले एक व्यवस्थित व्यवस्था केलेले साधन आहे. तुम्ही घटकांवर माउस माऊस करता तेव्हा प्रत्येक पॅनेलमध्ये माहिती असते जेणेकरुन तुम्हाला काय शक्य आहे हे समजेल, तसेच तुमच्या HTML, CSS आणि JS चे कलर-कोडिंग तुम्हाला अधिक सहजतेने संपादित करण्यात आणि लिहिण्यात मदत करण्यासाठी.
कोडपेन हे सामाजिक विकासाचे वातावरण आहे. त्याच्या मनापासून, ते आपल्याला ब्राउझरमध्ये कोड लिहिण्याची आणि आपण तयार करता तेव्हा त्याचा परिणाम पाहण्याची परवानगी देते. कोणत्याही कौशल्याच्या विकसकांसाठी आणि विशेषतः कोड शिकण्यास लोकांना सक्षम बनविण्याकरिता उपयुक्त आणि मुक्त करणारे ऑनलाइन कोड संपादक. कोडपेन प्रामुख्याने एचटीएमएल, सीएसएस, जावास्क्रिप्ट आणि फ्रंट-एन्ड भाषांवर लक्ष केंद्रित करते ज्या त्या गोष्टींमध्ये रुपांतर करतात.
कोडपेन बद्दल
CodePen सह, मी आवश्यक ते सर्व काम करू शकलो कॅल्क्युलेटर प्रकाशित करा मी साइटवर एम्बेड केले. CodePen वरील बहुतेक निर्मिती सार्वजनिक आणि मुक्त स्रोत आहेत. ते जिवंत गोष्टी आहेत ज्यांच्याशी इतर लोक आणि समुदाय संवाद साधू शकतात, साध्या हृदयातून, टिप्पणी देणे, काटा काढणे आणि त्यांच्या स्वतःच्या गरजांसाठी बदलणे.
आपण काम करीत असताना पॅन डावीकडे, उजवीकडे किंवा तळाशी असले पाहिजेत ... किंवा एका नवीन टॅबमध्ये HTML पहायचे असल्यास कोडेपेनसह आपण आपले दृश्य बदलू शकता. आपण पाहण्यायोग्य उपखंडाचा आकार समायोजित करू शकत असल्यामुळे आपल्या प्रतिसाद सेटिंग्जची चाचणी घेण्यासाठी साइड-बाय-साइड दृश्य आश्चर्यकारकपणे कार्य करते.
तुम्ही तुमच्या कार्यरत स्क्रिप्ट्स पेन्समध्ये व्यवस्थित करू शकता, त्यांना प्रोजेक्ट्स (मल्टी-फाइल एडिटर) मध्ये एकत्र करू शकता किंवा संग्रह तयार करू शकता. फ्रंट-एंड कोडसाठी ही एक कार्यरत पोर्टफोलिओ साइट आहे जिथे तुम्ही इतर लेखकांचे अनुसरण करू शकता, सुधारित करण्यासाठी इतर सार्वजनिकरित्या सामायिक केलेले प्रकल्प तुमच्या स्वतःमध्ये तयार करू शकता आणि आव्हानांमधून काही मजेदार सामग्री कशी करावी हे देखील शिकू शकता.
तुम्ही ते GitHub Gist म्हणून जतन करू शकता, ते a मध्ये निर्यात करू शकता झिप फाइल, आणि अगदी एम्बेड करा यासारख्या लेखातील पेन:
पेन पहा ऑनलाईन पुनरावलोकनांचा भविष्यवाणी विक्री परिणाम by Douglas Karr (martech_zone) वर कोडपेन.
पेन एडिटरच्या मर्यादांपैकी एक म्हणजे कोडची पूर्ण मात्रा. तुम्हाला ही समस्या कधीच भेडसावू शकत नाही, कारण संपादक शेकडो किंवा हजारो ओळींच्या कोडसह ठीक असावा. परंतु जेव्हा ते कोडच्या 5,000 - 10,000 किंवा त्याहून अधिक ओळी मारण्यास सुरवात करतात, तेव्हा आपणास संपादक अयशस्वी होताना दिसेल. तथापि, तुम्ही इतरत्र होस्ट केलेल्या स्टाइलशीट किंवा JavaScript मध्ये बाह्य संदर्भ जोडू शकता!
मी तुम्हाला साइन अप करण्यासाठी प्रोत्साहित करेन. तुम्ही त्यांच्या साप्ताहिक ईमेलचे सदस्य व्हाल आणि नवीन प्रकाशित पेन पाहण्यासाठी तुमच्या RSS फीडमध्ये फीड जोडू शकता. आणि, जर तुम्ही तेथे सार्वजनिक पेन शोधणे किंवा ब्राउझ करणे सुरू केले, तर तुम्हाला काही अविश्वसनीय प्रकल्प सापडतील... वापरकर्ते खूप प्रतिभावान आहेत!
अनुसरण करा Douglas Karr कोडपेन वर
सशुल्क आवृत्ती, CodePen Pro, सुधारित कार्यक्षमता किंवा कार्यसंघांसाठी अनेक अतिरिक्त वैशिष्ट्ये ऑफर करते - यामध्ये सहयोग, प्रक्रिया, मालमत्ता होस्टिंग, खाजगी दृश्ये आणि अगदी तुमच्या डोमेन किंवा सबडोमेनसह उपयोजित प्रकल्प समाविष्ट आहेत. आणि अर्थातच, कोडपेन गीथब एकत्रीकरणासह एक उत्कृष्ट भांडार प्रदान करते जिथे तुमची संपूर्ण टीम कार्य करू शकते. जर तुम्हाला माझ्यासारख्या काही साध्या कोडची चाचणी घ्यायची असेल, तर कोडपेन हे एक अमूल्य साधन आहे.