Nájdite sa online

2020 - Q3

Moja práca zahŕňala

Popis projektu

Na tomto projekte som sa podielal formou spolupráce. V skutočnosti som mal za úlohu implementovať iba štyri obrazovky, avšak na túto spoluprácu som patrične hrdý, keďže sa jednalo o dobrú vec – vytvorenie prostredia pre online adopcie štvornohých miláčikov v rámci celého Slovenska.

Vyhľadávanie psíkov a/alebo útulkov

Prvými obrazovkami, na ktorých som sa podieľal kódom boli obrazovky vyhľadávania psíkov a útulkov. Okrem zobrazenia som implementoval základnú sadu typov filtrov, ktorú môžu budúci správcovia alebo programátori využiť pri rozširovaní filtrovacích možností.

Pre efektívne vyhľadávanie a maximálnu SEO korektnosť som implementoval filtrovanie založené na URL query parametroch. Návštevníci stránky si tak môžu posielať URL odkazy spolu s nastavenými filtrami čím bola docielená ideálna User Experience. Filtre je samozrejme možné ľubovoľne kombinovať, mazať alebo zresetovať do východzieho stavu.

Detail psíka alebo útulku

Obrazovka detailov psíka umožňuje návštevníkom stránky dozvedieť sa viac o psíkovi ponúkanom na adopciu alebo o útulku v ktorom je psík umiestnený. Na obrazovkách sa nachádza základný popis, fotky ako aj ďalšie informácie. Z obrazovky detailu psíka sa je možné prekliknúť priamo na obrazovku adopcie.

Zaujímavosti implementácie

V tomto projekte som skombinoval to najlepšie zo sveta server-side renderingu (SSR) a staticky generovaných webových stránok (SSG). Vďaka využitiu softvérového rámca Next.js je možné tieto prístupy jednoducho kombinovať a získať tým výhody z obidvoch svetov.

Prístup SSR využívajú obrazovky na vyhľadávanie psíkov alebo útulkov pre možné dosiahnutie optimálnej SEO. Staticky generované stránky detailov psíkov sú potom automaticky obnované vždy pri zmene relevantných dát na serveri.