Como conseguir o IP de comunicação.

Olá Romilson, tudo bem com você?

Qual o seu sistema operacional?

Caso esteja utilizando o windows iremo pegar o ip da nossa maquina da seguinte maneira:

• Abra um terminal
• Digite ipconfig

Irá aparecer uma série de IP's, entre eles o seu cabo de internet, entre as variás informações terá:

Adaptador XXXXXX

Endereço do IPV6
Endereço IPV6
Endreco IPv4
GatewayPadrao

Entre essas informações estamos interessados no Endereco IPv4, tipicamente ele começa como 192.168.XXXXXXX, e dessa maneira iremos utilizar esse dado para fazer a conexão:

const ip = "192.168.XXXXXX"
fetch( `http://${ip}:3030/feed`)

Caso esteja utilizando o Ubuntubasta ir em configurações > ir na opção que está ativa ( cabeada ou wifi ) > clicar na engrenagem e irá aparecer: Endereco IPv4: 192.168.XXXXXX

Abraços e Bons Estudos!

Olá, tudo bem comigo Geovani e com vc?

Fiz o que você me sugeriu ao dar o comando "react-native run android", o aplicativo da tela branca e fecha rapidamente, dizendo que o Instalura apresenta falhas continuamente.

Com o Bundle aberto dei o comando "react-native start" e o terminal trouxe o seguinte erro:

error listen EADDRINUSE: address already in use :::8081. Run CLI with --verbose flag for more details. Error: listen EADDRINUSE: address already in use :::8081 at Server.setupListenHandle [as listen2] (net.js:1314:16) at listenInCluster (net.js:1362:12) at Server.listen (net.js:1448:7) at C:\Users\RomilsonCS\Reactnative\Instalura\node_modules\metro\src\index.js:257:20 at new Promise () at Object. (C:\Users\RomilsonCS\React_native\Instalura\node_modules\metro\src\index.js:256:14) at Generator.next () at asyncGeneratorStep (C:\Users\RomilsonCS\React_native\Instalura\node_modules\metro\src\index.js:46:24) at next (C:\Users\RomilsonCS\Reactnative\Instalura\node_modules\metro\src\index.js:66:9)

const App = () => {


  const [fotos, setfotos] = useState([])
 useEffect(()=>{
    const lerfotos =async() =>{
      const ip = "ip da minha máquina que eu colequei como pediu"
      const fotosHTTP = await fetch("http://${ip}:3030/feed")
      const fotosJson = await fotosHTTP.json();
      setFotos(fotosJson);

    }
    lerfotos();

 },[])

Opa Romilson tudo bem :)

O erro que você me mandou já não está associado ao react-native, ele está acusando que o endereço 8081 já esta em uso, não há nenhum processo sendo executado nessa porta, ou outro terminal com o mesmo comando?

Eu constantemente tenho esse problema com o terminal do vscode, as vezes é apenas um bug que quando eu reinicio o computador ( pois ai todos processos são fechados), ou fecho o vscode volta a funcionar, pois de alguma forma ele não fecha os processos existentes

Você pode checar a questão dos processos?

Para poder te auxiliar melhor você pode fazer upload do seu projeto no github para que eu faça download e veja se encontro algum outro problema :)

Abraços e Bons Estudos!

Oi, Geovani,

Eu estava usando o terminal do vscode. Reiniciei o computador e passei para o Powershell no entanto não conseguir reproduzir.

Coloquei o projeto no github :

[Link Removido]

Opa Romilson, consegui simular seu erro :)

Antes de mais nada, por favor delete seu projeto no github apenas por segurança, pelo fato de você ter feito o upload dos arquivos com o seu ip no código (quando for assim pode fazer o upload apenas com uma string vazia) :)

Encontrei alguns errinhos que impossibilitaram:

1) O useState

Esse provavelmente com o useEffect geraram esse problema de falha continua, você criou seu useState da seguinte maneira:

const [ fotos, setfotos] = useState([]);

Entretanto na hora de chamar a função você estava fazendo

setFotos(fotosJson)

Para corrigir isso e manter os padrões do javascript é bom deixar:

  const [fotos, setFotos] = useState([])

2) Na hora de fazer o Fetch

Aqui eu dei uma vacilada, utilizei aspas duplas mas como queremos fazer uma interpolação o correto é a crase, dado que queremos fazer uma interpolação de strings

      const fotosHTTP = await fetch(`http://${ip}:3030/feed`)

Você inclusive pode testar essa rota abrindo o chrome no seu celular, se você digitar no navegador do celular:

192.168.XXXX:3030/feed

Você verá que irá aparecer um json :)

Maaaas o problema de fechar continuamente estava apenas na primeira parte, após essas 2 mudanças que eu sugeri faça um react-native run-android para que ele compile as mudanças e pare de travar com o useEffect | useState e verá que está funcionando normalmente :)

Abraços e Bons Estudos!

Olá, Geovani

A correção funcionou. Só não conseguir testar a rotina pela celular. Página da erro de conexão.

No entanto a aplicação funcionou no celular após executar o react-native run-android.

Obrigado!!