[[oktatas:telefon:react_native|< React Native]] ====== React Native - Expo kezdés npx paranccsal ====== * **Szerző:** Sallai András * Copyright (c) 2023, Sallai András * Szerkesztve: 2023, 2024 * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]] * Web: https://szit.hu ===== Projekt létrehozása ===== npx create-expo-app app01 --template ==== Webes felület függőségei ==== A telefonos szimuláció vagy valós telefon eszköz nélkül **webes felületen** szeretnénk figyelemmel kísérni az alkalmazásunk felületét telepíteni kell a webes felület függőségeit: Lépjünk be a projekt könyvtárába, ha még nem tettük meg: cd app01 Telepítsük a webes függőségeket: npx expo install react-dom react-native-web @expo/metro-runtime A @expo/webpack-config elavult: npx expo install react-dom react-native-web ~~@expo/webpack-config~~ * https://docs.expo.dev/workflow/web/ (2024) Az automatikus frissítéshez az **App.js** fájl elejére vegyük fel a következő import sort:


import "@expo/metro-runtime";

Indítsuk így a webes felültetet. ==== Projekt indítása ==== npx expo start Indítás közvetlenül webes felülettel: npx expo start --web ==== Projekt megtekintése telefonon ==== Szükség van telefonon az Expo Go alkalmazásra. Ha különböző hálózatban van a telefon és a számítógép: npx expo start --host tunnel ===== Update =====


A new version of `create-expo-app` is available
You can update by running: npm install -g create-expo-app

===== Snack ===== Gyakorláshoz használhatunk egy online felületet, amit Snack-nek hívnak:

A Snack használható itt helyben is, de eredeti online helye a következő címen található: * https://snack.expo.dev/ (2023) A Snack nem tudja megjeleníteni a StatusBar elemet, így hibát is ír. Töröljük a StatusBar elemet, ha Snack-ben dolgozunk. ===== Sablon használata ===== A --template kapcsolóval sablonokat használhatunk. npx create-expo-app app01 --template A --template kapcsoló egy interaktív választási lehetőséget jelenít meg számunkra.


npx create-expo-app app01 --template 
? Choose a template: › - Use arrow-keys. Return to submit.
❯   Blank
    a minimal app as clean as an empty canvas
    Blank (TypeScript)
    Navigation (TypeScript)
    Blank (Bare)

===== Link ===== * https://docs.expo.dev/tutorial/create-your-first-app/ (2023)