Programowanie cross-platform. Jak to zrobić inaczej?: Azure, .NET, Architecture

Czym jest programowanie cross-platform

In computing, cross-platform software (multi-platform, or platform independent software) is computer software{.mw-redirect} that is implemented on multiple computing platforms.[1] Cross-platform software may be divided into two types; one requires individual building or compilation for each platform that it supports, and the other one can be directly run on any platform without special preparation, e.g., software written in an interpreted language or pre-compiled portable bytecode for which the interpreters or run-time packages are common or standard components of all platforms.[

Programowanie cross-platform w wypadku mobile jest to tworzenie jednej bazy kodu i UI, który będzie wyglądał i dostarczał tą samą funkcjonalność na każdej z platform. Ułatwia to później utrzymanie aplikacji, oraz dostarczanie nowej funkcjonalności dla użytkowników.

Największym benefitem jest łatwość utrzymania i zarządzania kodem. Tworzymy aplikację tylko raz od razu na wszystkie platformy.

Wprowadzenie, czyli czym jest React Native

Jest to biblioteka stworzona przez Facebook umożliwiająca pisanie aplikacji w JavaScript, używając tych samych technik co w React. Dzięki temu otrzymujemy aplikację zbudowaną z komponentów. Została ona oficjalnie zaprezentowana na konferencji React.js Conf w 2015 roku.

Co mnie przekonało do niej przekonało

Lubię React i jest to chyba jedne z nielicznych JS framework-ów, które polubiłem. Z benefitów, które mnie do niego przekonały to:

Debugowanie kodu w Chrome (kod, który jest uruchomiony na urządzeniu)
Live reload (aplikacja aktualizuje się na urządzenie wraz ze zmianami kodu aplikacji)
Łatwość tworzenia UI (dzięki komponentom React)
Możemy korzystać z natywnych modułów i elementów UI (możemy ładować elementy napisane w np. Objective-C, Swift, Java)

Jak zacząć

Najłatwiej jest zacząć instalując wymagane pakiety przy użyciu Chocolatey.

Jeżeli jeszcze nie mamy instalujemy Chocolatey, otwieramy konsolę PowerShell v3+ z prawami administratora. Należy się upewnić czy Get-ExecutionPolicy nie zwraca wartości Restricted. W innym wypadku odpalamy komendę

Do czego jest to nam potrzebne? Aby wykonać skrypt PowerShell ściągnięty z Internetu 🙂 A więc odpalamy komendę

Mamy zainstalowane Chocolatey możemy teraz zainstalować Node i Python2 używając komend

Kolejnym krokiem jest instalacja The React Native CLI, używamy do tego Node Package Manager

A więc dotarliśmy do końca przygotowania środowiska. Czas zacząć pisać naszą pierwszą aplikację.

The Basics, czyli jak zrobić prostą aplikację

Naszym przykładem będzie prosta aplikacja prezentująca mapę dostarczaną przez Google Maps.

W celu stworzenia naszego pierwszego projektu w React Native uruchamiamy konsolę i piszemy

następnie zmieniamy katalog i piszemy

Strukturę naszego projektu mamy już gotową. Teraz pora podłączyć plugin mapy. W tym celu wykorzystamy plugin React Native Maps. Uruchamiamy konsolę i piszemy

Co zrobić w razie problemów z kompilacją

Jeżeli pojawiają się nam jakieś problemy z kompilacją należy wykonać sekwencję poniższych komend.

Plus i minusy React Native vs Xamarin Forms

Oba środowiska dają nam na wyjściu kod natywny działający ze zbliżoną prędkością.

W mojej ocenie na plus Xamarin to możliwość pisania w C# lub F# używając naszego ulubionego IDE. Minusem jest niestety potrzeba kompilowania kodu żeby zobaczyć zmiany na UI.

Plusem React Native jest natomiast niewątpliwie Live reload. Minusem brak wsparcia dla rozwiązań monitorujących działania aplikacji w produkcji jak np. Xamarin App Insight.

Podsumowując nie ma jednoznacznego zwycięzcy. Oba rozwiązania mają swoje plusy i minusy, oraz dla obu można znaleźć miejsce w którym sprawdzą się lepiej.