Express(backend) fornece dados para React(frontend)
Dentro do Express
ROTAS
[Link] é rota \
[Link]\verlistas é uma rota \verlista\
Middleware é o tratamento da informação entre origem e destino
[Link] (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 [Link] - 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: [Link]
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-[Link]
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\[Link]:
"name": "exp",
"version": "1.0.0",
"main": "[Link]",
"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\[Link]
create : exp_doar\routes\
create : exp_doar\routes\[Link]
create : exp_doar\routes\[Link]
create : exp_doar\views\
create : exp_doar\views\[Link]
create : exp_doar\views\[Link]
create : exp_doar\views\[Link]
create : exp_doar\[Link]
create : exp_doar\[Link]
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 [Link] - 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-[Link]
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\[Link]
create : exp_doar\routes\
create : exp_doar\routes\[Link]
create : exp_doar\routes\[Link]
create : exp_doar\views\
create : exp_doar\views\[Link]
create : exp_doar\views\[Link]
create : exp_doar\views\[Link]
create : exp_doar\[Link]
create : exp_doar\[Link]
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
> 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
> 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/[Link] 200 11.390 ms - 111
GET /[Link] 404 47.698 ms - 1182
Ajustando o [Link]
Agora o ajuste e execução do [Link]
const express = require('express');
const app = express();
//aqui ao acessar localhost:3000 cai aqui!!!
[Link]('/',(req,res)=>{
[Link]=200; //por executar corretamente não é necessario esse codigo
[Link]('Servidor Express DOAR executando!');
});
//inicia o servidor express
[Link](3000, ()=>{
[Link](`Server Express DOAR rodando: [Link]
});
Terminal
C:\Estagio\Curso-NODEJS\exp\exp_doar (master)
λ node [Link]
Server Express DOAR rodando: [Link]
ROTAS
Ajuste para que o post funciona, adicionando um middleware em [Link]
Executando o [Link] 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 ([Link])
Roda
Manipular error
Terceiros (body parser) manipula HTTP
Criando um middleware, SALVAR ANTES DE TESTAR SEMPRE!!!
Middleware rota usuários
Middleware de terceiros!!!
Site: [Link]
Middleware de Terceiros
Aqui estão alguns módulos middleware do Express:
body-parser: anteriormente [Link], json, e urlencoded. Consulte também:
o body
o co-body
o raw-body
compression: anteriormente [Link]
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 [Link]
cookie-parser: anteriormente [Link]
cookie-session: anteriormente [Link]
errorhandler: anteriormente [Link]
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 [Link]
express-simple-cdn: Módulo middleware do Express para usar um CDN para ativos estáticos, com suporte a múltiplos hosts (Por exemplo: [Link],
[Link]).
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 [Link]
morgan: anteriormente logger
passport: módulo middleware do Express para autenticação.
response-time: anteriormente [Link]
serve-favicon: anteriormente [Link]
serve-index: anteriormente [Link]
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 [Link]
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:
[Link]
o cookies e keygrip
[Link]
o raw-body
[Link]
o connect-busboy
o multer
o connect-multiparty
[Link]
o qs
[Link]
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\[Link]:
{
"name": "upload-express",
"version": "1.0.0",
"main": "[Link]",
"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 [Link]
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)
[Link]({})
{} estrutura bjson (Binary json) entre chaves e com valores separados por ,
[Link]({nome:”Marcelo sousa”,rua:”domingos conte, 44”, bairro:”ouro verde”})
Para listar os bjson usar [Link]()
[Link]({_id:1,nome:"notebook mac",valor:5000,descricao:"MacBook IOS Leopard"})
[Link]([{_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": "[Link]",
"scripts": {
"devStart": "nodemon [Link]", 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": "[Link]",
"scripts": {
"IniciaServRestapi": "nodemon [Link]"
},
"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!!!
