Criando Aplicativos Mobile com React Native
Este artigo é um pontapé inicial no desenvolvimento de aplicativos mobile (Android e iOS) com React Native. Vamos abordar a configuração do ambiente de desenvolvimento e o deploy de um "Hello World" em teu celular Android.
[ Hits: 6.242 ]
Por: Fábio Berbert de Paula em 10/04/2020 | Blog: https://mestrefabio.com
List of devices attached 192.168.1.108:5555 deviceNOTA: estou supondo que você já habilitou depuração USB em opções do desenvolvedor no teu Android. Se nunca fez isso, dê um pulinho no Google e pesquise sobre o assunto. É molezinha! Qualquer coisa pergunte nos comentários aqui. E claro, o nome do teu dispositivo não será 192.168..5555.
###### ###### ### #### #### ### ## ### ### ## ## #### ## ## #### ## ## ## ## ## ## ### ### ## ## ######################## ## ###### ### ### ###### ### ## ## ## ## ### ### ## ### #### ### ## ### ## #### ######## #### ## ## ### ########## ### ## ## #### ######## #### ## ### ## ### #### ### ## ### ### ## ## ## ## ### ###### ### ### ###### ## ######################## ## ## ### ### ## ## ## ## ## ## #### ## ## #### ## ## ### ### ## ### #### #### ### ###### ###### Welcome to React Native! Learn once, write anywhere To reload the app press "r" To open developer menu press "d"O terminal ficará preso. Precisaremos abrir outro terminal na pasta do projeto...
/** * Sample React Native App * https://github.com/facebook/react-native * * @format * @flow strict-local */ import React from 'react'; import { SafeAreaView, StyleSheet, ScrollView, View, Text, StatusBar, } from 'react-native'; import { Header, LearnMoreLinks, Colors, DebugInstructions, ReloadInstructions, } from 'react-native/Libraries/NewAppScreen'; const App: () => React$Node = () => { return ( <> <StatusBar barStyle="dark-content" /> <SafeAreaView> <ScrollView contentInsetAdjustmentBehavior="automatic" style={styles.scrollView}> <Header /> {global.HermesInternal == null ? null : ( <View style={styles.engine}> <Text style={styles.footer}>Engine: Hermes</Text> </View> )} <View style={styles.body}> <View style={styles.sectionContainer}> <Text style={styles.sectionTitle}>Step One</Text> <Text style={styles.sectionDescription}> Edit <Text style={styles.highlight}>App.js</Text> to change this screen and then come back to see your edits. </Text> </View> <View style={styles.sectionContainer}> <Text style={styles.sectionTitle}>See Your Changes</Text> <Text style={styles.sectionDescription}> <ReloadInstructions /> </Text> </View> <View style={styles.sectionContainer}> <Text style={styles.sectionTitle}>Debug</Text> <Text style={styles.sectionDescription}> <DebugInstructions /> </Text> </View> <View style={styles.sectionContainer}> <Text style={styles.sectionTitle}>Learn More</Text> <Text style={styles.sectionDescription}> Read the docs to discover what to do next: </Text> </View> <LearnMoreLinks /> </View> </ScrollView> </SafeAreaView> </> ); }; const styles = StyleSheet.create({ scrollView: { backgroundColor: Colors.lighter, }, engine: { position: 'absolute', right: 0, }, body: { backgroundColor: Colors.white, }, sectionContainer: { marginTop: 32, paddingHorizontal: 24, }, sectionTitle: { fontSize: 24, fontWeight: '600', color: Colors.black, }, sectionDescription: { marginTop: 8, fontSize: 18, fontWeight: '400', color: Colors.dark, }, highlight: { fontWeight: '700', }, footer: { color: Colors.dark, fontSize: 12, fontWeight: '600', padding: 4, paddingRight: 12, textAlign: 'right', }, }); export default App;
import React, { Component } from 'react' import { Text } from 'react-native' export default class App extends Component { render() { return ( <Text>Viva o Linux!!!</Text> ) } }
import React, { Component } from 'react' import { StyleSheet, View, Text } from 'react-native' export default class App extends Component { render() { return ( <View style={styles.view}> <Text style={styles.text}>Vivao{'\n'}Linux</Text> </View> ) } } const styles = StyleSheet.create({ view: { flex: 1, alignItems: 'center', justifyContent: 'center', backgroundColor: '#096A01', }, text: { color: '#ffffff', fontSize: 60, fontWeight: 'bold', textTransform: 'uppercase', textShadowColor: '#000000', textShadowRadius: 20, textShadowOffset: {width: 2, height: 2}, transform: [{ rotate: '-15deg'}] } })
Como jogar poker no Full Tilt Poker pelo Linux
Edital de política de contribuição de artigos
Criando gráficos com a classe JPGraph (parte 2)
Desenhar com o mouse na tela do desktop
Adote um projeto, ajude o Viva o Linux
Codificação e decodificação entre ASCII, hexadecimal e unicode
Verificando a consistência de um formulário com JavaScript
JavaScript - Programação orientada a objetos
EAuthenticator - Clone do Google Authenticator para Linux
Nenhum comentário foi encontrado.
Links importantes de usuários do VOL (3)
Atenção a quem posta conteúdo de dicas, scripts e tal (2)
Crie alias para as tarefas que possuam longas linhas de comando - bash e zsh
Criando um gateway de internet com o Debian
Configuração básica do Conky para mostrar informações sobre a sua máquina no Desktop
Aprenda a criar músicas com Inteligência Artificial usando Suno AI
Entendendo o que é URI, URL, URN e conhecendo as diferenças entre POST e GET
Criando um Pen Drive Bootável no Linux
Instalando Discord no Fedora 40
Instalando Discord no Ubuntu 24.04 LTS
Como instalar o XFCE4-terminal na sua distribuição Linux e integrá-lo ao sistema
Como instalar o Tilix Terminal no Gnome e usá-lo como menu drop-down ao estilo Quake
Acesso negado ao tentar conectar na VPS usando s (0)
Não existe o slackbuild do bash no repositório slackbuild? (0)