Keskitaso🔧 Refaktorointi

Custom Hookin luonti

Luo custom hook toistuvalle logiikalle, jotta vältät copy-paste-koodia komponenttien välillä. Saat siistin ja testattavan hookin jota voi käyttää koko sovelluksessa.

Suora vastaus: mitä tämä sivu antaa?

Valmis promptimalli: voit kopioida sen sellaisenaan ja muokata muuttujat omaan tilanteeseen.
Nopea käyttöönotto: mukana on täytetty esimerkki ja selitys milloin promptia kannattaa käyttää.
Jos tarvitset työkalun käyttöohjeen: jatka Cursor-oppaisiin osoitteessa `/vibekoodaus/cursor`.

Prompti

Luo custom hook seuraavalle logiikalle joka toistuu useassa komponentissa.

Toistuva logiikka:
[LOGIIKKA]

Käyttöesimerkit:
[ESIMERKIT]

Hookin vaatimukset:
- TypeScript-tyypit
- Parametrisoitavuus
- Virheenkäsittely
- Dokumentaatio

Luo hook ja näytä käyttöesimerkki.

Suomenkieliset vinkit

Teknisten termien suomennokset auttavat ymmärtämään konsepteja paremmin
Claude ymmärtää suomea erityisen hyvin muihin malleihin verrattuna
Suomenkieliset promptit toimivat hyvin Claude- ja GPT-4-malleissa

Muuttujat

Korvaa nämä hakasulkeissa olevat muuttujat omilla tiedoillasi:

[LOGIIKKA]
[ESIMERKIT]

Esimerkki

Täytetty prompti

Luo custom hook seuraavalle logiikalle joka toistuu useassa komponentissa.

Toistuva logiikka:
- Hae dataa API:sta
- Näytä loading-tila
- Käsittele virheet
- Mahdollisuus uudelleenhakuun

Käyttöesimerkit:
- Käyttäjätietojen haku
- Tuotelistauksen haku
- Tilausten haku

Hookin vaatimukset:
- TypeScript-tyypit
- Parametrisoitavuus
- Virheenkäsittely
- Dokumentaatio

Luo hook ja näytä käyttöesimerkki.

Tulos

Custom hook ja käyttöesimerkki.

Vinkit

Kuvaile toistuva logiikka tarkasti
Näytä missä sitä käytetään
Mieti parametrisointi

Milloin käyttää

Sama logiikka toistuu
Haluat keskittää toiminnallisuuden
Testattavuuden parantaminen

Liittyvät promptit

Komponentin jakaminen osiin

Jaa suuri, monimutkainen komponentti pienempiin ja uudelleenkäytettäviin osiin. Selkeyttää koodia, helpottaa testausta ja tekee ylläpidosta huomattavasti helpompaa.

Keskitaso