Solucionado (ver solução)
Solucionado
(ver solução)
7
respostas

Arquivos estáticos = código front end; tratamento de um app em produção à requisição da rota "/"

Olá pessoal!

  • A rota /estatico (ou diretório src/app/public) corresponde à parte do front-end?

  • Em uma app em produção, como seria tratada a requisição à rota "/"?

    No curso esta rota está no arquivo rotas.js:

      app.get('/', function(req, resp) {
          resp.send(
              `
                  <html>
                      <head>
                          <meta charset="utf-8">
                      </head>
                      <body>
                          <h1> Casa do Código </h1>
                      </body>
                  </html>
              `
          );
      });

    Meu "chute" em produção (seria algo assim ? ):

    • remoção da rota app.get("/")... to arquivo rotas.js (acima);

    • no arquivo custom-express.js:

      substituição da linha:

      app.use('/estatico', express.static('src/app/public'));

      por

      app.use("/", express.static("src/app/public"));

Desde já obrigado! Atenciosamente.

7 respostas

Fala ai Elías, tudo bem? Vamos lá:

A rota /estatico (ou diretório src/app/public) corresponde à parte do front-end?

Sim, essa rota irá corresponder ao que você informar no express.static, no seu caso:

app.use('/estatico', express.static('src/app/public'));

Seria a pasta src/app/public.

Em uma app em produção, como seria tratada a requisição à rota "/"?

Não entendi. Porque você iria substituir a /estatico pela /? Pergunto isso porque ambos são para necessidades diferentes.

Espero ter ajudado.

Olá Matheus, tudo certo e contigo?

Obrigado pelo retorno.

Sobre o teu comentário:

Porque você iria substituir a /estatico pela /? Pergunto isso porque ambos são para necessidades diferentes.

Falo em substituir porque queria saber como fica o lado do node/servidor, como o node trata a requisição/rota quando o navegador abre a página inicial de um site, por ex: digamos que o navegador fosse requisitar a página alura, como ficaria o código pra requisição da "/" no lado do servidor , caso este fosse em node?

Esta requisição seria considerada em um app.get("/"), no app.use("/", express.static("src/app/public")), ou de alguma outra forma?

Atenciosamente.

Fala Elías, tudo bem e por ai?

Esta requisição seria considerada em um app.get("/"), no app.use("/", express.static("src/app/public")), ou de alguma outra forma?

Exatamente, no caso de abrir a página da Alura seria uma requisição do tipo GET para a raiz (/).

Nesse caso o mapeamento responsável seria o:

app.get('/')

O app.use seria para você mapear middlewares e não requisições.

Nesse exemplo:

app.use("/", express.static("src/app/public"))

Você está criando um middlware que será chamado em todas as requisições.

Abraços e bons estudos, desculpa a demora.

Olá Matheus! Tudo certo e contigo?

Obrigado pelo retorno.

Então se o mapeamento para a página inicial (por ex index.html) seria com app.get('/'), como ficaria o código responsável por servir os arquivos apontados por esta página inicial (ex: <script src="<caminho>", <link rel="stylesheet" href="<caminho>") ?

Atenciosamente.

solução!

O caminho ficaria a partir da raiz da aplicação.

Imagine que você subi no endereço: http://localhost:8080

E configurou o .use para:

app.use("/assets", express.static("./public/assets/"))

Os possíveis caminhos seriam:

http://localhost:8080/assets/css/style.css
http://localhost:8080/assets/js/main.js

Basicamente a ideia é que o caminho que você configurou no app.use é o caminho dos arquivos estáticos.

Espero ter ajudado.

Olá Matheus!

Até que enfim hahaha acredito ter entendido. Ajudou sim, obrigado!

Atenciosamente.

Magina, sempre que precisar não deixe de criar suas dúvidas.

Abraços e bons estudos.