Refaktorointiohjeet
Refaktoroikaa pienin askelin: eriyttäkää komponentteja ja hookeja, karsikaa propseja, poistakaa kuollut koodi ja pitäkää testit läpäisevinä jokaisessa tarkistuspisteessä.
Refaktorointiohjeet on ilmainen React Academy-oppitunti CoddyKitissä. Tämä on oppitunti 3/3. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu React Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. React Academy-kurssilla on yhteensä 3 oppituntia.
Mitä refaktorointi tarkoittaa
Tavoite: Muuta rakennetta, älä toimintaa.
- Työskentele pienin askelin
- Erota komponentteja ja hookeja
- Karsi hälyttäviä propseja
- Poista kuollut koodi
Turvalliset toimintatavat
- Pidä tulos samanlaisena jokaisen vaiheen jälkeen
- Suosi suurten uudelleenkirjoitusten sijaan eriyttämistä
- Nimeä uudelleen ja siirrä IDE:n avulla
- Suorita testit (tai tee manuaaliset tarkistukset) usein
Komponentin eriyttäminen
Ennen: toistuva merkkaus. Jälkeen: eriytetty ProductRow vähentää toistoa.
<div id="root"></div>Hookin eriyttäminen
Siirrä logiikka hookiin useCart; käyttöliittymästä tulee yksinkertaisempi ja uudelleenkäytettävä.
<div id="root"></div>Propsien karsiminen config-objektin avulla
Karsi propsit: välitä yksi config-objekti monien irrallisten propsien sijaan.
<div id="root"></div>Vinkkejä ja tarkistuslista
- Refaktoroi pienin askelin; tarkista käyttöliittymä jokaisen vaiheen jälkeen
- Erota komponentteja ja hookeja toiston vähentämiseksi
- Karsi propsit ryhmitellyn config-objektin avulla
- Poista kuollut koodi, kun olet varmistanut, ettei siihen ole viittauksia
Refaktoroinnin perusteiden tarkistus
Kertaus
Kertaus: Säilytä toiminta ennallaan ja paranna samalla rakennetta. Erota pieniä osia, karsi propsit, poista kuollut koodi ja tarkista tulos jokaisessa vaiheessa.
Opi React tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 88
- Oppitunnit
- 324
Usein kysytyt kysymykset
Onko oppitunti ”Refaktorointiohjeet” ilmainen?
Kyllä – oppitunnin ”Refaktorointiohjeet” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko React Academy-kurssin, päivitä CoddyKit PROhon. React Academy-kurssilla on yhteensä 3 oppituntia.
Mitä opin oppitunnilla ”Refaktorointiohjeet”?
Refaktoroikaa pienin askelin: eriyttäkää komponentteja ja hookeja, karsikaa propseja, poistakaa kuollut koodi ja pitäkää testit läpäisevinä jokaisessa tarkistuspisteessä. Harjoittelet React Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni React Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin React Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 3/3.
Kuinka kauan ”Refaktorointiohjeet”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä React Academy-oppitunnilla?
Kyllä. Jokainen React Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- Ominaisuuskansiot sekä UI- ja yhdistelmäkomponentit
- Hooks-kansioiden käytännöt ja testien sijoittaminen
- Refaktorointiohjeet