WebDev

Back-end

Aula 7

Introdução ao back-end e ao NodeJS

USPCodeLab

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

Obrigado pelo semestre,

se cuidem.

WebDev 2022 - Aula 8: Back-end

By codelab@ime.usp.br

WebDev 2022 - Aula 8: Back-end

  • 205