Upload
alberto-luebbert-mendoza
View
293
Download
0
Embed Size (px)
DESCRIPTION
Conferencia dictada en UVM, UACM, y el Tecnológico de Milpa Alta
Citation preview
Menú del DíaMenú del Día
● 1.- ¿De qué va esto?1.- ¿De qué va esto?
● 2.- Javascript2.- Javascript
● 3.- Características3.- Características
● 4.- Demos4.- Demos
¿De qué va esto?¿De qué va esto?
● ¿Para que aprender Javascript?¿Para que aprender Javascript?
● MóvilMóvil
● WebWeb
● ServidorServidor
● Lenguaje SCRIPT.Lenguaje SCRIPT.
¿Quién soy yo?¿Quién soy yo?
● Alberto Luebbert M.Alberto Luebbert M.
CEO en ideas HappyCEO en ideas Happy
www.ideashappy.comwww.ideashappy.com
Usuario GNU Linux desde el 2002Usuario GNU Linux desde el 2002
Usuario Debian desde el 2003Usuario Debian desde el 2003
Entusiasta promotor desde el 2004Entusiasta promotor desde el 2004
openSUSE Ambassador desde el 2010openSUSE Ambassador desde el 2010
Atlantista de toda la vida ñ_ñAtlantista de toda la vida ñ_ñ
Ing. En Sistemas Computacionales TESOEMIng. En Sistemas Computacionales TESOEM
Miembro fundador de Comunidades:Miembro fundador de Comunidades:
Generando Maldad, SUSEMXGenerando Maldad, SUSEMX
Coordinador FLISOL EDOMEX 2006-2010Coordinador FLISOL EDOMEX 2006-2010
Project Leader Hi ldebrandoProject Leader Hi ldebrando
En el principio...En el principio...
var form = document.forms[0];var form = document.forms[0];
if(form.txtNombre.length == 0){if(form.txtNombre.length == 0){
alert(“Falta el nombre”);alert(“Falta el nombre”);
return false;return false;
}}
}}
Hoy en dia...Hoy en dia...
Hoy en dia...Hoy en dia...
¿Donde empleare Javascript?¿Donde empleare Javascript?
Móvil - Titanium AppceleratorWeb – (jQuery)Servidor - NodeJS
MóvilesMó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();
MóvilesMó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();
Móviles - CommonJSMóviles - CommonJS
● Hoja.jsHoja.js
exports.ventana = {exports.ventana = {
self: {self: {
BackgroundColor: '#003366',BackgroundColor: '#003366',
Title: 'Hola Mundo'Title: 'Hola Mundo'
}}}}
exports.boton = {exports.boton = {
self: {self: {
width: 200,width: 200,
height: 50,height: 50,
title: 'presioname'title: 'presioname'
}}}}
● Win.jsWin.js
function home(){function home(){
var est = require('ui/handheld/Hoja');var est = require('ui/handheld/Hoja');
var self = Ti.UI.createWindow(var self = Ti.UI.createWindow(
est.ventana.self);est.ventana.self);
var btn = Ti.UI.createButton(var btn = Ti.UI.createButton(
est.boton.self);est.boton.self);
return self;return self;
}}
module.exports = Home;module.exports = Home;
Conexión a BD con JavascriptConexión a BD con Javascript
var DB_NAME = '4dm.db';
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();
};
var db = require('/ui/BD');var db = require('/ui/BD');
db.crearBase();db.crearBase();
Conexión a BD con JavascriptConexión a BD con Javascript
var DB_NAME = '4dm.db';
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();
};
var db = require('/ui/BD');var db = require('/ui/BD');
db.crearBase();db.crearBase();
Algunas apps hechas con AppceleratorAlgunas apps hechas con Appcelerator
Geolocalización con jQueryGeolocalización con jQuery
Geolocalización con jQueryGeolocalización con jQuery
function obtenerPosicion(location){
var posicion = new google.maps.LatLng(location.coords.latitude, location.coords.longitude)
var mapa = new google.maps.Map(mapDiv, {
zoom: 16,
center: position,
mapTypeId: google.maps.MapTypeId.HYBRID
});
var marka = new google.maps.Marker({
position: position,
map: map
});
new google.maps.Geocoder().geocode({
location: posicion},
obtenerPosicion);
Hola mundo en Node.jsHola 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 ejecutándose en http://127.0.0.1:8081/');
Generar JSON en Node.JSGenerar JSON en Node.JS
var contacto = {var contacto = {
id: 1,id: 1,
lastName: "Pérez",lastName: "Pérez",
firstName: "Martin"firstName: "Martin"
};};
var texto =var texto =
JSON.stringify(contacto);JSON.stringify(contacto);
Contacto{Contacto{
"id":1,"id":1,
"lastName":"P%eu%rez","lastName":"P%eu%rez",
"firstName":"Martin""firstName":"Martin"
}}
Mucha más informaciónMucha más información
● Generando MaldadGenerando Maldad
www.generandomaldad.comwww.generandomaldad.com
www.facebook.com/generandomaldadwww.facebook.com/generandomaldad
twitter: @generandomaldadtwitter: @generandomaldad
● Ejemplo de jQueryEjemplo de jQuery
https://github.com/hdragomir/Odeon-Labs--https://github.com/hdragomir/Odeon-Labs--Geolocation-with-Google-MapsGeolocation-with-Google-Maps