News4 min czytania

Google Glide – stwórz aplikację mobilną w arkuszu bez kodowania

Arkadiusz Cichurski

React Native Developer

Google Glide - stwórz aplikację mobilną w arkuszu bez kodowania

Szybkie spojrzenie na technologię

Glide apps jest usługą google, która umożliwia nam tworzenie aplikacji cross platformowej, bez potrzeby napisania ani jednej linijki kodu. Do stworzenia aplikacji potrzebny jest nam wyłącznie arkusz z danymi na których chcemy operować oraz odpowiednie skonfigurowanie wyglądu i działania samej aplikacji w webowym kreatorze.   

Proces tworzenia aplikacji

Na potrzeby zbadania technologii obrałem sobie za cel stworzenia aplikacji o nazwie “Przekaz” umożliwiająca wyświetlanie i dodawanie przedmiotów które chcemy przekazać za darmo dla innych użytkowników.

Aplikacja ta umożliwiała by logowanie na swoje konto z wykorzystaniem adresu email oraz oferowałaby wyświetlanie i dodawanie nowych przedmiotów do istniejącej bazy przedmiotów do oddania.

Proces tworzenia aplikacji dzieli się na trzy części 

  • odpowiednie przygotowanie arkusza danych gdzie będą przechowywane dane wszystkie potrzebne dane dotyczące przedmiotów
  • wytworzenie aplikacji w webowym kreatorze
  • udostępnienie aplikacji poprzez przesłanie linku do aplikacji

Stworzenie arkusza

Pierwszym krokiem było stworzenie arkusza danych reprezentującego bazę przedmiotów i miast wykorzystywanych w aplikacji. Do tego celu stworzyłem arkusz składający się z 2 części (przedmioty i miasta).

Poniżej widnieje również arkusz App: Logins, jednakże generowany jest on automatycznie przez aplikację przy procesie logowania  do aplikacji z wykorzystaniem adresu email

Struktura arkusza Przedmioty

Struktura arkusza Miasta

Struktura arkusza App: Logins

Stworzenie aplikacji w kreatorze

Po przejściu do kreatora webowego i wybraniu arkusza, zostanie wygenerowana nasza aplikacja, jak widać na ekranie powyżej automatycznie zostały stworzone nawigacyjne taby odpowiednio dla miast jak i przedmiotów.

Nie jest to jedyna opcja, którą możemy dostosować, korzystając z menu bocznego które zostało zaprezentowane poniżej mamy wybór tego jakie dane mają być wyświetlane z arkusza i w jakiej formie mają być zaprezentowane, możemy również zdecydować się na wybór innego wyglądu layoutu aplikacji – wybór jest tutaj ograniczony do zmiany kolorystyki (możemy zastosować ciemny motyw, wybrać kolor nagłówków, czy też dostosować wygląd ikony aplikacji). Możliwe jest również wprowadzanie zmian w samym arkuszu z poziomu kreatora korzystając z opcji Data.

Menu konfiguracyjne

Dodatkowo w samej aplikacji mamy dostęp do zmiany poszczególnych elementów naszej aplikacji w odpowiednich zakładkach

  • Layout – zmienimy tutaj układ wyświetlanych danych (z arkusza) dla aktualnie wyświetlanego ekranu aplikacji
  • Tabs – zmieniamy układ nawigacji aplikacji
  • Data – podgląd naszego arkusza danych i dodanie do niego bardzo prostych relacji
  • Settings – dostosowanie nazwy, opisu i layoutu aplikacji (kolorystyka)
  • Edit sheet – edycja arkusza danych
  • Reload sheet – aktualizacja aplikacji po wprowadzeniu zmian a arkuszu
  • Share app – opcja udostępnienia aplikacji

Edycja ekranu aplikacji

Przykładowo wybierając określony ekran aplikacji i korzystając z zakładki layout możemy dostosować nasz ekran korzystając z gotowych gotowych komponentów które możemy dodać za pomocą przycisku + w prawym górnym rogu ekranu. 

W prosty sposób możemy tutaj decydować o kolejności wyświetlania się poszczególnych danych przeciągając i układając komponenty tak by spełniały nasze wymagania co do układu.

Wybór gotowych komponentów i ich ograniczenia

Jak widać poniżej, za pomocą gotowych komponentów możemy w łatwy sposób wyświetlić dane z arkusza które nie muszą ograniczać się wyłącznie do tekstu, w prosty sposób możemy prezentować również zdjęcia, lokalizację, umożliwić odtwarzanie plików audio lub video. Wystarczy tylko dodać odpowiedni link w arkuszu, a podczas konfiguracji komponentu wskazać na odpowiednią kolumnę arkusza jako źródło danych.

Niestety takie podejście niesie ze sobą pewne ograniczenia, nie możemy bowiem z poziomu aplikacji dodać i wyświetlić danych które nie znajdują się bezpośrednio w arkuszu, każdy tekst czy też inna treść musi się z nim znajdować.

Nie jesteśmy wyłącznie ograniczeni do wyświetlania danych, za pomocą komponentu Form Button możemy również stworzyć formularz dzięki któremu użytkownik może dodać dane do naszej aplikacji.

Tym na co warto uważać jest fakt iż dostosowanie wyglądu poszczególnych komponentów pod swoje preferencje jest niemal niemożliwe, jedyną opcją jest zmiana rozmieszczenia poszczególnych komponentów względem siebie.

Publikacja aplikacji

Proces publikacji aplikacji jest tutaj bardzo uproszczony, ogranicza się do przejścia w zakładkę Share app w webowym kreatorze a następnie skopiowaniu linku do aplikacji i przesłaniu go dla zainteresowanych osób.

Niestety nie mamy tutaj dostępu do chociażby plików apk które później moglibyśmy wykorzystać do publikacji naszej aplikacji w sklepie google.

Po wejściu w link aplikacja uruchamia się w przeglądarce telefonu i aby stworzyć złudzenie natywności tego rozwiązania według oficjalnej dokumentacji należy dodać skrót do strony na ekranie głównym naszego telefonu.

Link do aplikacji stworzonej na potrzeby rozpoznania tej technologii: https://zbpzx.glideapp.io

Potencjalne możliwości wykorzystania technologii oraz jej ograniczenia

GlideApps jest ciekawą koncepcją, pozwala w bardzo szybki sposób tworzyć proste aplikacje. Niestety technologia jest jeszcze bardzo ograniczona, nie pozwala na bardziej złożone operacje, czy też dostosowanie szczegółów tego jak dokładnie mają wyglądać poszczególne komponenty. Tym co sprawiło mi problemy podczas testowania tej technologii było również ograniczenie sposobu i wyboru jakie dane są przesyłane do arkusza po np. wysłaniu ich przez formularz. Obecnie istnieje możliwość aktualizacji danych tylko jedną tabeli jednocześnie i brakuje możliwości utworzenia bardziej złożonych relacji między danymi. 

Ta technologia ma zdecydowanie większe zastosowanie w aplikacjach prezentujących jakiś zbiór danych, które nie wymagają dodatkowej logiki po stronie api. Np stworzenie książki przepisów, spisu pracowników firmy itd.


Arkadiusz Cichurski

React Native Developer

Post article


5/5 - (3 votes)

Masz projekt? Porozmawiajmy

Skontaktuj się