lunes, 22 de enero de 2018

NODE.JS con Codigo Facilito



http.createServer(requestListener)

Devuelve un nuevo objeto del servidor web.  requestListener es una función que se añade automáticamente al evento 'solicitud'.

http.ServerResponse

Este objeto es creado internamente por un servidor HTTP, no por el usuario. Se pasa como el segundo parámetro al evento 'solicitud'. Es un flujo de escritura.

response.writeHead(statusCode, [reasonPhrase], [headers]) 

Envía un encabezado de respuesta a la solicitud. (statusCode) El código de estado es un código de estado HTTP de 3 dígitos, como 404. [reasonPhrase]   El último argumento, los encabezados, son los encabezados de respuesta. Opcionalmente, uno puede dar un reasonPhrase legible por humanos como el segundo argumento.[headers]

var body = 'hello world';
response.writeHead(200, {
  'Content-Length': body.length,
  'Content-Type': 'text/plain' });
5.- ... Variables en una vista

12.- .. Routing básico
1) npm init (Crear el package.json)

2) npm install express --save (Instalamos express)
   npm install jade --save

3) creamos un archivo app.js
   se crea una carpeta views y dentro un archivo index.jade y form.jade

4) en el archivo app.js  escribimos
var express = require("express")
var app = express()
app.set("view engine", "jade"); 
//Verbos Http => GET / POST / PUT / PATCH / OPTIONS / HEADERS / DELETE 
// carga index.jade
app.get("/", (req,res) =>{
res.render("index")
})
//como obtener un dato por metodo GET
app.get("/:algo",(req,res)=>{
console.log(req.params.algo)  // sale por consola
res.render("form",{algo: req.params.algo})  // lo mandamos a imprimir en FORM
})
// carga form.jade
app.post("/",(req,res)=>{
res.render("form")
})
app.listen(8080)
5) en el archivo form.jade  escribimos
html
head
title Mi primera pagina con express
body
h1 Hola #{algo} // Imprime Hola mas el valor que trae algo
6) en el archivo index.jade  escribimos
html
head
title Mi primera pagina con express
body
form(action="/", method="POST")
input(type="submit",value="Enviar")

13.-.. Layouts con JADE 
del 1 al 3 igual que el anterior
4) en el archivo app.js  escribimos
var express = require("express")
var app = express()
app.set("view engine", "jade");
app.get("/", (req,res) =>{
res.render("index")
})
app.get("/login", (req,res) =>{
res.render("login")
})

app.listen(3000)
console.log("Cargado el programa en el puerto 3000")
5) en la carpeta views creamos el siguiente archivo de cabecera LAYOUT.JADE
doctype html
html(lang="es")
head
title FotoFacilito
meta(charset="utf-8")
link(href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet") ---> carga desde un CDN la libreria de boostrap
body
block contenido  ---> este nombre se ripe en todos los jade
6) en la carpeta views se crea INDEX.JADE
extends ./layout.jade   carga la libreria de cabecera LAYOUT.JADE
block contenido  ---> usa el mismo nombre de LAYOUT.JADE
h1 Bienvenido a FotosFacilito (Estas en el Index)
a(href="/login") Iniciar Sesion

7) en la carpeta wiews se crea LOGIN.JADE
extends ./layout.jade  <-- Manda a llamar el archivo de cabecera LAYOUT.JADE
block contenido
h1 (Estas en el Login)
form(action="/users" method="POST")
div(class="form-group") <-- Esto es para boostrap
label(for="email") Email:
input(type="text" name="email" placeholder="Email" id="email" class="form-control") <-- Esto es para boostrap
div
label(for="password") Pasword:
input(type="text" name="password" placeholder="Password" id="password" class="form-control") <-- Esto es para boostrap
div
br
input(type="submit" value="Iniciar Sesion" class="btn btn-info")  

15.- ...Servir archivos estáticos 


app.use(express.static('assets'))// llamado a la carpeta assets como estatica - no cambia 
app.use("/estatico", express.static('public'))// llamado a la carpeta publica como estatica - no cambia --   se le añade el /estatico.... crea un subdirectorio virtual
16.- Curso NodeJS - Leer parámetros 

npm install body-parser --save (Instalamos body-parser)
en app.js
var bodyParser = require("body-parser")

app.use(bodyParser.json()) //para peticiones application/json

app.use(bodyParser.urlencoded({extended: true}))

para recuperar los datos del formulario
app.post("/users", (req,res) =>{  //   /users   se coloca en el form de loguin....
                                                   //donde dice form(action="/users" method="POST")
                 // Los datos se recuperan  con body.NOMBREdelCampoFormulario
console.log("Contraseña: " + req.body.password)
console.log("Email: " + req.body.email)
res.send("Recibimos tus datos")
})

17.- ....- Conexión a MongoDB

var mongoose = require("mongoose")
var Schema = mongoose.Schema
mongoose.connect("mongodb://localhost/fotos")
var userSchemaJSON = {
email:String,
password:String
}
var user_schema = new Schema(userSchemaJSON)
var User = mongoose.model("User",user_schema)

app.post("/users", (req,res) =>{
console.log("Contraseña: " + req.body.password)
console.log("Email: " + req.body.email)
var user = new User({email: req.body.email, password: req.body.password})
user.save(function(){
res.send("Guardamos tus datos")
}) }) 

mostrar en consola
app.get("/login", (req,res) =>{
User.find((err,doc)=>{
console.log(doc)
res.render("login")
}) }) 

21.-...- Validaciones personalizadas

/*  tipos de Datos
String  -  Number  -   Date   -  Buffer
Boolean -  Mixed   - Objectid - Array
*/
var posibles_valores = ["M","F"]
//var email_match = [] minuto 10:06 video 21
var user_schema = new Schema({
name: String,
username: {type:String,required:true,maxlength:[50,"Username muy Grande"]},
password:{type:String,minlength:[8,"El PAsword es muy corto"]},
age: {type: Number,min: [5,"la edad no puede ser menor a 5 años"],max: [100,"La edad no puede ser mayor a 100"]},
email: {type:String,required: "El correo es Obligatorio"},
date_of_birth: Date,
sex: {type:String,enum:{values: posibles_valores,message:"Opcion NO valida"} }
})
//Schema Virtual
user_schema.virtual("password_confirmation").get(function(){
return this.p_c
}).set(function(password){
this.p_c = password
})
22.- - Validaciones personalizadas 2 

REPARAR MONGO 
 mongod --dbpath /data/db --repair

24.... Mongoose find

.fineONe --> Devuelve una colección  o arreglo
PARAMETROS:  
1.- Query.  
2 [campos queremos q devuelva,] "Es opcional"  
3 funcion o callback
app.post("/sessions", (req,res) =>{ User.findOne({email:req.body.email,password:req.body.password},function(err,docs){ console.log(docs) res.send("Hola mi mundo") })})

25.... Sesiones


instalar.... npm install express-session --save

en APP:JS
var session = require("express-session")

app.use(session({
secret: "123byushjdskj12ub"
}))
26.- ... - Rutas modulares
Crear rutas .....

Creamos un archivo en la raiz principal llamado ROUTES_AP.JS


var express = require("express")
var router = express.Router()
/*  app.com/app/  */router.get("/", (req,res)=>{  
/*  Buscar el Usuario  */  
res.render("app/home")})
module.exports = router
En la carpeta VIEWS creamos otra carpeta llamada APP y hay creamos un archivo llamado HOME.JADE
extends ../layout.jade
block contenido
h1 Hola usuario

Y en APP.JS escribimos
var router_app = require("./router_app")
app.use("/app", routes_app)   // /app -- es el nombre que le queremos dar

27.- ... - Custom middleware 

Creamos una carpeta llamada MIDDLEWARES y creamos un archivo llamado SESSION.JS
module.exports = (req,res,next){
if(!req.session.user_id){
res.redirect("/login")
}
else{
next()
}
}


En APP.JS añadimos
var session_middleware = require("./middleware/session")
app.use("/app",session_middleware)

28.- ... - Response locals (OJO revisar este video) minuto 7 / 9:45
.... Saber cual es el usuario logueado
......  se añadio una libreia nuestra de CSS en el archivo VIEWS\LAYOUT.JADE
link(href="/public/css/app.css" rel="stylesheet")

SESSION.JS

var User = require("../models/user").User
module.exports = (req,res,next)=>{
if(!req.session.user_id){
res.redirect("/login")
}
else{  // buscar el usuario 
User.findById(req.session.user_id,(err,user)=>{
if(err){
console.log(err)
res.redirect("/login")
}else{
res.locals = { user: user} //sirve para pasar valores a las vistas
next()
}
}) }
}

HOME.JADE
extends ../layout.jade
block contenido
h1 Hola usuario ya estas adentro #{user.email} 

29.- .... - Rutas para CRUD 
añadimos lo siguiente a ROUTES_APP.JS
//crear Imagenes
router.get("/imagenes/:new" (req,res)=>{
       res.render("app/imagenes/new") 
})
//editar Imagenes
router.get("/imagenes/:id/edit" (req,res)=>{
})

router.route("/imagenes/:id")
// Mostrar
.get((req,res)=>{
})
// actualizar
.put((req,res)=>{
})
// borrar imagen
.delete((req,res)=>{
})
//coleccion de imagenes
router.route("/imagenes")
// Obtener todas las imagenes
.get((req,res)=>{
})
// crear una nueva imagen
.post((req,res)=>{
})
Se crea una carpeta IMAGENES en views\app\IMAGENES
          se crea un archivo NEW.JADE
 
extends ../../layout.jade
block contenido
div(class="col-md-6  remove-float  center-block  big-top-space")
h1 subir nueva imagen
form(action="/imagenes" method="POST")
div(class="form-group")
label(for="title") Titulo:
input(type="text" name="title" placeholder="Titulo de la Imagen...." id="title" class="form-control")
div
label(for="archivo") Imagen
input(type="file" name="archivo" id="archivo" class="form-control")
div(class="row  top-space")
div(class="col-xs-12  col-sm-6")
R ESTE VIDEO div(class="col-xs-12  col-sm-6  text-right")
a(href=("/signup")) No tengo cuentaV

30.- ... - Guardar modelo imágenes  (ojo ver este video)


Crear un squema para la imagen que vamos a subir (/models/IMAGEN.JS)
var mongoose = require("mongoose")
var Schema = mongoose.Schema
//crear schema de imagenes 
var img_schema = new Schema({
title:{type:String,required:true}
}) 
var img_schema = mongoose.model("Imagen",img_schema)
module.exports = Imagen
Añadimos a ROUTES_APP
var Imagen = require("./models/imagenes")

.... falto a notar mas informacion 






No hay comentarios.:

Publicar un comentario