desenvolvendo com node.js - mongoose + mongodb + vue.js
TRANSCRIPT
DESENVOLVENDO COM NODE.JSProf. Romulo Fagundes Cantanhede
@romulofagundes
NOSSA META
NoSQL - MongoDB
Node.JS
Express
Mongoose
Mongoose Generator
https://github.com/romulofagundes/app-teste/
NOSQL
…Not Only SQL… Banco de dados não relacional, aonde os dados não estão diretamente correlacionados, ou seja, com restrição de integridade (fk).
Vamos entender o MongoDB, que armazena os dados em forma de documento.
Um exemplo prático: Preciso armazenar todas as preferências do meu usuário ‘like' facebook (dinâmico). Como diferenciar filmes, de livros, gostos e afins?
MONGODB
Fundada em 2007, desenvolvido em C++.
Armazena os dados em um formato JSON, com as mesmas propriedades do JSON, com atributos dinâmicos e afins.
https://www.mongodb.com/
MONGODB
Melhor na prática, para entender!
NODE.JS
Baseado no V8, motor de renderização de código aberto do Google.
Possui a possibilidade de usar JS do lado do servidor, com isso é possível trabalhar com requisições HTTP’s (por exemplo).
Um linguagem simples dinâmica, e muito leve! Bem como o próprio JavaScript.
https://nodejs.org/
ANTES DE CONTINUAR…
O que ambos tem em comum?
MongoDB e Node.JS?
EXPRESS.JS
Framework para tratamento de requisição HTTP, que se utiliza do Node.JS.
Permite meios de tratar as requisições HTTP e trabalhar de forma simplificada com tais informações.
Mantém as mesmas características do Node.JS, simples e leve.
E como começar?
http://expressjs.com/
EXPRESS.JS GENERATOR
http://expressjs.com/en/starter/generator.html
$ npm install express-generator -g
$ express app-teste$ cd app-teste && npm install $ DEBUG=app-teste:* npm start
123
TECNOLOGIAS DO EXPRESS.JS
Algumas tecnologias pertinentes:
Pug (Jade) - Utiliza código HTML estilo Like Python.
Express - Responsável por tratar as requisições HTTP.
Demais complementos - Trabalhar com as requisições de forma correta.
MONGOOSE
Ok, ok…creio que todos já ouviram falar de Hibernate. Quem não, é uma teoria denominada Mapeamento Objeto Relacional, em resumo:
Para cada classe, eu tenho uma tabela.
Para cada atributo, eu tenho uma coluna.
Para cada registro, eu tenho uma instância.
Qual a relação com o Mongoose?
…vamos entender…http://mongoosejs.com
MONGOOSE - INSTALAÇÃOPara instalar, dentro da pasta do projeto faça a seguinte "receita de bolo”: $ npm install mongoose --save
Adicionando conexão ao projeto com Express.js (db/index.js):var mongoose = require('mongoose');
var options = { db: { safe: true }, server: { auto_reconnect: true, socketOptions: { keepAlive: 1 } }};
module.exports = function () { mongoose.connect(‘mongodb://127.0.0.1:27017/teste-app',options).connection;};
var db = require('./db')();
Chame a conexão no “app.js”:
MONGOOSE GENERATOR
Complemento, utilizado de forma global, para gerar os Schemas (domínios), a cada para request(controller) e serviço.
Permite gerar código pronto, de forma simplificada, com base no mongoose.
Para instalar:
$ npm install -g express-mongoose-generator
EXEMPLO DO MONGOOSE GEN.
mongoose-gen -m Grupo -f descricao -rmongoose-gen -m Contato -f nome,telefone,dataNascimento:date,preferencias:array,grupo:objectId -r
var grupoRoutes = require('./routes/GrupoRoutes.js');var contatoRoutes = require(‘./routes/ContatoRoutes.js');…app.use('/grupo', grupoRoutes);app.use('/contato', contatoRoutes);
Criado 2 schema’s: Grupo e Contato (!editar contato - rel. Grupo)
Adiciona as novas rotas, no app.js:
TORNANDO O EXEMPLO MAIS PRÁTICO…VUE.JS
VUE.JS
Script JS, que facilita a interação do código HTML com o servidor.
Permite com isso, converter valores de um FORM para um JSON, e facilita o envio de tais informações…e o que o MongoDB armazena? E o que o Express recebe?
https://vuejs.org/
VUE.JS
O Vue.JS é principalmente dividido em 3 partes:
data - Dados que serão acessados pelo código HTML, modelos e listas.
created - Função que está no ciclo de vida do Vue, para inicializar valores.
methods - Métodos que serão acessados no código HTML.
VUE.JS
Jade (Pug) fileGrupo JS
VUE.JS
Init
Get List
Create
VUE.JS
Update
Remove
Todas as chamadas(REST) criadas pelo Mongoose Generation!
FIM?
CRUD CONTATO
O arquivo JS basicamente é o mesmo de grupo.
Muda principalmente o FORM, e como os campos são mapeados.
O que fazer em seguida?
Entender a busca, como tratar os valores, e como relacionar os valores entre schema’s.
Para o CRUD de contato teve um pouco mais de código…
FIM!
LINKS INTERESSANTES
https://scotch.io/tutorials/using-mongoosejs-in-node-js-and-mongodb-applications
https://scotch.io/tutorials/build-a-restful-api-using-node-and-express-4