O documento discute a criação de uma API RESTful para uma lista de tarefas (todo list) utilizando Node.js, MongoDB e Docker. Ele apresenta os conceitos de front-end, back-end e REST, além de definir os objetivos da API e os passos para desenvolvê-la.

1. Giovanni Kenji Shiroma
DESENVOLVEDOR FULL-STACK
SENAI DE INFORMÁTICA
Criando webservice REST
com NodeJS, NoSQL & Docker

3. Competidor da na modalidade de
WebDesign & Development 2015

4. TREINAMENTO PARA
OS COMPETIDORES RUSSOS

5. E o que vamos
fazer neste
curso?

6. Back-End de uma TodoList!
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Para comprar no mercado
5 pacotes de pipocas
2 óreos
12 Maçãs
12 batatas
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Para comprar no mercado
5 pacotes de pipocas
2 óreos
12 Maçãs
12 batatas

7. Front-End Back-End
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
TODOLIST
Mas primeiro...
Qual a diferença entre o
front-end e back-end?

8. Front-End Interface da sua aplicação, responsável por interações, faz os pedidos
para o backend, transforma os dados que vem em forma de UI

9. Back-End Recebe os pedidos do front-end, responsável pelo
tratamento de dados e regras de negócios
Eu quero Mulheres
com máximo de 10 km
de distancia
entre 23 a 42 anos!

10. Olha ai as Mulheres
com máximo de 10 km
de distancia
entre 23 a 42 anos!
Back-End Recebe os pedidos do front-end, responsável pelo
tratamento de dados e regras de negócios

11. FRONT-END sem o BACK-END seria tipo:
---- --

12. VAMOS FAZER ESSE CARA
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
TODOLIST

13. NodeJS

14. NodeJS Hapi.js

15. NodeJS
Typescript
Hapi.js

16. NodeJS
Typescript
Hapi.js

17. PREPARAÇÕES
PARA COMEÇAR
A DESENVOLVER

18. https://nodejs.org/en/
SERVIDOR JAVASCRIPTNodeJS

19. SERVIDOR JAVASCRIPTNodeJS
No MAC PODE instalar pelo BREW!
brew install node

21. https://yarnpkg.com/en/

22. git clone https://github.com/kenjishiromajp/typescript_serverside_starterkit.git
Clona este projeto aqui para começar!

23. Vamos neste passo...
• Estrutura geral do projeto
• Configurar o Typescript
• Comandos básicos do node e yarn
• Como fazer o import de outros arquivos js

24. Mão na massa!

25. REVISÃO

26. Estrutura do package.json

27. Para instalarmos dependencias
npm i <dependencia> -S
yarn add <dependencia>

28. Montando um ambiente para debug
1. Instalamos o nodemon
2. executamos ele com uns parâmetros para utilizar o nodemon com ts-node
3. Adicionamos uma configuração no debug no visual studio de attach
4. Podemos executar o debug
yarn add nodemon -D

29. Funcionamento dos imports
sem o ‘./’ ele pega do node_modules
(dependencia que instalou com yarn add)
com o ‘./’ ele pega um arquivo relativo
a pasta desse arquivo

30. as dependências estão na nuvem,
podemos ver as dependências
que existem no site da

31. tsconfig.json
Define como serão feito os módulos
Array de pastas que devemos tirar da compilação.
no nosso caso o "node_modules"
Define que utilizamos
as features do Ecma Script 6
Onde vamos gerar os arquivos
de build.

32. Especificação de uma linguagem
Onde o javascript é baseado

33. ES6
ES7
ES2016 ou
ES2015 ou
• Default parameters
• Arrow functions
• Template literal
• multiline string
• destructuring assignment
• Promises
• Classes
• ...
• Array.includes
• Exponentiation Operator
• ...
NOVASFUNCIONA-LIDADES!
NOVASFUNCIONA-LIDADES!

34. AGORA, VAMOS DEFINIR
OS NOSSOS OBJETIVOS

35. Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Para comprar no mercado
5 pacotes de pipocas
2 óreos
12 Maçãs
12 batatas
ao pensar na todolist
Quais são as operações que
são possíveis em uma todolist?

36. • Pegar todas as TodoLists
• Criar uma TodoList
• Criar uma Todo
• Marcar uma Todo como feito
• Atualizar uma TodoList
• Deletar uma TodoList
• Deletar uma Todo

37. Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
Linguagens para aprender
Swift
Closure
Javascript
C#
TODOLIST
Front-End Back-End
quero pegar todas as todolists
Pegaê todas as todolists!

38. através de requisições http!
em alguma URL!

40. Email
Password
headers
body
Estrutura de uma requisição HTTP

41. Email
Password
headers
body
Armazena os dados
que serão enviados
Estrutura de uma requisição
Define o método
da requisição e URL

42. Email
Password
headers
body
Request Structure
https://facebook.com/signin
POST
email:
kenjishiromajp@gmail.com
password:
myverysecretpassword

43. WebService

44. E como decido
essas URLs?
GET - /criartodolists
PATCH - /PEGARtodolists
POST - /LISTARtodolists
GET - /BATATA
POST - /DELETAtodolist

45. REST vai nos dar a resposta!

46. REST
Representational
State
Transfer

47. {
“create” : “POST”,
“read” : “GET”,
“update” : “PUT”,
“partial_update” : “PATCH”,
“delete” : “DELETE”
}
Verbo/Métodos

48. Status Code

49. • Pegar todas as TodoLists
• Criar uma TodoList
• Criar uma Todo
• Marcar uma Todo como feito
• Atualizar uma TodoList
• Deletar uma TodoList
• Deletar uma Todo
Como ficaria nossos endpoints?

50. Como ficaria nossos endpoints?
• Pegar todas as TodoLists GET /todolists
• Criar uma TodoList POST /todolists
• Criar uma Todo POST /todos
• Marcar uma Todo como feito PUT/PATCH /todos/{id}
• Atualizar uma TodoList PUT/PATCH /todolists/{id}
• Deletar uma TodoList DELETE /todolists/{id}
• Deletar uma Todo DELETE /todos/{id}

51. AGORA TEMOS UM OBJETIVO
MAIS CONCRETO!

52. CRIAR TODOS ESTES ENDPOINTS!
OBJETIVO:
• Pegar todas as TodoLists GET /todolists
• Criar uma TodoList POST /todolists
• Criar uma Todo POST /todos
• Marcar uma Todo como feito PUT/PATCH /todos/{id}
• Atualizar uma TodoList PUT/PATCH /todolists/{id}
• Deletar uma TodoList DELETE /todolists/{id}
• Deletar uma Todo DELETE /todos/{id}

53. Linguagens para aprender
Swift
Closure
Javascript
C#

54. Quais as propriedades
você enxerga nesta todolist?
Linguagens para aprender
Swift
Closure
Javascript
C#

55. Linguagens para aprender
Swift
Closure
Javascript
C#
Titulo
Tarefas
Titulo
Se está feito

56. Vamos neste passo...
• Levantar um serviço http
• Criar uma rota para nossa aplicação
• Definir tipos na aplicação
• Como mandar response para o client

57. Mão na massa!

58. REVISÃO

59. Hap.Server
yarn add hapi
yarn add @types/hapi -D
Define a porta que vai subir o serviço http
Cross-Origin Resource Sharing
para aceitar de qualquer origem
Pacote para sabermos os tipos dos parâmetros
e acesso a algumas documentações direto da IDE

60. Definindo Rota
url da rota
EX: “http://localhost/todolists”
Verbo/Método da Requisição
passa o corpo da response
passa o statusCode
da response
sobe o serviço http

61. Tipando os parâmetros
Esse é o parâmetro : Esse é o tipo

62. Arrow function
Versão
antiga
Versão
com arrow
function
Versão
antiga
Versão
com arrow
function

63. Agora vamos fazer o retorno
dos dados com MongoDB

64. Para isso teria que instalar o mongo,
baixar o client... (mais configurações)

65. Por isso vamos usar o Docker compose!

66. O QUE É
Docker?

67. O QUE É
Docker?

68. Docker é uma série de
ferramentas que utiliza-se
de containers
para ajudar na criação de
um ambientes isolados

69. O que é Container? é tipo máquina virtual?
HARDWARE
SISTEMA OPERACIONAL
HYPERVISOR
MÁQUINA VIRTUAL
APP
SISTEMA OPERACIONAL
MÁQUINA VIRTUAL
APP
SISTEMA OPERACIONAL
MÁQUINA VIRTUAL
APP
SISTEMA OPERACIONAL

70. SISTEMA OPERACIONAL
HYPERVISOR
MÁQUINA VIRTUAL
APP
S.O 1GB DE RAM 10GB DE HD % DE PROCESSAMENTO
MÁQUINA VIRTUAL
APP
S.O 1GB DE RAM 10GB DE HD % DE PROCESSAMENTO
MÁQUINA VIRTUAL
APP
S.O 1GB DE RAM 10GB DE HD % DE PROCESSAMENTO
HARDWARE
O que é Container? é tipo máquina virtual?

71. SISTEMA OPERACIONAL
HYPERVISOR
MÁQUINA VIRTUAL
APP
S.O 1GB DE RAM 10GB DE HD % DE PROCESSAMENTO
MÁQUINA VIRTUAL
APP
S.O 1GB DE RAM 10GB DE HD % DE PROCESSAMENTO
MÁQUINA VIRTUAL
APP
S.O 1GB DE RAM 10GB DE HD % DE PROCESSAMENTO
HARDWARE
SISTEMA OPERACIONAL
DOCKER
CONTAINER
APP
CONTAINER
APP
CONTAINER
APP
O que é Container? é tipo máquina virtual?

72. Vamos usar dois carinhas do Docker

73. Docker Compose
Vamos usar dois carinhas do Docker

74. Docker HUBDocker Compose
Vamos usar dois carinhas do Docker

75. Docker Compose
Vamos usar dois carinhas do Docker
• Container com MongoDb
• Container com o
versão interface para
acessar o mongodb
MongoDb
Client

76. Docker HUB
Vamos usar dois carinhas do Docker
Repositório de imagens

77. Vamos neste passo...
• Como criar um container a partir de
um docker-compose
• Como podemos utilizar o serviço dos
containers
• Aprender o que é volume para que serve

78. Mão na massa!

79. REVISÃO

80. docker ps Lista todos os containers ligados
docker ps -a Lista todos os containers ligados e desligados
docker stop <id> Desliga o container com este id

81. docker container prune
Remove todos os container parados

82. docker-compose up
docker-compose.yml
imagem que achamos no docker hub
para reiniciar toda vez que monta
[porta_do_host]:[porta_do_container]
Sincroniza a porta do container para
a máquina host
Sincroniza a pasta db do host com a pasta
/data/db do container
[pasta_do_host]:[pasta_do_container]
Diz que só iniciará quando o mongo iniciar

83. VAMOS MANIPULAR
OS DADOS DO BANCO!

84. Vamos neste passo...
• Vamos conectar com o banco mongodb
• Vamos criar os Schemas
• Vamos criar os modelos
• Pegar os dados que estão no banco e jogar
na response

85. Mão na massa!

86. REVISÃO

87. Mongoose.connect()
Conectando com o nosso banco
string de conexão conectando localhost
na porta 27017 no banco todolists

88. Mongoose.connect()
string de conexão conectando localhost
na porta 27017 no banco todolists

89. Nome do meu Modelo
Nome da minha collection
Interface
Obriga o objeto ou classe que implementa a mesma
ter essas propriedades com esses tipos
Model.find()

90. async await
Indica que neste método
possui algum método assíncrono
sendo resolvido com await
Indica que vamos esperar o método
assíncrono completar para continuar
a execução

91. CRIAR TODOS ESTES ENDPOINTS!
OBJETIVO:
• Pegar todas as TodoLists GET /todolists
• Criar uma TodoList POST /todolists
• Criar uma Todo POST /todos
• Marcar uma Todo como feito PUT/PATCH /todos/{id}
• Atualizar uma TodoList PUT/PATCH /todolists/{id}
• Deletar uma TodoList DELETE /todolists/{id}
• Deletar uma Todo DELETE /todos/{id}

92. title
todos
headers
body
Estrutura de uma requisição HTTP

93. POSTMAN

94. Vamos neste passo...
• Organizar o conteúdo
• Como cadastrar uma todolist
• Como pegar o corpo de um requisição

95. Mão na massa!

96. REVISÃO

97. Minha database
Interface da Database
Interfae da todo
Parte lógica de cada rota
onde fazemos o registro das rotas
interface da Todolist
Modelo e Schema do Todolist
Inicializa a aplicação e registra todas as rotas
Instancia o servidor com configurações da mesma

98. Pega o corpo da requisição
Cadastra a partir do
model que criamos
Se der erro na hora de criar
podemos mandar um erro