योगदान दें 🌸 नमस्कार! 🌺

🌸 नमस्कार! 🌺

p5.js में योगदान देने में आपकी रुचि के लिए धन्यवाद! हमारा समुदाय सभी रूपों के योगदान को महत्व देता है और जहाँ तक हो सके “योगदानकर्ता” शब्द के अर्थ का विस्तार करना चाहता है। इसमें दस्तावेज़ीकरण, शिक्षण, कोड लिखना, आर्ट बनाना, लिखना, रचना, सक्रियतावाद, व्यवस्थित करना, संधारण करना, या ऐसी कोई भी चीज जिसकी आप कल्पना कर सकते हैं। आप यहाँ योगदान करने के कुछ अलग तरीकों से शुरुआत कर सकते हैं। तकनीकी योगदान आरंभ करने के लिए, इस पृष्ठ को पढ़ें।

यह परियोजना सभी योगदानकर्ताओं के विनिर्देशन का अनुसरण करती है। अपना नाम readme में दर्ज करने क लिए इन नियमों का पालन करे अथवा GitHub मुद्दों में अपने योगदान के साथ टिप्पणी करें और हम आपका नाम दर्ज कर देंगे।

पहुँच को प्राथमिकता देना

हम ऐसे काम को प्राथमिकता दे रहे हैं जो p5.js तक पहुंच (समावेश और पहुंच) का विस्तार करता है! अधिक विवरण के लिए हमारा पहुंच के लिए बयान देखें।

हमारा कोड कहां रहता है

व्यापक p5.js परियोजना में इस के अलावा कुछ रिपॉजिटरी शामिल हैं-

  • p5.js: इस रिपॉजिटरी में p5.js लाइब्रेरी का स्रोत कोड है। p5.js संदर्भ मैनुअल भी इस स्रोत कोड में शामिल JSDoc टिप्पणियों से उत्पन्न होता है। इसका अनुरक्षण Moira Turner के द्वारा किया जा रहा है।
  • p5.js-website इस रिपॉजिटरी में p5.js वेबसाइट का अधिकांश कोड हैं, संदर्भ मैनुअल के अपवाद के साथ। इसका अनुरक्षण Moira Turner के द्वारा किया जा रहा है।
  • p5.js-sound इस भंडार में p5.sound.js लाइब्रेरी है। इसका अनुरक्षण Jason Sigal के द्वारा किया जा रहा है।
  • p5.js-web-editor इस रिपॉजिटरी में p5.js वेब एडिटर के लिए स्रोत कोड है। इसका अनुरक्षण Cassie Tarakajian के द्वारा किया जा रहा है। ध्यान दें कि पुराना p5.js संपादक अब पदावनत हो गया है।

रिपोजिटरी फ़ाइल संरचना

यहाँ बहुत सारी फाइलें हैं! यह एक संक्षिप्त अवलोकन है। यह भ्रामक हो सकता है, लेकिन आरंभ करने के लिए आपको रिपॉजिटरी की प्रत्येक फ़ाइल को समझने की आवश्यकता नहीं है। हम एक क्षेत्र में शुरुआत करने की सलाह देते हैं (उदाहरण के लिए, कुछ इनलाइन प्रलेखन को ठीक करना), और अधिक खोज करने के लिए अपने तरीके से काम करना। Luisa Pereira का लुकिंग इनसाइड p5.js भी p5 .js वर्कफ़्लो में उपयोग किए जाने वाले टूल और फ़ाइलों का वीडियो टूर देता है।

  • contributor_docs/ में विभिन्न दस्तावेज हैं, जो विशेष रूप से p5.js के डेवलपर्स के लिए उपयोगी होने की संभावना है, क्योंकि वे प्रथाओं और सिद्धांतों की व्याख्या करते हैं।
  • docs/ वास्तव में डॉक्स शामिल नहीं है! इसके बजाय, इसमें * ऑनलाइन संदर्भ पुस्तिका * का उपयोग करने वाला कोड शामिल है।
  • lib/ में शामिल है एक खाली उदाहरण और p5.sound ऐड-ऑन, जो समय-समय पर p5.js-sound रिपॉजिटरी से पुल अनुरोध के माध्यम से अद्यतन किया जाता है। यह वह जगह है जहाँ अंतर्निहित p5.js लाइब्रेरी को ग्रंट का उपयोग करके एक फ़ाइल में संकलित किए जाने के बाद रखा जाता है। जब आप एक पुल अनुरोध करते हैं तो इसे GitHub रिपॉजिटरी में जांचने की आवश्यकता नहीं होती है।
  • src/ में लाइब्रेरी के लिए सभी स्रोत कोड शामिल हैं, जो अलग-अलग मॉड्यूल में शीर्ष रूप से व्यवस्थित है। यदि आप p5.js. बदल रहे हैं, तो आप इस पर काम करेंगे। अधिकांश फ़ोल्डरों के पास अपनी स्वयं की readme.md फाइलें होती हैं जो आपको अपना रास्ता खोजने में मदद करती हैं।
  • tasks/ में स्क्रिप्ट शामिल हैं जो p5.js के नए संस्करणों के निर्माण, परिनियोजन और रिलीज़ से संबंधित स्वचालित कार्य करते हैं।
  • tests/ में यूनिट परीक्षण शामिल हैं जो सुनिश्चित करते हैं कि लाइब्रेरी सही ढंग से कार्य कर रहे हैं क्योंकि परिवर्तन किए जाते हैं।
  • utils/ इसमें रिपॉजिटरी के लिए उपयोगी अतिरिक्त फाइलें हो सकती हैं, लेकिन आम तौर पर आप इस डायरेक्टरी को अनदेखा कर सकते हैं।

प्रलेखन

हमें एहसास है कि प्रलेखन इस परियोजना का सबसे महत्वपूर्ण हिस्सा है। खराब प्रलेखन नए उपयोगकर्ताओं और योगदानकर्ताओं के लिए उपयोग करने के लिए मुख्य बाधाओं में से एक है, जिससे परियोजना कम समावेशी हो जाती है। contributing_documentation.md पृष्ठ प्रलेखन के साथ आरंभ करने का एक गहन अवलोकन देता है। p5.js के लिए प्रलेखन कुछ मुख्य स्थानों में पाया जा सकता है:

  • p5js.org संदर्भ स्रोत कोड में ही इनलाइन प्रलेखन से उत्पन्न होता है। इसमें पाठ विवरण और पैरामीटर के साथ-साथ कोड स्निपेट उदाहरण भी शामिल हैं। हम कोड और प्रलेखन को निकटता से रखने के लिए यह सब इनलाइन रखते हैं, और इस विचार को सुदृढ़ करने के लिए कि कोड में योगदान देने की तुलना में प्रलेखन में योगदान करना अधिक महत्वपूर्ण है (यदि अधिक नहीं)। जब लाइब्रेरी निर्मित हो जाता है, तो यह इनलाइन प्रलेखन और उदाहरणों की जांच करता है ताकि यह सुनिश्चित हो सके कि वे कोड के व्यवहार के तरीके से मेल खाते हैं। योगदान करने के लिए, आप inline_documentation.md पृष्ठ को देखकर शुरू कर सकते हैं।
  • The p5js.org उदाहरण पृष्ठ में लंबे उदाहरण हैं जो p5.js. सीखने के लिए उपयोगी हो सकते हैं। योगदान करने के लिए, आप add_examples.md पृष्ठ को देखकर शुरू कर सकते हैं।
  • The p5js.org सीखिए पृष्ठ में p5.js और प्रोग्रामिंग की अवधारणाओं को सीखने में मदद करने के लिए ट्यूटोरियल हैं। योगदान करने के लिए, आप p5.js ट्यूटोरियल में योगदान करने के लिए गाइड देखकर शुरू कर सकते हैं।
  • आप देखेंगे कि वर्तमान में p5.js वेबसाइट कुछ अलग भाषाओं का समर्थन करती है। इसे अंतर्राष्ट्रीयकरण (या संक्षेप में i18n) कहा जाता है। आप इस दस्तावेज़ के बारे में i18n_contribution पृष्ठ पर अधिक पढ़ सकते हैं।

गिटहब मुद्दों का संचलान

  • ज्ञात बग और इच्छित नई सुविधाओं को GitHub मुद्दों का उपयोग करके ट्रैक किया जाता है। समस्या लेबल का उपयोग श्रेणियों में मुद्दों को हल करने के लिए किया जाता है, जैसे कि जो शुरुआती के लिए उपयुक्त है।

  • यदि आप किसी मौजूदा मुद्दे पर काम करना शुरू करना चाहते हैं, तो उस मुद्दे पर टिप्पणी करें कि आप इस पर काम करने की योजना बना रहे हैं ताकि अन्य योगदानकर्ताओं को यह पता चले कि आप काम कर रहे है और मदद की पेशकश कर सकते है।

  • एक बार जब आप उस मुद्दे पर अपना काम पूरा कर लेते हैं, तो p5.js मुख्य शाखा के खिलाफ एक पुल निवेदन (PR) जमा करें। पुल निवेदन के विवरण क्षेत्र में, आप जो समाधान कर रहे हैं उस समस्या को टैग करते हुए “resolves #XXXX” लिखे। यदि पुल निवेदन समस्या को संबोधित करता है, लेकिन उसे पूरी तरह से हल नहीं करता है (यानी आपके पुल निवेदन विलय के बाद मुद्दा खुला रहना चाहिए), तो “addresses #XXXX” लिखें।

  • यदि आप बग की खोज करते हैं या एक नई सुविधा के लिए एक विचार है जिसे आप जोड़ना चाहते हैं, तो एक मुद्दा सबमिट करके शुरू करें। कृपया पहले से कोई मुद्दा बनाये बिना, समाधान या नई सुविधा युक्त पुल अनुरोध सबमिट न करें, हम शायद इसे स्वीकार नहीं कर पाएंगे। एक बार जब आपको इस मुद्दे पर कुछ प्रतिक्रिया मिल जाती है और इसे संबोधित करने के लिए आगे बढ़ते हैं, तो आप समाधान या सुविधा को योगदान देने के लिए ऊपर की प्रक्रिया का पालन कर सकते हैं।

  • आप उन समस्याओं को ट्राइएज कर सकते हैं जिनमें बग रिपोर्ट को पुन: प्रस्तुत करना या महत्वपूर्ण जानकारी मांगना शामिल हो सकता है, जैसे कि संस्करण संख्या या प्रजनन निर्देश। यदि आप मुद्दों को ट्राइएज करना शुरू करना चाहते हैं, तो आरंभ करने का एक आसान तरीका CodeTriage पर p5.js की सदस्यता लेनाओपन सोर्स हेल्पर्स

  • Organization.md फ़ाइल एक उच्च-स्तरीय अवलोकन देती है कि मुद्दों को कैसे व्यवस्थित किया जा सकता है और निर्णय प्रक्रिया का पालन कैसे करना है। यदि आप रुचि रखते हैं तो हम इसमें शामिल होने के लिए आपका स्वागत करते हैं।

विकास की प्रक्रिया

  1. स्थापित करें node.js, जो स्वचालित रूप से npm पैकेज मैनेजर भी स्थापित करता है।

  2. फोर्क p5.js रिपॉजिटरी अपने खुद के गिटहब खाते में।

  3. क्लोन आपके स्थानीय कंप्यूटर पर गिटहब से रिपॉजिटरी का नया फोर्क।

    $ git clone https://github.com/YOUR_USERNAME/p5.js.git
  4. प्रोजेक्ट फ़ोल्डर में नेविगेट करें और npm के साथ अपनी सभी आवश्यक निर्भरताएं स्थापित करें।

    $ cd p5.js
    $ npm ci
  5. ग्रंट अब स्थापित किया जाना चाहिए, और आप इसका उपयोग स्रोत कोड से लाइब्रेरी बनाने के लिए कर सकते हैं।

    $ npm run grunt

यदि आप लाइब्रेरी में लगातार फाइलों को बदल रहे हैं, तो आप अपने लिए लाइब्रेरी को स्वचालित रूप से पुनर्निर्माण करने के लिए npm run dev को चलाना चाहते हैं, जब भी इसका कोई भी सोर्स आपके बिना पहली बार मैन्युअल रूप से टाइप किए बिना बदल जाता है।

  1. स्थानीय रूप से कोडबेस और कमिट में कुछ बदलाव करें।

    $ git add -u
    $ git commit -m "YOUR COMMIT MESSAGE"
  2. रन npm run grunt फिर से सुनिश्चित करें कि कोई सिंटैक्स त्रुटियां, परीक्षण विफलताओं, या अन्य समस्याएं नहीं हैं।

  3. पुश गिटहब पर आपके फोर्क में आपके नए परिवर्तन।

    $ git push
  4. एक बार सब कुछ तैयार हो जाने के बाद, अपने परिवर्तनों को एक पुल अनुरोध के रूप में सबमिट करें।

गोचास

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

कोड सिंटैक्स

p5.js को स्वच्छ और शैलीगत सुसंगत कोड सिंटैक्स की आवश्यकता होती है, जिसे वह Prettier और ESlint के साथ लागू करता है। आपके द्वारा किए जाने से पहले नियमों की जाँच की जाती है, लेकिन जैसे ही आप उन्हें लिखते हैं, त्रुटियों को उजागर करने के लिए आप अपने कोड संपादक के लिए ESlint प्लगइन भी स्थापित कर सकते हैं। , जो शायद आपकी मदद करेंगे क्योंकि आप कोडिंग कर रहे हैं और आपको एक असफल Git प्रतिबद्ध की परेशानी से बचाता है। सामान्य तौर पर, हम लचीलेपन के पक्ष में गलती करते हैं, जब यह कोड शैली की बात आती है, ताकि भागीदारी और योगदान के लिए बाधाओं को कम किया जा सके।

त्रुटियों का पता लगाने के लिए, अपने टर्मिनल में निम्न कमांड चलाएँ ($ प्रांप्ट टाइप न करें):

$ npm run lint

कुछ सिंटैक्स त्रुटियां स्वचालित रूप से ठीक की जा सकती हैं:

$ npm run lint:fix

स्थापित परियोजना शैली के साथ चिपके रहना आमतौर पर बेहतर होता है, लेकिन कभी-कभी एक वैकल्पिक वाक्यविन्यास का उपयोग कर सकते हैं। अपने कोड को समझना आसान बनाएं। इन मामलों के लिए, Prettier एक एस्केप हैच प्रदान करता है, // prettier-ignore टिप्पणी, जिसका उपयोग आप ग्रैनुलर अपवाद बनाने के लिए कर सकते हैं। यदि आप कर सकते हैं तो इसका उपयोग करने से बचने की कोशिश करें, क्योंकि लाइनिंग द्वारा लागू अधिकांश शैली वरीयताओं के लिए अच्छे कारण हैं।

यहाँ कोड शैली नियमों का एक त्वरित सारांश है। कृपया ध्यान दें कि यह सूची अधूरी हो सकती है, और .prettierrc और .esintintrc को संदर्भित करना सबसे अच्छा है।

  • ES6 कोड सिंटैक्स का उपयोग किया जाता है
  • सिंगल कोट्स (डबल कोट्स के बजाय) का उपयोग करें
  • इंडेंटेशन दो स्थानों के साथ किया जाता है
  • कोड में परिभाषित सभी चर का उपयोग कम से कम एक बार किया जाना चाहिए, या पूरी तरह से हटा दिया जाना चाहिए
  • X == सत्य या x == असत्य की तुलना न करें। इसके बजाय (x) या (!x) का उपयोग करें। x == सच, निश्चित रूप से अगर (x) से अलग है! यदि भ्रम की संभावना है, तो ऑब्जेक्ट्स को शून्य, संख्याओं से 0 या स्ट्रिंग्स की तुलना करें।
  • जब भी आप लिख रहे हैं, तो कार्य में अस्पष्टता या जटिलता होने पर अपना कोड कमेंट करें।
  • देखें मोज़िला JS प्रथाओं अधिक स्टाइलिंग टिप्स के लिए एक उपयोगी मार्गदर्शिका के रूप में।

इकाई परीक्षण

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

इकाई परीक्षण चलाने के लिए, आपको पहले परियोजना की निर्भरताएँ स्थापित करनी होंगी।

$ npm ci

यह p5.js के लिए सभी निर्भरताएं स्थापित करेगा; संक्षेप में, यूनिट परीक्षण के लिए सबसे महत्वपूर्ण निर्भरताएं शामिल हैं:

  • मोचा, एक शक्तिशाली परीक्षण ढाँचा जो व्यक्तिगत परीक्षण फ़ाइलों को निष्पादित करता है जो p5.js के लिए विशिष्ट हैं
  • मोचा-क्रोम, एक मोचा प्लगइन जो बिना सिर के गूगल क्रोम का उपयोग करके मोचा परीक्षण चलाता है

एक बार निर्भरताएं स्थापित हो जाने के बाद, यूनिट परीक्षणों को चलाने के लिए ग्रंट का उपयोग करें।

$ grunt

कभी-कभी कमांड लाइन पर के बजाय ब्राउज़र में परीक्षण चलाना उपयोगी होता है। ऐसा करने के लिए, पहले कनेक्ट सर्वर शुरू करें:

$ npm run dev

सर्वर के चलने के साथ, आपको एक ब्राउज़र में test/test.html खोलने में सक्षम होना चाहिए।

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

विविध

  • योगदानकर्ता डॉक्स फ़ोल्डर में अन्य फाइलें हैं जिन्हें आप देख सकते हैं। वे इस परियोजना के विशिष्ट क्षेत्रों, दोनों तकनीकी और गैर-तकनीकी में योगदान करने से संबंधित हैं।
  • लुकिंग इनसाइड p5.js p5.js डेवलपमेंट वर्कफ़्लो में इस्तेमाल होने वाले टूल्स और फाइल्स का वीडियो टूर है।
  • द कोडिंग ट्रेन का यह वीडियो :train::rainbow: तकनीकी योगदान के साथ शुरू करने का अवलोकन देता है।
  • p5.js डॉकर छवि डॉकर में आरोहित किया जा सकता है और इसका उपयोग p5 विकसित करने के लिए किया जाता है नोड जैसी आवश्यकताओं की मैन्युअल स्थापना की आवश्यकता के बिना .js या अन्यथा डॉकर की स्थापना से अलग किसी भी तरह से मेजबान ऑपरेटिंग सिस्टम को प्रभावित करना।
  • p5.js लाइब्रेरी के लिए निर्माण प्रक्रिया एक json डेटा फ़ाइल उत्पन्न करती है, जिसमें p5.js की सार्वजनिक API होती है और इसका उपयोग स्वचालित टूलिंग में किया जा सकता है, जैसे एक संपादक में स्वतः पूर्ण p5.js विधियों के रूप में। यह फ़ाइल p5.js वेबसाइट पर होस्ट की गई है, लेकिन यह रिपॉजिटरी के हिस्से के रूप में शामिल नहीं है।
  • p5.js ने हाल ही में ES6 पर माइग्रेट किया है। यह देखने के लिए कि यह संक्रमण आपके योगदान को कैसे प्रभावित कर सकता है कृपया es6-adoption.md फ़ाइल पर जाएँ।