Klassinen käärme-peli modernilla toteutuksella.
Kopioi tämä prompti Cursoriin tai muuhun AI-työkaluun aloittaaksesi projektin.
Luo Snake-peli HTML Canvas + React. Pelimekaniikka: - Käärme liikkuu jatkuvasti yhteen suuntaan - Nuolinäppäimet vaihtavat suuntaa - Ruoan syönti = kasva + pisteet - Törmäys seinään tai itseensä = game over Canvas: - Ruudukko (esim. 20x20) - Käärme: vihreä (pää kirkkaampi) - Ruoka: punainen - Tausta: tumma Ominaisuudet: - Pistelaskuri - Nopeus kasvaa pisteiden myötä - Huipputulokset localStorage - Pause (välilyönti) Tech: Next.js, TypeScript, Canvas API
Tässä projektissa rakennetaan seuraavat ominaisuudet:
Piirrä pelikenttä ja käärme.
Luo Snake-peli canvas-elementillä. Piirrä ruudukko ja käärme (pään väri eri kuin häntä). Käärme liikkuu automaattisesti nykyiseen suuntaan.
Lisää ohjaus ja ruoan syönti.
Lisää nuolinäppäin-ohjaus käärmeen suunnan vaihtamiseen. Lisää ruoka satunnaiseen paikkaan. Kun käärme syö ruoan, kasva ja generoi uusi ruoka.
Lisää game over ja huipputulokset.
Lisää törmäyksen tunnistus: seinään tai itseensä = game over. Näytä pisteet (syödyt ruoat). Game over -näkymä huipputuloksilla ja restart-napilla.
Kun perusprojekti on valmis, voit laajentaa sitä näillä ideoilla:
Selaa kaikkia pelit projekteja tai tutustu muihin kategorioihin.