FakeShop
Demo e-shop s okamžitým vyhľadávaním, filtrami v URL, zoznamom želaní a celým nákupným procesom.
O projekte
Osobný projekt z roku 2024, ktorý som neskôr prerobil na realistický demo e-shop so 194 produktmi z DummyJSON. Nič sa nepredáva a neplatí sa.
Čo si môžete vyskúšať
- Vyhľadávanie s návrhmi a filtre podľa ceny, hodnotenia, značky, dostupnosti a zliav, všetko v URL
- Stránky produktov s galériou so zoomom, recenziami a podobnými produktmi
- Košík s krokom späť, zľavovými kódmi FAKE10 a FREESHIP a hranicou dopravy zadarmo
- Pokladňa s kontrolou čísla karty a termínom doručenia v pracovných dňoch; ukladajú sa len posledné štyri číslice
- Porovnanie produktov, zoznam želaní, naposledy pozreté a história objednávok, synchronizované medzi kartami
- Tmavý režim, prechod obrázka z karty na stránku produktu, inštalácia ako aplikácia
Ako to funguje
- React Router v dátovom režime s loadermi, akciami a lenivými routami; detaily produktu sa streamujú cez Suspense
- End-to-end testy na veľkosti počítača aj telefónu s kontrolou prístupnosti, vrátane testov, že sa neukladajú údaje karty
- Lighthouse CI zlyhá pod 100 bodov v prístupnosti, osvedčených postupoch a SEO; nasadenie na GitHub Pages cez GitHub Actions
Zoznam zmien
- React 18 na 19, React Router 6 na 8 a Vite 5 na 8
- Tailwind CSS 3 na 4 a TypeScript 5 na 6
- Zdroj dát sa zmenil z Fake Store API na DummyJSON
- Kedy
- 2024 – 2026
- Typ
- Osobný
- Verzie
- React 19
- React Router 8
- Vite 8
- Tailwind CSS 4
- Technológie
- React
- React Router
- TypeScript
- React Hook Form
- Tailwind CSS
- Vite
- Vitest
Playwright- ESLint
- GitHub Pages
Galéria
