To wydarzenie już się skończyło. Zapraszamy na inne ciekawe wydarzenia.

WarsawJS Workshop #61 — React Native na każdym poziomie

location icon
HubHub Aleje Jerozolimskie 93, Warszawa Zobacz na mapie
calendar icon
Od 20 lut 10:00 do 20 lut 15:00

Jaki jest cel warsztatów?

Dzielić się wiedzą i doświadczeniem. Tym razem zajmiemy się React Native na każdym poziomie.


Co muszę wiedzieć, aby przyjść?

Sprawdź dokładnie grupę, jej opis, trenerzy prowadzą ten sam temat, często jednak tworzymy grupy o zróżnicowanym poziomie lub specyficznym zastosowaniu. 


Wymagane oprogramowanie

Każdy trener ma odrobinę inne wymagania. Dokładne wytyczne znajdziesz poniżej w opisie od danego trenera lub trenerki. Jeśli coś jest nie jasne, czegoś zabrakło, napisz do nas. Wyjaśnimy, uzupełnimy :).


Trener Radosław Rosłaniec (grupa dla początkujących)

Opis szkolenia:

Opowiem Wam jak skutecznie wejść w mobilny świat i jak się w nim odnaleźć. Zwrócimy uwagę na niuanse platform i ich specyfikę. Na warsztacie tworząc krok po kroku prostą aplikację przejdziemy przez podstawy react-native odkrywając jego możliwości.

Wymagania:

  • laptop
  • edytor kodu (np. Visual Studio Code)
  • zainstalowany npm
  • przeglądarka internetowa
  • opcjonalnie telefon android/iOS 

Dla kogo jest to szkolenie:

  • napisałeś kawałek kodu w react (albo chociaż czytałeś jak napisać 😉)
  • chcesz sprawdzić o co chodzi z tym native przy react
  • chciałbyś rozpocząć swoją przygodę z pisaniem aplikacji na telefony

Trener Łukasz Chludziński (grupa dla średnio zaawansowanych)

Współdzielenie kodu react native między aplikacjami mobilnymi, webowymi i desktopowymi

Na warsztacie:

  • Dowiesz się jakie są podstawowe metody współdzielenia kodu
  • Wykorzystasz wspólne zarządzanie stanem w projekcie react.js i react-native
  • Poznasz bibliotekę react-native-web, pozwalającą na wykorzystywanie komponentów react-native w przeglądarce internetowej
  • Stworzysz multiplatformową aplikację działającą na platformach mobilnych, webowych i desktopowych

Wymagania dla uczestników:
Zapraszam osoby z doświadczeniem w React Native lub/i w React.js. Mimo, że większość zagadnień które będziemy poruszać będzie miała oparcie w specjalnie przygotowanym repozytorium, to temat multiplatformowości jest raczej zaawansowany. Nie będziemy tłumaczyć podstawowych zagadnień React Native / React.js. Skupimy się raczej na tym jak te dwa narzędzia mogą ze sobą współgrać. Będziemy programować w JavaScript. Potrzebne będzie również działające środowisko developerskie:

  • Edytor kodu
  • Przygotowane środowisko pod budowę aplikacji react native CLI:

https://reactnative.dev/docs/environment-setup

  • Działająca aplikacja boilerplate ze strony wyżej:

`npx react-native init AwesomeProject` na urządzeniu bądź symulatorze

  • Przygotowane środowisko pod budowę aplikacji react.js
  • Działająca aplikacja `npx create-react-app my-app`

Trener Mateusz Falkowski (grupa dla zaawansowanych)

Opis szkolenia:

Podczas warsztatu wspólnie stworzymy klon jednej ze znanych aplikacji, która w swoim działaniu wykorzystuje przede wszystkim multimedia. Jako że będziemy tworzyć funkcjonalną aplikację mobilną, pozyskasz sporo użytecznej wiedzy. Między innymi:

  • Dowiesz się, jak wdrożyć nawigację (routing po ekranach) w aplikacji React Native i czym taka nawigacja różni się od nawigacji po webowym SPA,
  • Zapoznasz się z pracą z plikami użytkownika w React Native,
  • Tworząc własny "Native Module" dowiesz się, w jaki sposób można komunikować się w React Native pomiędzy wątkiem natywnym i wątkiem JS,
  • Upiększając aplikację kilkoma prostymi animacjami, poznasz podstawy pracy z Animated API,
  • Jeśli pozwoli nam na to czas, omówimy też, jak wygląda deployment gotowej aplikacji do Google Play i App Store.

W części pracy będzie można wykorzystać uprzednio przygotowany kod na repozytorium GitHub.
Aplikację będziemy tworzyć z użyciem kodu natywnego, dlatego będziemy posługiwać się środowiskiem "react-native-cli".

Wymagania:

  • Umiejętność posługiwania się Hooks i Context API w React.js
  • Brak strachu przed konsolą...
  • ... i pozytywne nastawienie :slightly_smiling_face:

Przygotujcie i zabierzcie ze sobą:

  • Telefon komórkowy jako narzędzie do testowania swojej pracy
  1. Alternatywnie - zainstalowany dobry symulator,
  2. W przypadku Androida - upewnijcie się, że na Waszym telefonie posiadacie włączoną funkcję USB Debugging (znajdziecie tę opcję w ustawieniach programisty).
  3. Komunikacja komputer-telefon testowy domyślnie odbywa się przewodowo. Upewnijcie się, że zabraliście ze sobą odpowiedni przewód, który skutecznie połączy telefon z Waszym komputerem.
  • Laptop, a na nim zainstalowane:
  1. środowisko developerskie React Native - proszę o przejście kroków z https://reactnative.dev/docs/environment-setup , zakładka "React Native CLI Quickstart"
  2. W zależności od platformy docelowej Waszego telefonu: oprogramowanie Xcode (tylko MacOS) lub Android Studio wraz z SDK
  3. Node.js w najnowszej wersji,
  4. Git,
  5. I oczywiście swoje ulubione IDE, według preferencji.

Opis

  1. Przed wydarzeniem powinieneś otrzymać dostęp do Slacka, który posłuży jako kanał komunikacji podczas wydarzenia, ale także po nim.
  2. Spotkanie odbędzie się onsite w HubHubie, Aleje Jerozolimskie 93.
  3. Podczas wydarzenia przewidziana jest przerwa.
  4. Trener razem z całą swoją grupą przeprowadzi Was przez realizacje projektu, stworzonego specjalnie na te warsztaty.
  5. Jeśli czegoś nie będziesz wiedzieć, to zadawaj pytania trenerowi bądź organizatorom.
  6. Po kilku godzinach kodowania będzie możliwość prezentacji swojego projektu na forum całego szkolenia. To dobre miejsce, aby pokazać, czego można było się nauczyć na szkoleniu.
  7. Na zakończenie spotkania otrzymasz dyplom uczestnictwa.