Cocinando Ricas Apps con Javascript

481 views

Published on

Conferencia dictada en UVM, UACM, y el Tecnológico de Milpa Alta

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
481
On SlideShare
0
From Embeds
0
Number of Embeds
67
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Cocinando Ricas Apps con Javascript

  1. 1. Cocinando Ricas Apps con Javascript Alberto Luebbert M. @almsx albertoluebbert@ideashappy.com www.ideashappy.com
  2. 2. Menú del Día ● ● ● ● 1.- ¿De qué va esto? 2.- Javascript 3.- Características 4.- Demos
  3. 3. ¿De qué va esto? ● ● ● ● ● ¿Para que aprender Javascript? Móvil Web Servidor Lenguaje SCRIPT.
  4. 4. ¿Quién soy yo? ● Alberto Luebbert M. CEO en ideas Happy www.ideashappy.com Usuario GNU Linux desde el 2002 Usuario Debian desde el 2003 Entusiasta promotor desde el 2004 openSUSE Ambassador desde el 2010 Atlantista de toda la vida ñ_ñ Ing. En Sistemas Computacionales TESOEM Miembro fundador de Comunidades: Generando Maldad, SUSEMX Coordinador FLISOL EDOMEX 2006-2010 Project Leader Hildebrando
  5. 5. En el principio... var form = document.forms[0]; if(form.txtNombre.length == 0){ alert(“Falta el nombre”); return false; } }
  6. 6. Hoy en dia...
  7. 7. Hoy en dia...
  8. 8. ¿Donde empleare Javascript? Móvil - Titanium Appcelerator Web – (jQuery) Servidor - NodeJS
  9. 9. Móviles var win = Titanium.UI.createWindow({ backgroundColor: '#003366', title: 'Hola mundo en javascript' }); var btn = Titanium.UI.createButton({ Title: 'Presioname', Width: 200, Height: 50, }); win.add(btn) win.open();
  10. 10. Móviles var win = Titanium.UI.createWindow({ backgroundColor: '#003366', title: 'Hola mundo en javascript' }); var btn = Titanium.UI.createButton({ Title: 'Presioname', Width: 200, Height: 50, }); win.add(btn) win.open();
  11. 11. Móviles - CommonJS ● Hoja.js ● Win.js exports.ventana = { function home(){ self: { var est = require('ui/handheld/Hoja'); BackgroundColor: '#003366', var self = Ti.UI.createWindow( Title: 'Hola Mundo' est.ventana.self); }} var btn = Ti.UI.createButton( exports.boton = { est.boton.self); self: { return self; width: 200, } height: 50, module.exports = Home; title: 'presioname' }}
  12. 12. Conexión a BD con Javascript var DB_NAME = '4dm.db'; var db = require('/ui/BD'); exports.createBase = function() { var db = Ti.Database.open(DB_NAME); var err; try{ db.execute('CREATE TABLE IF NOT EXISTS noticias(id INTEGER PRIMARY KEY, titulonoticia TEXT, fechanoticia TEXT, noticiacompleta TEXT, url TEXT)'); } catch(err){ alert(“Algun error”); } db.close(); }; db.crearBase();
  13. 13. Conexión a BD con Javascript var DB_NAME = '4dm.db'; var db = require('/ui/BD'); exports.createBase = function() { var db = Ti.Database.open(DB_NAME); var err; try{ db.execute('CREATE TABLE IF NOT EXISTS noticias(id INTEGER PRIMARY KEY, titulonoticia TEXT, fechanoticia TEXT, noticiacompleta TEXT, url TEXT)'); } catch(err){ alert(“Algun error”); } db.close(); }; db.crearBase();
  14. 14. Algunas apps hechas con Appcelerator
  15. 15. Geolocalización con jQuery
  16. 16. Geolocalización con jQuery function obtenerPosicion(location){ var posicion = new google.maps.LatLng(location.coords .latitude, location.coords.longitude) var mapa = google.maps.Map(mapDiv, { new zoom: 16, center: position, mapTypeId: google.maps.MapTypeId.HYBRID }); var marka google.maps.Marker({ = new position: position, map: map }); new google.maps.Geocoder().geocode({ location: posicion}, obtenerPosicion);
  17. 17. Hola mundo en Node.js var http = require('http'); http.createServer(function (request, response) { response.writeHead(200, {'Content-Type': 'text/plain'}); response.end('¡Hola Mundo!n'); }).listen(8081); console.log('Servidor http://127.0.0.1:8081/'); ejecutándose en
  18. 18. Generar JSON en Node.JS var contacto = { id: 1, lastName: "Pérez", firstName: "Martin" }; var texto = JSON.stringify(contacto); Contacto{ "id":1, "lastName":"P%eu%rez", "firstName":"Martin" }
  19. 19. Mucha más información ● ● Generando Maldad www.generandomaldad.com www.facebook.com/generandomaldad twitter: @generandomaldad Ejemplo de jQuery https://github.com/hdragomir/Odeon-Labs-Geolocation-with-Google-Maps
  20. 20. Cocinando Ricas Apps con Javascript Alberto Luebbert M. @almsx albertoluebbert@ideashappy.com www.ideashappy.com

×