Retningslinjer for refaktorering
Refaktorer i små trinn: trekk ut komponenter og hooks, slank props, fjern død kode, og hold testene feilfrie ved hvert kontrollpunkt.
Retningslinjer for refaktorering er en gratis leksjon i React Academy på CoddyKit. Dette er leksjon 3 av 3. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i React Academy, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i React Academy inneholder totalt 3 leksjoner.
Hva refaktorering betyr
Mål: Endre struktur, ikke oppførsel.
- Arbeid i små trinn
- Trekk ut komponenter/hooks
- Forenkle støyende props
- Fjern død kode
Trygge vaner
- Behold identisk resultat etter hvert trinn
- Foretrekk uttrekking fremfor store omskrivinger
- Gi nytt navn eller flytt ved hjelp av IDE-en
- Kjør tester (eller manuelle kontroller) ofte
Trekk ut en komponent
Før: gjentatt markup. Etter: Den uttrekte ProductRow reduserer duplisering.
<div id="root"></div>Trekk ut en hook
Flytt logikken til useCart; UI-et blir enklere og kan gjenbrukes.
<div id="root"></div>Forenkle props med config
Forenkle props: send ett config-objekt i stedet for mange løse props.
<div id="root"></div>Tips og sjekkliste
- Refaktorer i små trinn; kontroller UI-et etter hvert trinn
- Trekk ut komponenter/hooks for å redusere duplisering
- Forenkle props med en gruppert config
- Slett død kode etter at du har bekreftet at den ikke har noen referanser
Sjekk av grunnleggende refaktorering
Oppsummering
Oppsummering: Behold oppførselen identisk mens du forbedrer strukturen. Trekk ut små deler, forenkle props, fjern død kode og kontroller resultatet etter hvert trinn.
Lær deg React med en AI-veileder – gratis
Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.
- Kurs
- 88
- Leksjoner
- 324
Ofte stilte spørsmål
Er leksjonen «Retningslinjer for refaktorering» gratis?
Ja – hele teksten i «Retningslinjer for refaktorering» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av React Academy-kurset, kan du oppgradere til CoddyKit PRO. Kurset i React Academy inneholder totalt 3 leksjoner.
Hva lærer jeg i «Retningslinjer for refaktorering»?
Refaktorer i små trinn: trekk ut komponenter og hooks, slank props, fjern død kode, og hold testene feilfrie ved hvert kontrollpunkt. Du øver på React Academy med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.
Trenger jeg erfaring for å begynne med React Academy?
Ingen tidligere erfaring er nødvendig. React Academy på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 3 av 3.
Hvor lang tid tar leksjonen «Retningslinjer for refaktorering»?
De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.
Kan jeg skrive og kjøre kode i denne React Academy-leksjonen?
Ja. Alle React Academy-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.
Alle leksjonene i dette kurset
- Funksjonsmapper og brukergrensesnitt- kontra sammensatte komponenter
- Konvensjoner for hooks-mapper og samlokalisering av tester
- Retningslinjer for refaktorering