Aloittelija🚀 Aloitus

Ensimmäinen komponentti

Luo uusi React-komponentti selkeällä rakenteella.

Prompti

Luo React-komponentti nimeltä [KOMPONENTIN_NIMI].

Komponentin tarkoitus: [KUVAUS]

Ominaisuudet:
- [OMINAISUUS_1]
- [OMINAISUUS_2]
- [OMINAISUUS_3]

Käytä:
- TypeScript
- Tailwind CSS tyyleille
- Funktionaalista komponenttia

Lisää propsien tyypit ja selkeät kommentit.

Suomenkieliset vinkit

Suomenkieliset promptit tuottavat suomenkielisiä koodikommentteja ja muuttujanimiä
Voit sekoittaa suomea ja englantia — teknisiä termejä ei tarvitse kääntää
Claude ymmärtää suomea erityisen hyvin muihin malleihin verrattuna

Muuttujat

Korvaa nämä hakasulkeissa olevat muuttujat omilla tiedoillasi:

[KOMPONENTIN_NIMI]
[KUVAUS]
[OMINAISUUS_1]
[OMINAISUUS_2]
[OMINAISUUS_3]

Esimerkki

Täytetty prompti

Luo React-komponentti nimeltä ProductCard.

Komponentin tarkoitus: Näyttää tuotteen tiedot korttimuodossa

Ominaisuudet:
- Näyttää tuotteen kuvan, nimen ja hinnan
- Lisää koriin -nappi
- Hover-efekti

Käytä:
- TypeScript
- Tailwind CSS tyyleille
- Funktionaalista komponenttia

Lisää propsien tyypit ja selkeät kommentit.

Tulos

Täydellinen TypeScript-komponentti tyypeillä ja tyyleillä.

Vinkit

Kuvaile kaikki tarvittavat ominaisuudet
Mainitse haluttu tyylitapa (Tailwind, CSS modules)
Pyydä responsiivisuutta tarvittaessa

Milloin käyttää

Luot uuden UI-komponentin
Haluat selkeän lähtökohdan
Opit React-kehitystä

Liittyvät promptit

Uuden projektin rakenne

Luo selkeä kansiorakenne ja perusrakenne uudelle projektille.

API-endpointin luonti

Luo uusi API-endpoint validoinnilla ja virheenkäsittelyllä.

Tietokantakyselyjen luonti

Luo tietokantakyselyt CRUD-operaatioille.

Hyödyllisiä resursseja

Lisää prompteja

Selaa kaikkia aloitus prompteja tai tutustu muihin kategorioihin.

Kaikki aloitus promptit Kaikki kategoriat