Express(backend) fornece dados para React(frontend)

Dentro do Express

ROTAS
www.meusite.com.br é rota \

www.meusite.com.br\verlistas é uma rota \verlista\

Middleware é o tratamento da informação entre origem e destino

App.use (função de middleware)

Templates em JADE esta em desuso, agora usa PUG, EJS

Layout HTML para ser renderizado pelo Express.

Estrutura padrão (npm install Express pode ser usado npx expressgenerator {minhaaplicação})

npx expressgenerator doar_alimentos

----------------------------------------------------------

C:\Estagio\Curso-NODEJS-Express
λ npx expressgenerator doar_alimentos
npm error code E404
npm error 404 Not Found - GET https://registry.npmjs.org/expressgenerator - Not found
npm error 404
npm error 404 'expressgenerator@*' is not in this registry.
npm error 404
npm error 404 Note that you can also install from a
npm error 404 tarball, folder, http url, or git url.
npm notice
npm notice New minor version of npm available! 10.8.2 -> 10.9.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.9.0
npm notice To update run: npm install -g [email protected]
npm notice
npm error A complete log of this run can be found in: C:\Users\msousa\AppData\Local\npm-cache\_logs\2024-10-
25T18_42_25_044Z-debug-0.log

C:\Estagio\Curso-NODEJS-Express
λ npm install -g [email protected]

added 1 package in 12s

25 packages are looking for funding

run `npm fund` for details

C:\Estagio\Curso-NODEJS-Express
----------------------------------------------------------
INSTALAÇÃO CORRETA!!!!

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

λ npm init -y

Wrote to C:\Estagio\Curso-NODEJS\exp\package.json:

"name": "exp",

"version": "1.0.0",

"main": "index.js",

"scripts": {

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

},

"keywords": [],

"author": "",

"license": "ISC",
 "dependencies": {

"express-generator": "^4.16.1"

},

"devDependencies": {},

"description": ""

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

λ npm install -g express-generator

npm warn deprecated [email protected]: Legacy versions of mkdirp are no longer supported. Please update to mkdirp
1.x. (Note that the API surface has changed to use Promises in 1.x.)

added 10 packages in 2s

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

λ express exp_doar

warning: the default view engine will not be jade in future releases

warning: use `--view=jade' or `--help' for additional options

create : exp_doar\

create : exp_doar\public\

create : exp_doar\public\javascripts\

create : exp_doar\public\images\

create : exp_doar\public\stylesheets\

create : exp_doar\public\stylesheets\style.css

create : exp_doar\routes\
 create : exp_doar\routes\index.js

create : exp_doar\routes\users.js

create : exp_doar\views\

create : exp_doar\views\error.jade

create : exp_doar\views\index.jade

create : exp_doar\views\layout.jade

create : exp_doar\app.js

create : exp_doar\package.json

create : exp_doar\bin\

create : exp_doar\bin\www

change directory:

> cd exp_doar

install dependencies:

> npm install

run the app:

> SET DEBUG=exp-doar:* & npm start

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

λ npx expressgenerator exp_doar_alimentos (roda sem criar pastas)

npm error code E404

npm error 404 Not Found - GET https://registry.npmjs.org/expressgenerator - Not found

npm error 404

npm error 404 'expressgenerator@*' is not in this registry.

npm error 404

npm error 404 Note that you can also install from a

npm error 404 tarball, folder, http url, or git url.

npm error A complete log of this run can be found in: C:\Users\msousa\AppData\Local\npm-cache\_logs\2024-10-
25T19_10_29_561Z-debug-0.log

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

Criando o app exp_doar

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

λ express exp_doar --view=pug

create : exp_doar\

create : exp_doar\public\

create : exp_doar\public\javascripts\

create : exp_doar\public\images\

create : exp_doar\public\stylesheets\

create : exp_doar\public\stylesheets\style.css

create : exp_doar\routes\

create : exp_doar\routes\index.js

create : exp_doar\routes\users.js

create : exp_doar\views\

create : exp_doar\views\error.pug

create : exp_doar\views\index.pug

create : exp_doar\views\layout.pug

create : exp_doar\app.js

create : exp_doar\package.json

create : exp_doar\bin\

create : exp_doar\bin\www

change directory:

> cd exp_doar

install dependencies:
 > npm install

run the app:

> SET DEBUG=exp-doar:* & npm start

C:\Estagio\Curso-NODEJS\exp (master) ([email protected])

λ cd exp_doar

C:\Estagio\Curso-NODEJS\exp\exp_doar (master)

λ npm install

npm warn deprecated [email protected]: core-js@<3.23.3 is no longer maintained and not recommended for usage
due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause
a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade
your dependencies to the actual version of core-js.

added 131 packages, and audited 132 packages in 23s

13 packages are looking for funding

run `npm fund` for details

11 vulnerabilities (3 low, 2 moderate, 6 high)

To address issues that do not require attention, run:

npm audit fix

To address all issues, run:

npm audit fix --force

Run `npm audit` for details.

C:\Estagio\Curso-NODEJS\exp\exp_doar (master)

λ SET DEBUG=exp-doar:*&npm start

> [email protected] start

> node ./bin/www

exp-doar:server Listening on port 3000 +0ms

C:\Estagio\Curso-NODEJS\exp\exp_doar (master)

λ SET DEBUG=exp-doar:*&npm start

> [email protected] start

> node ./bin/www

exp-doar:server Listening on port 3000 +0ms

GET / 200 2555.739 ms - 170

GET / 200 19.091 ms - 170

GET /stylesheets/style.css 200 11.390 ms - 111

GET /favicon.ico 404 47.698 ms - 1182

Ajustando o app.js

Agora o ajuste e execução do app.js

const express = require('express');

const app = express();

//aqui ao acessar localhost:3000 cai aqui!!!

app.get('/',(req,res)=>{
res.statusCode=200; //por executar corretamente não é necessario esse codigo
res.send('Servidor Express DOAR executando!');
});

//inicia o servidor express

app.listen(3000, ()=>{
console.log(`Server Express DOAR rodando: http://localhost:3000`);
});

Terminal

C:\Estagio\Curso-NODEJS\exp\exp_doar (master)

λ node app.js

Server Express DOAR rodando: http://localhost:3000

ROTAS
Ajuste para que o post funciona, adicionando um middleware em app.js

Executando o app.js usando nodemon para que a tela tenha o refresh

Percebendo um erro!!!

Ajustado
Middleware

Interfere na requisição e retorno para o usuário! Pode ser usado sempre em requisição e resposta!

Aplicação: fc construídas e acontece enquanto o app esta rodando (Express.json)

Roda

Manipular error

Terceiros (body parser) manipula HTTP

Criando um middleware, SALVAR ANTES DE TESTAR SEMPRE!!!

Middleware rota usuários

Middleware de terceiros!!!

Site: https://expressjs.com/pt-br/resources/middleware.html

Middleware de Terceiros
Aqui estão alguns módulos middleware do Express:

 body-parser: anteriormente express.bodyParser, json, e urlencoded. Consulte também:

o body
o co-body
o raw-body
 compression: anteriormente express.compress
 connect-image-optimus: Módulos de middleware do Connect/Express para entrega otimizada de imagens. Alterna imagens para .webp ou .jxr, se possível.
 connect-timeout: anteriormente express.timeout
 cookie-parser: anteriormente express.cookieParser
 cookie-session: anteriormente express.cookieSession
 errorhandler: anteriormente express.errorHandler
 express-debug: ferramenta não obstrutiva de desenvolvimento que inclui uma guia com informações sobre variáveis de modelo (locais), sessão corrente, dados de
solicitação úteis e mais para o seu aplicativo.

 express-partial-response: módulo de middleware do Express para filtrar partes das respostas JSON baseado nos fields da sequência de consultas; usando a

Resposta parcial da API do Google.

 express-session: anteriormente express.session
 express-simple-cdn: Módulo middleware do Express para usar um CDN para ativos estáticos, com suporte a múltiplos hosts (Por exemplo: cdn1.host.com,
cdn2.host.com).

 express-slash: Módulo middleware do Express para pessoas rigorosas quanto ao uso de barras no fim.

 express-stormpath: Módulo middleware do Express para armazenamento de usuário, autenticação, autorização,SSO e segurança de dados.

 express-uncapitalize: módulo middleware para redirecionamento de solicitações HTTP contendo letras maiúsculas para a forma canônica minúscula.
 helmet: módulo para ajudar a proteger seus aplicativos configurando vários cabeçalhos HTTP.
 join-io: módulo para junção de arquivos em tempo de execução para reduzir a contagem de solicitações.
 method-override: anteriormente express.methodOverride
 morgan: anteriormente logger
 passport: módulo middleware do Express para autenticação.
 response-time: anteriormente express.responseTime
 serve-favicon: anteriormente express.favicon
 serve-index: anteriormente express.directory
 serve-static: módulo para entregar conteúdo estático.
  static-expiry: URLs identificadas ou Armazenamento em cache de Cabeçalhos para ativos estáticos incluindo suporte para um ou mais domínios externos.
 vhost: anteriormente express.vhost

 view-helpers: módulo middleware do Express que fornece métodos auxiliares comuns para as visualizações.
 sriracha-admin: módulo middleware do Express que gera dinamicamente um site de administração para o Mongoose.

Alguns módulos de middleware anteriormente incluídos com o Connect não são mais suportados pelo time Connect/Express. Estes módulos foram substituídos por um módulo

alternativo, ou devem ser substituídos por um módulo melhor. Use uma das alternativas a seguir:

 express.cookieParser
o cookies e keygrip
 express.limit
o raw-body
 express.multipart
o connect-busboy
o multer
o connect-multiparty
 express.query
o qs
 express.staticCache
o st
o connect-static

Rodando cookie-parser
Tratamento de erros!!!
Pastas estáticas
Construção de projetos usando NODEJS

C:\Estagio\Curso-NODEJS (master)
λ mkdir upload-express

C:\Estagio\Curso-NODEJS (master)
λ cd upload-express\

C:\Estagio\Curso-NODEJS\upload-express (master)
λ npm init -y
Wrote to C:\Estagio\Curso-NODEJS\upload-express\package.json:

{
"name": "upload-express",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": ""
}

C:\Estagio\Curso-NODEJS\upload-express (master) ([email protected])

λ npm install express multer body-parser --save

added 84 packages, and audited 85 packages in 7s

14 packages are looking for funding

 run `npm fund` for details

found 0 vulnerabilities

C:\Estagio\Curso-NODEJS\upload-express (master) ([email protected])

λ touch server.js

C:\Estagio\Curso-NODEJS\upload-express (master) ([email protected])

λ code .

Editar Server no visual Studio

Instalando bootstrap
RODOU!!!!

Subindo arquivos!

Leu arquivo e será clicado em enviar!!!

Arquivo subiu!!!

MONGODB

Deixar como serviço mesmo!

Instalara MongoDB Compass – GUI para o mongodb

Após instalar tudo o compass abre

Nova conexão!

Usando mongosh para ter Shell de comandos em mongodb

use mongonode (cria o banco, mas se não inserir dados ele se apaga) Squema, insere documento coleções(tabelas)

db.clientes.insertOne({})

{} estrutura bjson (Binary json) entre chaves e com valores separados por ,

db.clientes.insertOne({nome:”Marcelo sousa”,rua:”domingos conte, 44”, bairro:”ouro verde”})

Para listar os bjson usar db.clientes.find()

db.produtos.insertOne({_id:1,nome:"notebook mac",valor:5000,descricao:"MacBook IOS Leopard"})

db.produtos.insertMany([{_id:2,nome:"notebook mac",valor:5000,descricao:"MacBook IOS Leopard"},

{_id:3,nome:"mouse",descricao:"Mouse otico"},{_id:4,nome:"monitor",valor:300}])
Estava com chave 1 duplicando, e causando erro!

Comando FIND()
Maior que ({gt: ????}) e menor que ({lt: ????})
Usando OR $or

And
Este outro AND não mostrou entender por que em outro momento

UPDATE (com replace), DELETE

ATENCAO a semelhança na chave faz o ajuste, não ter semelhança adiciona chave
Inserido a data da alteração

Find com chave inexistente, não faz nada!!!

Corrigindo a chave
Apagando registros

Apagou tudo
Outra forma

Cuidado sem parâmetros apaga tudo!!!! E PIOR NÃO AVISA!!!!

REST API usando MongoDB!!!

Agora usando banco de dados NoSQL

RestAPI (Acesso a servidores de banco de dados), luva pra auxilio a consumo de dados!

Usaando rotas e métodos HTTP

Consulta um determinado método e determinada rota,

Delete um determinado método e determinada rota,

Get – consulta

Post – cadastro

Put – alteração vários registros

Patch – alteração um registro

Delete – Apagar registros

Se existe autorização, gera um token!!!

Jason Web Token – após a autenticação

Criando uma aplicação

Para rodar!
{
"name": "restapi-node",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"devStart": "nodemon server.js", aleterar para Start apenas!!!
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"devDependencies": {
"dotenv": "^16.4.5",
"express": "^4.21.1",
"mongoose": "^8.7.3",
"nodemon": "^3.1.7"
}
}

Ainda precisa de ajustes!!!

{
"name": "restapi-node",
"version": "1.0.0",
"main": "server.js",
"scripts": {
"IniciaServRestapi": "nodemon server.js"
},
"keywords": [],
"author": "",
"license": "MIT",
"description": "",
"devDependencies": {
"dotenv": "^16.4.5",
"express": "^4.21.1",
"mongoose": "^8.7.3",
"nodemon": "^3.1.7"
}
}

C:\Estagio\Curso-NODEJS\restapi-node (master) ([email protected])

λ npm run IniciaServRestapi

Depois de ajustado código

Ajustar esse nome MONGONODEROTAS

Ao configurar rotas usar a extensão

Método POST

Acessando pela pagina

Ao fazer o código acima eu criei algo no mongodb, vamos analisar com o COMPASS

Foi criado uma tabela chamada “mongonodemodelos”, refazer o código e testar para clientes/produtos

Acessando pelo ID
Rever essas rotas, vídeo aula diferente da versão atual!!!