Jak tworzyć dobre progresywne aplikacje webowe?

Czym właściwie są progresywne aplikacje webowe?

Przypomnijmy, że progresywne aplikacje webowe to tak zwane Progressive Web Apps. Technologia przygotowana przez Google Inc. umożliwia stworzenie aplikacji mobilnej ze strony internetowej. Google wykorzystało platformę Angular 4.0 do stworzenia takiej aplikacji. Czym się charakteryzuje? Jest stroną internetową, a działa jak aplikacja mobilna, w dodatku może funkcjonować częściowo offline. Nie wymaga osobnej instalacji, zajmuje stosunkowo mało miejsca. Klienci mają do niej dostęp bezpośrednio z wyszukiwarki lub z ikonki na pulpicie. Jest napisana w języku webowym, wyświetla powiadomienia, w tle potrafi wykorzystywać funkcje telefonu np. aparat lub geolokalizację.

Dlaczego warto posiadać aplikacje progresywne?

Klienci głównie korzystają ze stron mobilnych za pomocą swoich smartfonów. Taka aplikacja progresywna to brak konieczności instalacji, możliwość działania offline i automatyczna aktualizacja, o której użytkownik nie musi pamiętać. Co ciekawe, taka aplikacja bez dostępu do internetu potrafi zapamiętać zawartość koszyka, co jest świetnym rozwiązaniem dla sklepów online, które dzięki temu nie tracą klienta.

Korzyści z posiadania PWA:

• użytkownik ma dostęp do aplikacji pod ikoną na pulpicie,
• aplikacja może częściowo bądź całkowicie działać bez dostępu do internetu,
• jest responsywna,
• użytkownik nie widzi różnicy w wyglądzie aplikacji a strony natywnej,
• automatycznie się aktualizuje,
• nie wymaga tworzenia osobnych aplikacji na różne systemy operacyjne,
• jest bezpieczna, opiera się o protokół https,
• jest dobrze pozycjonowana przez Google,
• jest dobrze pozycjonowana przez Google,

Co zrobić, aby strona działała jako aplikacja progresywna?

PWA nie wymagają specjalnego projektowania ani programowania. Wystarczy przekonwertowana zwykła strona internetowa, do której należy dodać kilka funkcji natywnych, dopasować do wymagań mobile, przemyśleć jej wygląd. Chociaż wygląd aplikacji może nie odróżniać się od zwykłej strony www, jednak warto wziąć pod uwagę najnowsze standardy i zastosować jeden z dostępnych wzorców projektowych, by nikt nie miał wątpliwości, że strona jest zgodna z PWA. A przede wszystkim najważniejsze - by była wygodna dla użytkowników. Wiele zależy od tego czy obecna wersja portalu wymaga jedynie odświeżenia, czy chcemy zastosować gotowe już rozwiązanie, czy może stworzyć od podstaw cały front. Takie przedsięwzięcie nie wymaga większych nakładów osobowych niż projekty front-endowe, powinno zająć około 3 miesięcy.

Jaką technologię wybrać?

Opierając się na nowoczesnych technologiach oraz wykorzystując takie elementy jak plik manifestu, ServiceWorker i HTTPS można stworzyć dobrą aplikację progresywną. Jakie rozwiązania są najczęściej wykorzystywane przy tworzeniu PWA?

• Angular to framework rozwijany przez Google. Ułatwia budowanie aplikacji typu SPA i  PWA. Jest na tyle rozbudowany, że może być zbyt skomplikowany, jeśli myślisz o stworzeniu prostej aplikacji.
• React.js nie narzuca specyficznych wymogów, jest wydajna stabilna i bezpieczna. Towarzyszy jej dobrej jakości biblioteka, taka jak: Redux, React Router, Next.js. Rozwijana przez programistów Facebooka, jest jednym z najpopularniejszych rozwiązań.
• Vue.js to dobry zestaw narzędzi dla mniejszych projektów. Jest popularny wśród osób uczących się i poznających poszczególne technologie. Będzie odpowiedni również dla stworzenia bardziej skomplikowanych aplikacji.
• Knockout biblioteka JavaScript, której główną zaletą jest duża funkcjonalność przy małej wadze. Polecana do mniejszych projektów.
• Polymer biblioteka rozwijana przez Google, często wykorzystywana do tworzenia prototypów.
• Webpack to narzędzie, które odpowiednio konwertuje różne formaty, tak by były traktowane jako obiekty JavaScript. Jest niezbędne do tworzenia niestandardowych aplikacji.
• Lighthouse wtyczka do Chrome, która pozwala na testowanie i monitorowanie aplikacji.

Podsumowanie

Stworzenie dobrej aplikacji progresywnej wymaga zebrania wiedzy na temat aktualnej architektury oraz zastanowienia się nad możliwościami strony i potrzebami klienta. Może być przedsięwzięciem, które nie pochłonie tak dużej ilości czasu, a które przyniesie niewspółmierne korzyści. Na pewno pomoże zoptymalizować koszty, przyśpieszy działanie strony oraz zwiększy ilość oraz zaangażowanie użytkowników. Warto przemyśleć jak duży to projekt i wybrać odpowiednie narzędzia do jego wdrożenia. Na pewno PWA to technologia przyszłości i warto w nią zainwestować szczególnie, że jest obsługiwana przez wszystkie współczesne przeglądarki internetowe.