इसके साथ संबद्ध Testlify

Testlify - साझा कंपोनेंट लाइब्रेरी

चार ऐप्स में UI को दोहराने के बजाय एक ही स्टेटलेस कंपोनेंट लाइब्रेरी बनाने का फैसला किया, उसे एक प्राइवेट npm पैकेज के रूप में शिप किया, और फीचर डिलीवरी का समय लगभग 30% घटा दिया।

Testlify चार अलग-अलग ऐप्लिकेशन के एक सुइट के रूप में चलता है, और हर एक अपने-अपने तरीके से वही बटन, फॉर्म, मोडल और टेबल दोबारा बना रहा था। इसका मतलब था कि एक ही काम चार बार हो रहा था और प्रोडक्ट्स के बीच UI आपस में मेल नहीं खा रहा था। मैंने हर ऐप में अलग-अलग दोहराव के बजाय एक अकेली साझा कंपोनेंट लाइब्रेरी बनाने की वकालत की, फिर उसे बनाया और शिप किया।

मैंने क्या बनाया

  • फैसला: मैंने हर ऐप को अपनी अलग कॉपी रखने देने के बजाय UI को एक ही लाइब्रेरी में समेटने के पक्ष में तर्क दिया — शुरुआती लागत को उस बिखराव और दोहराई गई मेहनत के मुकाबले तौलते हुए जो हम पहले से ही झेल रहे थे। एक बार सहमति बनने के बाद, बनाने की ज़िम्मेदारी मैंने संभाली।
  • स्टेटलेस डिज़ाइन: कंपोनेंट्स को स्टेटलेस और प्रेजेंटेशनल रखा, ताकि उनमें कोई ऐप-विशिष्ट लॉजिक न हो और वे चारों प्रोडक्ट्स में साफ-सुथरे तरीके से लग जाएँ। हर ऐप अपना डेटा और व्यवहार खुद जोड़ता है; लाइब्रेरी सिर्फ़ इस बात की मालिक है कि चीज़ें कैसी दिखें और महसूस हों।
  • प्राइवेट npm पैकेज के रूप में शिप किया: इसे एक वर्ज़न वाले प्राइवेट npm पैकेज के रूप में पब्लिश किया, ताकि हर ऐप एक सामान्य डिपेंडेंसी के ज़रिए वही कंपोनेंट्स खींचे और एक वर्ज़न बंप के साथ फ़िक्स और सुधार पा ले — न कॉपी-पेस्ट, न फ़ोर्क।

यह क्यों मायने रखता था

UI को एक बार बनाकर उसे चारों ऐप्स में दोबारा इस्तेमाल करने से फीचर डिलीवरी का समय लगभग 30% घट गया — टीमों ने वही बुनियादी हिस्से दोबारा बनाना बंद कर दिया और एक साझा सेट से चीज़ें जोड़ना शुरू कर दिया। इससे पूरे सुइट को एक जैसा रूप भी मिला, क्योंकि लाइब्रेरी में किया गया एक बदलाव चार जगहों पर हाथ से दोबारा लगाने के बजाय एक ही बार में हर जगह पहुँच जाता है।