Pokédex

PokéAPI udostępnia rozbudowaną sieć powiązanych zasobów. Stworzyłem ten projekt, aby nauczyć się Angulara poprzez zmianę tych danych w spójne narzędzie, w którym użytkownik może naturalnie przejść od listy Pokémonów do szczegółowych i powiązanych informacji.

Zaprojektowałem i stworzyłem całą aplikację, w tym integrację API, mapowanie danych, wyszukiwanie i filtry, responsywne widoki, animacje oraz strukturę komponentów.

Widok pojedynczego Pokémona korzysta z kilku zasobów API, a te zależności nie powinny powodować chaotycznej lub wolnej nawigacji. Interfejs musiał też prezentować rozbudowane statystyki bez przeciążania użytkownika na mniejszych ekranach.

Frontend w Angularze składa wielokrotnego użytku komponenty oparte na Angular Material i porządkuje wyszukiwanie, filtry, karty, statystyki, zdjęcia oraz łańcuchy ewolucji w przewidywalnych widokach. Dane z PokéAPI są przekształcane do modeli prezentacyjnych, dzięki czemu struktura zewnętrznego API nie przenika do interfejsu.

Wdrożona aplikacja pozwala szybko znajdować Pokémony, porównywać najważniejsze informacje i śledzić ewolucje w jednym responsywnym interfejsie. Stała się też praktycznym sposobem na poznanie konwencji Angulara, dependency injection i reaktywnego projektowania UI.

Projekt rozwinął moje podejście do modelowania danych z zewnętrznych API i oddzielania ich surowej struktury od modeli prezentacyjnych. Pokazał też, że biblioteka komponentów przyspiesza pracę najbardziej wtedy, gdy jej wzorce są dopasowane do produktu, a nie używane bez zmian.