W tym odcinku rozmawiamy o najnowszej wersji aplikacji XBox dla Windows 10. Co to ma wspólnego z JS? Otóż wydana ostatnio wersja beta jest napisana w React Native i korzysta ze stworzonych przez Microsoft specjalnie dla RN bibliotek. Później przechodzimy do wydanego ostatnio narzędzia programowania wizualnego ReacType i filozoficznych rozważań, czy narzędzia piszące kod za nas na pewno są przydatne.

Przydatne Linki

• XBox ReactNative: https://news.xbox.com/en-us/2020/06/11/xbox-app-performance-updates/
• ReacType: https://reactype.io
• Create-React-App: https://create-react-app.dev
• SeaMonkey Composer - (dawniej Mozilla Composer) - https://www.seamonkey-project.org

Transkrypt

Marek Piechut: Zacznijmy dzisiaj może od mojego tematu, a mój temat jest związany z graniem. Chciałem Cię zapytać Bartku, na czym ty grasz czy Ty grasz na Xbox czy na PlayStation.

Bartek Witczak: Oczywiście że na PlayStation.

Marek Piechut: No i ja też gram na PlayStation, dlatego dzisiejszy temat to jest nowa aplikacja Xbox dla Windowsa 10 jest napisana w React Native. Co nas nie dotyczy dlatego że jest Xbox ani nie dotyczy nas dlatego że z Windows, bo my gramy na PlayStation a używamy w pracy Mac’ów ale jest tam też React Native, a to już nas bardzo dotyczy. Nie wiem jak Ty ale ja generalnie jestem mocno zajawiony tym, bo to znaczy, że React Native wpływa na nowe wody, a jak wiesz ja to jestem dużym zwolennikiem React Native praktycznie dla prawie wszystkich aplikacji poza jakimiś naprawdę dużymi firmami i naprawdę wymagającymi strasznego performance jestem bardzo za. No i teraz Microsoft też ostro inwestuje.

Bartek Witczak: Mega wiadomość według mnie również, że taka duża firma wchodzi w temat React Native. Dla mnie jest to spore zaskoczenie. Może z racji tego że za bardzo nie interesuję się tymi technologiami Microsoft , natomiast wiedziałem, że wcześniej był Xamarin. Wydawało mi się że Microsoft bardziej inwestuje w swoje platformy w całego .Net i C# także, to chyba jest element, który mnie najbardziej zaskoczył i ciekawi mnie tylko czy to jest etap eksperymentów z React Native ze strony Microsoftu. Czy to już jest taka bardziej świadoma decyzja wejścia w React Native. I rzeczywiście inwestycji związanych z napisaniem wielu rzeczy pod tą bibliotekę . No właśnie jest Xamarin i Xamarin Microsoft kupił sobie w 2016 roku.

Marek Piechut: Ciekawe czy to było tak jak z Nokią, ze kupili ją po to, żeby ją zlikwidować. Ale 2016 to już chwilę ten Xamarin mają i Xamarin to jest mniej więcej to, co React Native. Nawet trochę więcej w sumie bo można robić jak na iOS a Mac OS Windowsa w sumie też i mobilna i desktop itd. I dodatkowo można je robić w C# czyli czymś co jest dzieckiem Microsoftu mocno promowany no, a teraz tu taki pikus, że Microsoft tutaj przechodzi na React Native. To jest bardzo ciekawe tym bardziej że sami musieli sobie napisać cały bindings’y dla Windowsa i teraz następny przyniósł napisali sobie też bindings’y dla Mac OS’a więc tam naprawdę dużo się dzieje .No i z takich jeszcze tutaj chciałem dorzucić Ci, bo trochę się przygotowałem, że z ciekawych liczb, bo aplikacja Xbox jest przeniesiona z mojej ulubionej technologii czyli Electron, to jest technologia której ludzkość tyle ramu nie stworzyła żeby Elektron się w niej zmieścił. No i zeszli z ilością RAMu o 50 proc. i z wielkość aplikacji z 300Mb do 60Mb. Według mnie to jest gruba gruby, to są dobre rezultaty i pierwszy feedback też taki ale to szybko działa w porównaniu ze starą aplikacją.

Bartek Witczak: No właśnie to też jest chyba sytuacja że aplikacja dla Xboksa to nie jest pierwsza aplikacja którą Microsoft stworzył w React Native.?

Marek Piechut: No to jest trudne pytanie. Tak, chociaż nie jest trudne, bo Skype był w React Native. Chociaż już nie jest. Z tego co wiem teraz jest w Electron’ie, co jest ruchem w przeciwną stronę. Widzę, że tam są różne teamy i wcale ze sobą nie rozmawiają. No i są jakieś przecieki że Office jest też częściowo w React Native. Także dzieje się, dzieje się i też jestem ciekawy czy jakieś inne firmy będą desktopowo szły w React Native, no i czy aplikacje na Xboxa będą w React Native, bo to też jest ciekawe pytanie. Czy na nowym Xboksie będzie React Native i czy aplikacje Microsoftu będą w nim napisane.

Bartek Witczak: No dobra a myślisz że właśnie ta sytuacja że Skype wraca z React Native na Electrona. To bardziej pokazuje że tak naprawdę oni są w takim momencie eksperymentów?

Marek Piechut: No nie wiem, no to jest to jest. To jest dla mnie totalna zagwostka. Ja nie widzę szczerze mówiąc żadnego powodu żeby iść tą drugą stronę. No ale może mają taką samą ilość kodu która się sprawdza albo zauważyli jakieś problemy inne z React Native, których my nie zauważamy ich nie mogą rozwiązać i dlatego wracają do Electrona. Nie sądzę jakoś żeby użytkownicy byli z tego zadowoleni no bo jak działa Electron to każdy wie. To jest muł niesamowity.

Bartek Witczak: Wiesz, co mnie jeszcze zastanawia w ogóle ta kwestia czy wejście w ten świat React Native jest podobnie jak w przypadku Facebooka i w ogóle stworzenia React Native po prostu konieczność braku deweloperów natywnych i wykorzystanie tych osób, które już w JS po prostu piszą. Czy to j oznaczałoby trochę wyczerpanie się tych osób które które działają w tym świecie C#? Czy z czego to wynika? Na pewno to jest na tyle duża firma że pewnie tych projektów tam jest tam mnóstwo i trudno będzie jednoznacznie powiedzieć czy to jest takie mocne wejście czy po prostu testowanie kolejny jakby formy budowania cross-platform’owych aplikacji.

Marek Piechut: No właśnie. Możliwe że teraz C# stanie się jak Java backend’owym narzędziem i jego aplikacjach po stronie użytkownika będzie JS i React Native. No nie wiem z tego co widziałem to wyniki są obiecujące, takie aplikacje jak Xbox to jest świetna reklama React Natvie. Te bindings’y do Windows i Mac OS są już produkcyjne i można spokojnie używać. Otwiera kolejną furtkę że już teraz komponenty React Native będzie można pisać tak, że będą działały na mobilce, na desktop nie webie itd. React Native rośnie. Muszę powiedzieć, że ja jestem zadowolony z tego. Go Microsoft. Mam nadzieję że będę tego więcej i będzie lepiej będzie szybciej. Będzie w JS.

Bartek Witczak: Zdecydowanie według mnie też bardzo, bardzo fajna informacja. Szczególnie, że w React Native działamy, także zdecydowanie fajnie. Polecamy.

Marek Piechut: Fajnie jak takie duże firmy inwestują.

Bartek Witczak: No mam nadzieję że zainwestują w sam core. Po prostu będzie trochę więcej osób będzie mogło w core’ze React Native podziałać i wspomóc community. Żeby to rzeczywiście rosło, rosło solidnie. Ciekawy jestem, bardzo ciekawy.

Bartek Witczak: Dobrze Panie Marku, także chciałbym podjąć drugi dzisiejszy temat: mianowicie ostatnio widziałem kilka artykułów na temat nowego narzędzia ReacType. Jest to jedno z takich narzędzi, które służy, powiedzmy do bootstrapowania, rozpoczynania projektu i tutaj chciałem ogólnie porozmawiać z Tobą o takich narzędziach. Bo powiedzmy, że mamy takie trzy typy, czyli narzędzia typu zero configuration, w stylu Create react app, analogiczne narzędzie do tworzenia aplikacji w Next’cie. Mamy jakby rodzinę, powiedzmy boilerplate’ów, gotowych takich repozytorów, których można sobie sklonować i od tego rozpocząć projekt. Czy właśnie takie narzędzie jak ReacType w tylu design to code, także bootstrapujemy projekt, klikamy sobie jakieś tam widoki, dodajemy guziki, jakiś lekki layouting, to produkuje nam jakąś początkową wersję projektu, który potem rozwijamy. Chciałem Cię na początku zapytać, czy ty w ogóle korzystałeś wcześniej z takich narzędzi i w jakim kontekście w ogóle.

Marek Piechut: Znaczy…, to jest zawsze…, ja korzystałem kiedyś z Creat react’a i z takich rzeczy, i to jest zawsze takie pytanie „jaki problem chcemy rozwiązywać”, nie? Bo…, jeżeli nasz problem jest taki, że chcemy szybciutko z czymś wystartować, żeby móc to za 2 czy 4 dni pokazać komuś i żeby mógł sobie zobaczyć jak apka wygląda, to moim zdaniem nie ma szczególnie dużego znaczenia czego użyjesz, tak? Możesz użyć młotka, Create react app, możesz skopiować coś od kolegi albo, nie wiem, ściągnąć z Internetu. To nie ma dużego znaczenia, czego użyjesz. Ale jeżeli projekt to jest jakaś duża aplikacja, nie wiem, robiona przez wiele osób, w dłuższym czasie i on ma jakiś dosyć duży budżet, na dłuższy time line i tak dalej. No to nie wiem czy to ma jakiekolwiek znaczenie, że bootstrap projektu nie zajmie Ci 5 minut tylko 2 godziny na przykład, tak. A równocześnie będziesz miał możliwość dostosowywania go pod siebie w miarę rozwoju aplikacji, a ja też nie do końca wierze, że ktoś inny przewidzi, jakieś Twoje potrzeby i zawsze trafisz na ten moment, kiedy zderzysz się z tym, że czyjeś wyobrażenie tego bootstrapa czy tego boilerplate’u czy czegokolwiek jest inne niż Twoje, nie.. I ja dlatego mam takie mętne jakieś…wątpliwą przyjemność miałem pracy z takimi narzędziami, powiedzmy.

Bartek Witczak: Yhy, z tego właśnie, co ja kojarzę, to chyba z boilerplate’ów nie korzystaliśmy nigdy w projektach takich dla klientów. Z Create react app ja korzystam tylko i wyłącznie na szkoleniach, kiedy tam rzeczywiście startujemy od zera, żeby rzeczywiście w czasie takiego szkolenie móc zacząć od takiej czystej karty i po prostu stworzyć projekt. Natomiast zawsze, jak dołączaliśmy do jakiś projektów, to zawsze właśnie był ten ból, że jeżeli coś było stworzone przy użyciu tego Create react app, to potem trzeba było się albo ejectować, albo w ogóle od początku pisać tą konfigurację. Tak jak mówisz, nigdy praktycznie nie było sytuacji, żeby te potrzeby zostały spełnione, no nie?

Marek Piechut: Znaczy, bo to po ejectcie, to zawsze wygląda strasznie ten projekt i trzeba go i tak…, ten czas, ta praca włożona w ogarnianie tych skryptów po ejectkcie, to moim zdanie jest lepiej go przeznaczyć na napisanie tych skryptów od początku, tak. Konfiguracje webpack’a. Tym bardziej, że ten webpack w wersji, bodajże od 4 czy od 3, to już tam tej konfiguracji jest, nie wiem, bardzo mało. W sensie, że napiszesz 10 linijek konfiguracji i to Ci starczy prawie na cały projekt. Potem, nie wiem, tu dołożysz linijkę, tu dwie, tu trzy i to praktycznie, prawie bez żadnej konfiguracji możesz sobie z tym żyć. Ciekawsze właśnie są te narzędzia, wiesz, te tam, co niby więcej mają za Ciebie zrobić, tak.

Bartek Witczak: Tylko wiesz co, ja jak zacząłem czytać o tym ReacType, to pierwsza rzecz, która mi się skojarzyła od razu to było podejście, jak dostajemy jakiś design’y w Zeppelinie czy Sketch’u, czy w jakimś innym narzędziu i są wygenerowane CSS-y i wszyscy myślą, że będzie można to po prostu sobie skopiować i wstawić do projektu. Potem przychodzi życie i okazuje się, że skopiować to sobie można wielkość czcionki i kolor, a wszystkie inne rzeczy trzeba sobie ustawić. I zastanawiam się z czego wynika chęć tworzenia i w ogóle cały ten, powiedzmy teraz, ruch taki wiesz not code, żeby klikać te aplikacje, bo wydaje mi się, że to jest podobna sytuacja jak z jakimiś landing’ami, które sobie tworzymy przez Drag’n’dropa i nagle ludzie chcieli by budować całe aplikacje w oparciu o to, że sobie wyklikają jakiś tam layout i to będzie cała aplikacja. Co sądzisz?

Marek Piechut: Znaczy, no..to znowu…dla mnie to jest pytanie po co, bo ja jestem może trochę starszy od Ciebie i dla mnie takie klikane aplikacje nie kojarzą się z Zeppelinem tylko z jakimiś tam latami dziewięćdziesiątymi, gdzie była Mozilla miała wbudowany kreator stron na przykład, albo wtedy było dużo…, taka moda była na wszelkie wizualne tworzenie stron. No i prawda jest taka, że ludzie i tak te strony pisali. Też znowu jakby teoria była taka, że przecież można sobie wszystko wyklikać i dopisać te kawałki, które tam Ci brakują, ale i tak skończyło się na tym, że ludzie woleli pisać, bo utrzymanie tych wyklikanych rzeczy było absurdalnie drogie. No więc nie wiem…, ja z dużą dozą sceptycyzmu do takich rzeczy podchodzę. Pewnie one świetnie się sprawdzą, jeżeli znowu chcemy zrobić szybciutko jakiś MVP wyklikać je ciach, ciach, ciach i gdzieś je wrzucić, i spróbować zwalidować produkt, ale dla jakiś większych projektów, to pewnie nie będzie miało jakiegoś większego sensu, bo nawet, pewnie, ten uzyskany czas i tak zostanie później pochłonięty na walkę z jakimiś niuansami, które tam są w tym rozwiązaniu, a czemu by nie zacząć od razu sensownie z grubej rury ze swoimi narzędziami, nie..

Bartek Witczak: Dokładnie, dokładnie. No ja mam podobne zdanie. Nie zdarzyło się jeszcze, żeby te rozwiązania się ,w jakimś sensie, nawet sprawdziły przy takich dużych projektach. Może to, tak jak mówisz, wynika właśnie z tego, że raczej działamy na większych projektach, niż na takich tygodniowych aplikacjach i z tego też bierze się ten niewielki pewnie zysk, który dostajemy, czy to właśnie z tych narzędzi w stylu Create react app, jakiś boilerplate’ów, no czy takich narzędzi właśnie, gdzie klikamy sobie jakieś MVP.

Marek Piechut: To jest tak jak z tymi landig’ami czy innymi takimi stronami, tak. Zależy od tego jak dużej elastyczności gdzieś tam…, możesz sobie pozwolić na jak dużą elastyczność w projekcie, tak. Że jeżeli nie jesteś bardzo skoncentrowany na konkretnych rozwiązaniach, tylko chcesz jak najszybciej coś mniej więcej takiego jak chcesz mieć, to są świetne narzędzia, tak… Siadasz, robisz. Trwa to dzień, dwa, trzy, jest gotowe, ale zawsze uderzasz w ten moment, że jeżeli to ma żyć dłużej, no to chciał byś, żeby coś było gdzieś indziej, inaczej, tak. Żeby rzeczy działy się inaczej, żeby logika była inna, żeby to się komunikowało z backand’em, żeby ten backand był customowy, żeby animacje były customowe i tak dalej. I tak i tak powoli wchodzisz, wchodzisz, wchodzisz w coraz większe rozwijanie tych rzeczy. No i to jest teraz pytanie, czy łatwiej było by Ci od początku je robić, tak jak je teraz przerabiasz czy łatwiej Ci jest je teraz tam po kawałeczku, śrubeczki przykręcać, a te…, jak wiadomo tam pod spodem z reguły nie siedzą wcale piękne rzeczy, nie?

Bartek Witczak: Dokładnie, no super.

Marek Piechut: No dobra, nie wiem jakie jest Twoje zdanie, bo generalnie ja takim rzeczą z reguły daję łapkę w dół. Także mój pierwszy odruch jest taki, żeby tego nie używać. Ktoś musi mi udowodnić, że to naprawdę coś da, a jeżeli nie udowodni tego to ja, z reguły, jestem na nie..

Bartek Witczak: Znaczy dla mnie po prostu, tak jak mówię, zysk jest zbyt mały. Nie ma większego sensu dla mnie inwestować czasu też w naukę, bo akurat, jeżeli chodzi o ReacType to jest to normalnie aplikacja na MAC’a, którą się ściąga, która potem wypluwa ten kod. Szkoda mi po prostu czasu. Raczej jako ciekawostka. Raczej wydaje mi się, że dla osób, które może zaczynają.., chociaż bardzo często właśnie kończy się to jakimiś smutkami, gdzie potem się trzeba ejectować..

Marek Piechut: To kończy się tym, że musimy przyjechać i to wszystko tam szpadlować, żeby…

Bartek Witczak: Dokładnie

Marek Piechut: …żeby działało.

Bartek Witczak: Chociaż, na przykład, jeżeli chodzi o Create react app, to rzeczywiście wydaje mi się, że to jest spoko do jakieś formy nauki czy nawet te boilerplate’y, żeby zobaczyć sobie co ludzie dołączają do projektów, co często stosują – to zawsze jest jakaś tam porcja wiedzy, jakieś inspiracji. Można sobie po prostu spojrzeć, jak te elementy są skonfigurowane i ewentualnie coś się może przydać. Natomiast, no, zdecydowanie każdy projekt, który bym zaczynał, to po prostu czysta karta, webpack na początku i sobie budujemy spokojnie rzeczy, które rzeczywiście potrzebujemy, a nie te, które, jakby ktoś zdecydował, że będą potrzebne w projekcie w danej wersji, w danej, powiedzmy, konfiguracji.

Marek Piechut: No tak, tak, bo to się później kończy jakimiś starymi wersjami, których nie możesz zaktualizować, bo ktoś użył starej wersji, albo użył innej niż ty chciałeś, albo a jakiejś kombinacji to nie działa i ty nie jesteś w stanie usunąć jakiegoś kawałka… No tu…ostatecznie pewnie będą takie problemy z tym, tak jak z reguły się pojawiają.

Bartek Witczak: No dobra. To co? To by było na tyle.

Marek Piechut: To by było na tyle…