Wyślij zapytanie Dołącz do Sii

Ionic jest frameworkiem open-source’owym z ogromnym wsparciem swojej społeczności, według oficjalnej strony frameworku – liczącej ponad 5 milionów developerów. Ionic pomaga programistom tworzyć oraz deployować aplikacje hybrydowe, multi-platformowe oraz tak zwane aplikacje PWA (Progressive Web Application). Posiada on nawet swoje własne dedykowane IDE – Ionic Studio oraz umożliwia integrację z wieloma popularnymi i niezwykle użytecznymi narzędziami takimi jak Firebase.

Tworzenie w Ionicu nie musi być niczym nowym

angular vue react e1566488565108 - Ionic – 3 platformy, 1 projekt

Początkowo framework opierał się na Angularze JS oraz Apache Cordova. Aktualnie jednak składa się z wielu komponentów webowych i pozwala programiście wybrać javascriptowy framework z pośród Angulara, Reacta oraz Vue.js jako interfejs. Jeśli więc developer miał styczność, z którymś z wymienionych frameworków, tworzenie aplikacji w Ionicu nie będzie do końca czymś zupełnie nowym.

Pluginy

firebase e1566488596857 - Ionic – 3 platformy, 1 projekt

Od wtyczek tworzonych przez społeczność po płatne pluginy premium, Ionic umożliwia integrację z ogromną liczbą rozszerzeń, narzędzi i serwisów. Przede wszystkim wartym wyróżnienia jest Firebase. Dzięki integracji z tą platformą, można uzyskać w bardzo łatwy sposób dostęp do cloudowych baz danych noSQL, serwisu autentykacji znacznie upraszczającego logowanie użytkowników w aplikacji (nawet przez serwisy takie jak Facebook czy Google) lub serwisu Firebase Storage, umożliwiającego przechowywanie i zarządzanie plikami. Firebase oprócz tego umożliwia hostowanie aplikacji webowej, dzięki czemu poprzez prostą komendę w terminalu, developer jest w stanie udostępnić swoją aplikację Ionicową jako stronę internetową w sieci pod darmową lub własną płatną domeną.

Dostęp do natywnych funkcji urządzenia

Oprócz wymienionych w poprzednim punkcje integracji, na stronie głównej frameworku można znaleźć cały dział poświęcony wylistowanym pluginom dającym dostęp do natywnych mechanizmów urządzeń mobilnych. Przykładowe pluginy: Geolocation, Toast, Native Storage, Browser Tab, Camera. Warto zwrócić w tym miejscu uwagę na to, że pluginy Ionicowe często implementują pod spodem pluginy Cordovy i w znaczny sposób upraszczają ich użytkowanie. Nie przeszkadza to oczywiście w tym, żeby bezpośrednio w projekcie implementować „natywne” wtyczki Cordovy.

Komponenty UI

Ionic udostępnia również sporą paletę własnych elementów UI, których użycie często ogranicza się do umieszczenia w odpowiednim miejscu w kodzie widoku, znacznika podobnego do standardowych znaczników HTML. Przykładowo znacznik dla ostylowanego, czerwonego przycisku (np. służącego do odrzucania zmian) będzie wyglądał w następujący sposób:

<ion-button color="danger">Discard Changes</ion-button>

W łatwy sposób można zmieniać jego wygląd dzięki parametrom Expand, Fill oraz Size i, co najważniejsze, cały czas zachowując przy tym spójny wygląd i styl całej aplikacji.

Ionic ui component - Ionic – 3 platformy, 1 projekt

Wszystkie dostępne komponenty wraz z przykładami użytkowania w wybranym frameworku (Angular, React, Vue lub po prostu Vanilla JS) oraz często wizualizacją na wybranym systemie (iOS lub Android) jak ta na załączonym wyżej obrazku, dostępne są w dokumentacji na oficjalnej stronie: https://ionicframework.com/docs/components

Deployment

Zgodnie z tytułem tego artykułu po utworzeniu dowolnego projektu w Ionicu, bez większych przeszkód jesteśmy w stanie wypuścić jego dystrybucję na sytemy iOS, Android oraz po prostu do sieci z dostępem z poziomu przeglądarki. Każdy z tych procesów jest dokładnie opisany w oficjalnej dokumentacji i nie jest przesadnie skomplikowany:

Podsumowanie

Ionic jest naprawdę świetnym frameworkiem, dzięki któremu można ekspresowo tworzyć, niczym nie ustępujące natywnym, aplikacje hybrydowe. W połączeniu z Firebase’m developer zyskuje ogrom możliwości w formie niezwykle łatwej do przyswojenia i użytkowania.

Ocena:
Autor
Avatar
Tomasz Polański

Frontend developer z kilkuletnim doświadczeniem w technologii Fiori / UI5

Zostaw komentarz

Twój adres e-mail nie zostanie opublikowany.

Może Cię również zainteresować

Pokaż więcej postów

Bądź na bieżąco

Zapisz się do naszego newslettera i otrzymuj najświeższe informacje ze świata Sii.

Otrzymaj ofertę

Jeśli chcesz dowiedzieć się więcej na temat oferty Sii, skontaktuj się z nami.

Wyślij zapytanie Wyślij zapytanie

Natalia Competency Center Director

Get an offer

Dołącz do Sii

Znajdź idealną pracę – zapoznaj się z naszą ofertą rekrutacyjną i aplikuj.

APLIKUJ APLIKUJ

Paweł Process Owner

Join Sii

ZATWIERDŹ

This content is available only in one language version.
You will be redirected to home page.

Are you sure you want to leave this page?