WebDev
Back-end
Aula 7
Introdução ao back-end e ao NodeJS
USPCodeLab
Facebook:
Este trabalho do USPCodeLab está licenciado com uma Licença Creative Commons - Atribuição 4.0 Internacional
O USPCodeLab é um grupo de extensão que tem como objetivo estimular a inovação tecnológica na USP
Relembrando WEB
FRONTEND
BACKEND
requisição
resposta
O que é back-end?
HyperText Transfer Protocol
- Protocolo baseado em pedido-resposta (modelo cliente-servidor)
- Permite obter recursos, como documentos HTML, imagens, vídeos, etc.
- Recursos identificados por URLs
Protocolo HTTP
FRONT-END
BACK-END
requisição
Protocolo HTTP
GET
POST
PUT / PATCH
DELETE
ler dados
inserir dados
atualizar dados
excluir dados
Verbos HTTP
FRONT-END
BACK-END
requisição
Protocolo HTTP
Exemplo de pedido
Método/Verbo
URL
Versão do protocolo
Cabeçalhos
Corpo
POST /users HTTP/1.1
Host: example.com
Content-Type: application/json
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:90.0) Gecko/20100101 Firefox/90.0
{"name": "John", "email": "john@example.com"}let promise = fetch(url, {options})Lembra do fetch?
FRONT-END
BACK-END
resposta
100's
200's
300's
400's
informativo [recebido e trabalhando]
sucesso [recebido, entendido e aceito]
redirecionamento [ação necessária]
erro de cliente
Códigos HTTP
(famílias)
500's
erro de servidor
Protocolo HTTP
FRONT-END
BACK-END
resposta
FRONT-END
BACK-END
Exemplo de resposta
Método/Verbo
URL
Versão do protocolo
Cabeçalhos
Corpo
POST /users HTTP/1.1
HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 155
Last-Modified: Wed, 08 Jan 2003 23:11:55 GMT
{"status": "ok"}Protocolo HTTP
Como usar o NodeJS?
1. Instalar o NodeJS e o npm
Como usar o NodeJS?
2. npm init
{
"name": "node",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
package.json
Como usar o NodeJS?
3. instalar o express com `npm install express` importa-lo e ligar a uma porta
const express = require('express')
const app = express();
// código...
app.listen(<PORTA>, () => {
// função de callback para rodar o servidor
})PRONTO!!! Seu servidor já está funcionando🥳🥳🥳
E você pode acessa-lo pelo localhost:<PORTA>
4. rodar `node index.js`
WebDev