paint-brush
Ndlela Yo Retrofit Swikambelo Eka ReactJS Codebases Handle Ka Swikambelohi@matheusmarabesi
Matimu lamantshwa

Ndlela Yo Retrofit Swikambelo Eka ReactJS Codebases Handle Ka Swikambelo

hi Matheus Marabesi7m2025/02/13
Read on Terminal Reader

Ku leha ngopfu; Ku hlaya

Tipheteni ta ReactJs ti nga va xihlovo xa swihoxo loko swi ta eka xivumbeko xa xiyimo xa swiphemu. Ku bola swiphemu sweswo i ntlhontlho, hambiswiritano, swifanele ku tekeriwa enhlokweni kuva ku hlayisiwa kahle xisekelo xa khodi. Eka nhluvukiso wa xiphurofexinali, mfumo wa misava hinkwayo i xilaveko xa xisekelo, eka switirhisiwa swa reactjs a swi hambananga.
featured image - Ndlela Yo Retrofit Swikambelo Eka ReactJS Codebases Handle Ka Swikambelo
Matheus Marabesi HackerNoon profile picture

Ku kambela tisoftware ni ku endla leswaku swi olova ku endla tano swi ve nchumu lowu ndzi wu tsakelaka ku ringana malembe ma nga ri mangani sweswi. Ku tsakela loku sweswi ku kongomisiwe ngopfu eka switirhisiwa swa le mahlweni leswi a swi ri kona. Hi ku kongoma, eka switirhisiwa swa reactjs. Se ku hundze tinhweti ti nga ri tingani sweswi ndzi ri karhi ndzi nghena eka khodi ya reactjs ya malembe ya ntlhanu ku ya eka khume leyi ndzi nyikaka vutivi na mintlhontlho.


Mina hi ndzexe ndzi ri karhi ndzi tumbuluxa khodi ya reactjs ku ringana malembe ma nga ri mangani sweswi; yin’wana ya tiphurojeke to sungula ta xihlovo lexi pfulekeke leti ndzi ti aveleke yi vuriwa testable . Yi humesiwile hi 2020 kumbe ku tlula, naswona ku sukela kwalaho, ndzi nyiketele xiphemu xa ndlela ya mina yo dyondza eka reactjs.


Sweswinyana, ndzi tirhile eka tiphurojeke tin’wana ta xihlovo lexi pfulekeke leti kongomisaka eka xiphemu xa testability xa swilo swo fana na json-tool na text-tool ; switirhisiwa leswi haswimbirhi i swa xihlovo lexi pfulekeke naswona swi tirhisiwa eka Snapcraft. Ku engetela eka sweswo, ndzi tshamela ku fambisa swikambelo eka vuhlayiselo lebyi vuriwaka reactjs-playground . I ndhawu leyi ndzi ringetaka swihlawulekisi swa reactjs naswona ndzi nyiketela tiawara ta mina to dyondza eka yona. Ntokoto lowu ndzi wu kumeke eka malembe wolawo eka tiphurojeke ta xihlovo xa le kusuhi na tiphurojeke ta xihlovo lexi pfulekeke wu ndzi nyikile masungulo lama ndzi pfumelelaka ku kuma swihinga swin’wana leswi tolovelekeke na swipfuno.

Mintlhamu

Vatumbuluxi lava joyina xivumbeko xa reactjs na switirhisiwa va swi xiya leswaku swiaki leswi layiburari yi swi nyikaka swa olova ku swi twisisa no swi vumba. Mhaka leyi nga twisisekiki swinene ya xiphemu yi nga tirhisiwa ku vumba swihlanganisi swa vatirhisi hi ku hatlisa. Kambe, swi nga tlhela swi va xihlovo xa swihoxo loko swi ta eka xivumbeko xa xiyimo xa xiphemu xa xiyimo xa le henhla. Ku bola ka maendlelo i mhaka leyi dyondziweke ku ringana malembe.

Swiphemu Leswikulu

Vukulu bya vun’we bya abstraction eka software byi vile mhaka ya njhekanjhekisano na yona; van’wana va vula leswaku maendlelo na titlilasi swi fanele ku va na nhlayo yitsongo ya mitila, kasi van’wana va tsakela ku va na xiphemu lexikulu, lexi hleriweke kahle. Ku fana na le ka phurojeke yin’wana na yin’wana ya software ku nga langutiwi vukulu, ndzi kunguhata ku tsakela sayizi leyi nyikaka mongo wo tala naswona yi humesaka ku hlangana kutsongo eka ndzhwalo wa vutivi loko ndzi ri karhi ndzi hlaya khodi.


Swi nga endleka kumbe e-e, eka ntokoto wa mina, ndzi kuma leswi swi koteka loko ndzi ri na mindzilakano leyi vekiweke kahle ya xiphemu xa khodi leyi ndzi tirhaka eka yona xikan’we na xiyimo xa bindzu. A ndzi si kuma nomboro ya masalamusi ya sweswo, hambiswiritano, mpimo wa mina wu hundzuke nhlayo ya ku tlula loku ndzi faneleke ku ku endla exikarhi ka tifayela ku twisisa leswi ndzi faneleke ku swi endla.


Ku tlula-tlula ko tala hilaha ndzi faneleke ku endla hakona, ndzi lava ku khoma enhlokweni ya mina mongo ni rungula; leswi swi va swi tika loko u ri karhi u hlayisa xisekelo xa khodi. Ku bola swiphemu sweswo i ntlhontlho, hambiswiritano, swifanele ku tekeriwa enhlokweni kuva ku hlayisiwa kahle xisekelo xa khodi.

Mfumo wa Misava Hinkwayo

Eka nhluvukiso wa xiphurofexinali, mfumo wa misava hinkwayo i xilaveko xa xisekelo; eka switirhisiwa swa reactjs, a swi hambananga na swona. Xiyimo xa misava hinkwayo xi voniwa hi ku olova hi vatirhisi va xitirhisiwa lexi. Loko u xava nchumu wo karhi naswona u engetela xitirhisiwa xexo eka xigolonyana xa wena, u nga vona nhlayo ya swilo leswi u swi engeteleke; lowu i mfumo wa misava hinkwayo.


Eka switirhisiwa swa reactjs, redux ya phakeji ya vulawuri bya mfumo bya misava hinkwayo leyi khale a yi tirhisiwa ngopfu sweswi yi hungute matirhiselo ya yona ku seketela swiyimo leswintsongo ku rhendzela mindzilakano eka xitirhisiwa. Hambiswiritano, vaaki va avelane mavonelo yo hambana eka xilaveko xo tirhisa redux eka vufambisi bya mfumo wa misava hinkwayo; leswi swi endle leswaku ku va na ti-blog tin’wana eka mhaka leyi:



Hambi leswi ku nga na ku tlhelela endzhaku ku suka eka vaaki, react-redux, leyi nga layiburari leyi tirhisiwaka ku boha redux eka swiphemu swa reactjs, yi vile na ku amukeriwa ka yona loku kulaka eka malembe ya ntlhanu lama hundzeke ku ya hi mikhuva ya npm . Hi February 01, 2025, ku dawuniloda loku kombisiweke eka npm for redux i 6,752,764.


Loko u tivutisa leswaku i yini alternative to that then nhlamulo i reactjs context and hooks with queries.


Eka switirhisiwa leswi titshegeke hi phasela ra redux, i ntlhontlho hi woxe ku baleka. Xiyimo xa misava hinkwayo i xin’wana xa swilo leswi titshegeke leswi hungutaka ku ringetiwa ka xitirhisiwa. Hi ntokoto wa mina, xiyimo xa misava hinkwayo lexi lavekaka xi tala ku ta na ku rharhangana loku engetelekeke ka vutivi bya domain. Hambi leswi u nga ha lavaka ku kambela ntsena xiphemu xo karhi kumbe xiphemu xa xitirhisiwa xa wena, a wu nge swi koti handle ko avelana ku titshega ka misava hinkwayo loku xiphemu lexi xi ku lavaka.

Swipfuno swa kona

Ku amukela ti reactjs eka switirhisiwa swa mabindzu, hi nkarhi wa ku tsariwa ka xiphemu lexi, ku vile xiboho lexinene xa ku hlayisiwa (hambi leswi nkarhi wa nkoka lowu Facebook a yi ri na wona loko yi cinca modele wa layisense ya layiburari). ReactJs yi nyika ku fambisana ka le ndzhaku eka ti-API leti nga ha tirhisiwiki, leswi endlaka leswaku ku amukeriwa ka nkarhi wo leha ku va xin’wana xa swipfuno swa nkoka.

Swiyimo swa xiyimo

Tanihi loko swiphemu a swi enelanga tanihi mhaka leyi nga twisisekiki ku famba-famba, swiyimo na swona i xin’wana xa swipfuno leswi reactjs yi swi nyikaka mayelana na ku kambela. Ndzi andlala swo tala hi mhaka leyi eka blog post leyi nyiketeriweke eka reactjs context testing . Level ya encapsulation leyi reactjs context yi yi nyikaka i yin’wana ya mimpfuno ya nkoka ya ku retrofitting swikambelo na ku endla leswaku ku va na refactoring eka swisekelo swa khodi ya reactjs.


Tanihi leswi ku bola ka swiphemu na loji ya bindzu swi nga ntlhontlho, swiyimo i switirhisiwa leswi endlaka leswaku ku va na ku lulamisiwa hi vuntshwa ko antswa ka khodi. Eka xiphemu xa testability xa swilo, leswi na swona i vuyelo tani hi leswi ku nga endlelo leri endlaka leswaku ku va na nhlayo leyi hungutiweke ya test-double leyi tirhisiwaka, xisweswo, leswi yisaka eka khodi leyi nga kamberiwaka swinene.

Swikambelo swo Retrofitting

Loko hi nyikiwa nxaxamelo wo tano ku fikela sweswi, xiphemu xo kambela hi tshemba leswaku xi ve erivaleni leswi titshegeke hi ndlela leyi khodi ya xihlovo yi hleriweke ha yona na ndlela leyi mindzilakano ya xitirhisiwa yi hlelekeke ha yona. Kambe, tani hileswi khodi yo kambela yi titshegeke hi khodi ya vuhumelerisi, ti doubles ta xikambelo tinga tirhisiwa ku pfuneta ku hambanyisa xikalo. Endlelo ra miehleketo ra swikambelo swo tlherisela endzhaku ri vumbiwa hi magoza ma nga ri mangani yo olova.


  1. Tsala xikambelo xo olova xa ntirho lowu lavekaka.
  2. Tsutsuma xikambelo xa xikambelo u vona xi tsandzeka.

2.1.1. Xana xikambelo xi pasile?

 2.1.1 - Yes → Check if the feedback is correct 2.1.2 - No → Provide the dependency without questioning
  1. Vuya eka 1.


Xiya leswaku: Endlelo leri hlamuseriweke laha ri fana na leri hlamuseriwaka tanihi xikambelo xa Vumunhuhati lexi hlamuseriweke hi Michael Feathers eka

Ku Tirha Hi Ndlela leyinene hi buku ya Khodi ya Ndzhaka.


Ku fika ka ti-LLM swi nga tlhela swi nyika vutivi loko ku ri karhi ku tsariwa swikambelo swo sungula na ku tlherisela endzhaku masungulo ya khodi handle ka swikambelo swihi na swihi. Goza rin’wana na rin’wana eka maqhinga lawa ri endleriwe ku va leri vuyeleriwaka; swa koteka ku hlanganisa switayele swo hambana swa TDD na swona. Endlelo leri ringanyetiweke a hi ku tshika ku endla hinkwaswo no tlherisela endzhaku swiyimo hinkwaswo leswi kotekaka swa swikambelo na timhaka hinkwato leti kotekaka leti xisekelo xa khodi xi nga na tona, i ntlangu wa swivutiso. Ntirho wun’wana na wun’wana lowu kamberiweke i xiphemu lexi nghenaka eka phazili.


Endlelo leri fanaka ri ringanyetiwa eka refactoring. Vatumbuluxi va fanele ku kota ku tshamela ku refactor xiphemu xa khodi. A hi phurojeke leyi hambaneke, naswona a yi kongomisiwanga eka ku tinyiketela eka yona ntsena. Xikongomelo xa yona lexikulu i ku endla leswaku xisekelo xa khodi xi antswa ku tlula leswi a xi ri xiswona. Hi ku phindha-phindha. Ku na swiyenge swi nga ri swingani leswi nga tirhisiwaka ku tlherisela swikambelo endzhaku eka swisekelo swa khodi leswi nga riki na swona:


  • Ku lulamisa xihoxo - Leri i nkarhi wo hlangana na khodi na ku twisisa ndlela leyi yi tikhomaka ha yona. Ku lulamisa xihoxo i xiphemu xa mhaka, hambiswiritano, leyi yi tlhela yi va nkarhi wo hlamusela xitirhisiwa lexi nga evokweni.
  • Ku tirhisa ntirho wuntshwa - Leswi swi fana na ku lulamisa xihoxo, hambiswiritano, endlelo leri tekiweke ri cinca nyana. I ndlela leyi fanaka ni leyi ringanyetiweke hi Kent Beck: “Endla leswaku ku cinca ku olova, kutani u endla ku cinca loku olovaka.” Ntirho lowuntshwa i ndhawu leyi paluxaka xisekelo xa khodi xo endla ku cinca ku nga si nghenisa xivumbeko lexintshwa.


Exikarhi ka endlelo leri i endlelo ro dyondza; goza rin’wana na rin’wana ro dyondza xisekelo xa khodi ri tekeriwa enhlokweni.

Ti-LLM

Copilot yi nga tirhisiwa ku endla leswaku xikambelo xo sungula xo lavisisa lexi hlamuseriweke eka xiyenge lexi hundzeke xi tirha hi ku tirhisa michini; ku landzela milawu yinharhu, yi nga sungula hi ku kuma swilo leswi titshegeke na ku tsala sete ya swikambelo leswi heleleke leswi nga ta tirhisiwa tanihi xisekelo.


A hi tekeni Testable tanihi xikombiso; i xitirhisiwa lexi tsariweke ku tlula malembe ya ntlhanu lama hundzeke eka reactjs naswona xi tirhisa enzyme ku kambela. Eka mpimanyeto wa namuntlha, layiburari leyi tekeke vulawuri i vitest kumbe jest xikan’we na layiburari yo kambela. Ku tlherisela endzhaku ti test cases for testable na ku tirhisa ti LLMs, hi nga tirhisa copilot ku hi pfuna eka ku tlakusa swilo swo tika.


Testable yi vumbiwile hi ntokoto wa gamified lowu nga na xiyimo, swiyimo, na ku ya emahlweni ka mutirhisi eka mintlhontlho yo hambana. Xiphemu lexi hlamuseriweke eka xifaniso lexi landzelaka i xiphemu lexi tirhisiwaka ku kombisa mimbulavurisano na ku ya emahlweni eka matimu ya ntokoto. Hi ku tirhisa Copilot for vscode, ndzi yi komberile ku tsala xikambelo hi khodi ya vuhumelerisi leyi hi yi tsakelaka:


Ku kombela copilot ku tsala test case

Loko se yi layicha xivutiso no xopaxopa khodi, yi nyika nhlamulo.

Nhlamulo ya copilot eka xiyimo xa xikambelo

Xikan’we na nhlamulo, Copilot u xiye leswaku a ndzi si tirhisa layiburari yo kambela naswona yi ringanyeta leswaku ndzi endla sweswo, naswona endzhaku ka sweswo, xiyimo xa xikambelo lexi endliweke xa kombisiwa. Ku fambisa xikambelo tanihilaha xi kombisiweke hakona swi endla leswaku xikambelo xi nga pasi naswona swi xi fungha tanihi xo tshwuka.


Ku tsandzeka ka xikambelo ku suka eka khodi yo tumbuluxa

Mhaka leyi i ya nkoka hikuva yi kombisa leswaku setup yo engetela yi fanele ku tekeriwa enhlokweni naswona Copilot a yi swi kotanga ku swi hlela. Hi leswi landzelaka:

  • Ku nghenisiwa ka swilo a swi lulamanga; yi lava ku lulamisiwa leswaku yi kombetela eka fayili leyinene.
  • Setup ya nhundzu a yi lulamanga; fayili a yi nga koteki ku endla leswaku leswi nga endzeni swi tirha eka mhaka ya xikambelo.


Ku khuluka loku hlamuseriweke eku sunguleni eka xiyenge lexi ku tirha na laha. Xirhendzevutani xa mbuyelo sweswi i ku sungula ku lulamisa timhaka teto no fambisa swikambelo ku kondza xirhendzevutani xa TDD xi hetiwa.


Switirhisiwa