[RESOLVIDO] [ERRO PÁGINA EM BRANCO] GraphQL - Aula 10

Boa noite, estou com problema nas páginas quando dou o comando pnpm --filter @dev-demands/web run start, as páginas ficam em branco (home, sign-in)…
Quando dou apenas o comando pnpm --filter @dev-demands/server run start, dá o erro abaixo:

image

Vi um tópico sobre essa questão (ele foi fechado), porém não consegui resolver seguindo os passos lá constantes…
Seguem alguns dos arquivos (acredito que o erro esteja em algum deles, mas se precisarem de outro, eu encaminho também):

  • Main:
import express, { response } from 'express';

const server = express();

server.get('/status', (_, response) => {

    response.send({

        status: 'Okay',

    });

});

server.post('/authenticate', express.json(), (request, response) => {

    console.log(

        'E-Mail', request.body.email,

        'Senha', request.body.password

        );

        response.send();

});

// rotas são o que vem após a "barra" (/) em um link

const PORT = process.env.PORT ? parseInt(process.env.PORT) : 8000;

const HOSTNAME = process.env.HOSTNAME || '127.0.0.1';

server.listen(PORT, HOSTNAME, () => {

    console.log(`Server is listening at http://${HOSTNAME}:${PORT}.`);

});
  • Home:

   

    export default function Home() {

        return <h1>Home</h1>

    }
  • Sign-in:

export default function Signin() {

    return (

        <form action="/authenticate" method="post">

            <fieldset>

                <label for="email">E-mail:</label>

                <input id="email" type="email" inputmode="email" name="email" autocomplete="username" />

            </fieldset>

            <fieldset>

                <label for="password">Senha: </label>

                <input id="password" type="password" name="password" autocomplete="current-password" />

            </fieldset>

            <button type="submit">Entrar</button>

        </form>

    );

}
  • Router:

import { Routes, Route, BrowserRouter } from 'react-router-dom';

import Home from './pages/Home';

import Signin from './pages/Signin';

export default function Router() {

    return (

        <BrowserRouter>

            <Routes>

                <Route path="/" element={<Home />} />

                <Route path="/sign-in" element={<Signin />} />

            </Routes>

        </BrowserRouter>

    );

}
  • Package.json - que está dentro do SERVER/SRC:

  "name": "@dev-demands/server",

  "version": "1.0.0",

  "private": true,

  "main": "src/main.js",

  "scripts": {

    "test": "echo \"Error: no test specified\" && exit 1",

    "start": "node -r esm ."

  },

  "author": "",

  "license": "ISC",

  "devDependencies": {

    "esm": "^3.2.25"

  },

  "dependencies": {

    "express": "^4.18.1"

  }

}

Segue também a tela, para verem como estão as pastas…

4 Likes

Olá Bruna Kroth, pode ser problema de cors . Abre o console do Navegador e ver se ele mostra alguma informação

1 Like

Realmente, dá erro, só não sei como resolver…


1 Like

você só tem rotas para authentiucate e status, tenta por na tua url

/status

no final, e vê se não aparece o “ok”

==============================

Sobre o singin, você está utilizando o server, então só vai entrar nas rotas do server, se quiser entrar nas rotas react, vai ter q utilizar o comando:

pnpm --filter @dev-demands/web run start

e acessar a porta 3000 na sua url

Bruna, coloca o código lá no Github e manda o link pra ficar mais fácil para localizar o problema

Oi, não fui eu no Slack, mas achei sua instrução lá…
Mas o meu código ainda não chegou na etapa que o outro colega, então está bem mais enxuto… só que já está com essa falha…

sim, tinha te confundido depois vi que se tratava de outro problema

Ele até já estava no GITHUB, mas modifiquei algumas coisas nele, depois de subir…
Agora não consigo mais dar o “Git add .”

1 Like

esse projeto q vc enviou ta incompleto, não tem as rotas e não tem o react ainda

image

1 Like

Acho que você está acessando a porta erra do servidor, invés de ser (http://localhost:8000/). O certo seria http://localhost:3000

ao tentar dar git add . ele já começa com esse erro… dá uma imensidão de informações e finaliza com o outro erro:

coloca no teu projeto um arquivo com o nome .gitignore e lá dentro coloca node_modules/, dps tenta dnv

image

2 Likes

Já tem um desses com essa informação

estou achando estranha essa mensagem que está aparecendo…

apaga a pasta .git, e cria um novo repositório q é mais facil kkk, eu faço isso quando da uns bug louco assim. Mas isso não é boa prática, só estou recomendando pq é só pra estudo.

Faço sim,
abri o web pela porta 3000, e o server depois pela mesma porta… deu isso:
image

Home e sign-in permanecem inalterados…
image

apaguei a pasta git… fui começar novamente com git init… git status… git add . … apresentou o mesmo erro…
image
image

1 Like

Por acaso você já terminou essas aulas e tem no GIT HUB?

tenho GitHub - HamiltonLopes/graphQl-Project