आपको class components से भरा एक बड़ा codebase विरासत में मिला है। उसे hooks पर ले जाने के लिए आप क्या तरीका अपनाएंगे?

थोड़ा थोड़ा करके, और सिर्फ वहां जहां उससे कुछ मिलता हो। classes और function components आपस में ठीक चलते हैं, तो एक ही झटके में सब कुछ दोबारा लिखने की जरूरत नहीं। पहले पत्ते वाले components बदलिए, higher order components और render props में फंसे साझा logic को custom hooks में निकालिए, और error boundaries को class ही रहने दीजिए क्योंकि उन्हें अब भी वैसा ही रहना है। हर बदलाव को उसी काम से जोड़िए जो आप पहले से कर रहे हैं, और tests implementation नहीं, behavior के इर्द गिर्द रखिए।

मैं इसे एक project की तरह नहीं, एक आदत की तरह करूंगा। classes और function components आराम से साथ बैठते हैं, तो सब कुछ बदलने की कोई मजबूरी नहीं है, और ऐसा rewrite जिसमें user को कुछ नहीं दिखता, मनवाना मुश्किल है और bugs घुसाने का बढ़िया तरीका है। तो नियम यह बन जाता है: अगर आप पहले से कोई file बदल रहे हैं, और वह पत्ता या पत्ते के करीब है, तो उसे बदल दीजिए। असली इनाम वैसे भी components नहीं हैं, वह higher order components और render props में फंसा साझा logic है, क्योंकि वह custom hooks बन जाता है जिसे हर कोई इस्तेमाल कर सकता है। मेल के बारे में, componentDidMount और componentWillUnmount एक effect और उसके cleanup में जाते हैं, componentDidUpdate आम तौर पर मुद्दों के हिसाब से कई effects में बंट जाता है, और getDerivedStateFromProps लगभग हमेशा derived state निकलती है जिसे बस render के दौरान गिन लेना चाहिए। error boundaries class ही रहती हैं, यह नहीं बदला है। किसी भी गंभीर चीज को बदलने से पहले मुझे उसके इर्द गिर्द behavior के स्तर के tests चाहिए, जो अंदरूनी state नहीं बल्कि user को दिखने वाली चीज परखें, ताकि बदलाव साबित तौर पर तटस्थ रहे।