
Alumno: Aitor Osés Martín
Tutor: Marko Galarza
Fecha: 20 de Febrero de 2014

Objetivos
- Estudiar las posibilidades que ofrecen las nuevas tecnologías web para el desarrollo de aplicaciones. En concreto, para aplicaciones móviles.
- Crear un marco de trabajo (FRAMEWORK) eficiente, eficaz y cómodo para el desarrollo.
- Intentar adaptar todo el trabajo de mi PFC a este marco de trabajo.
- Compartirlo con la comunidad OpenSource.
Desarrollo dEL
Framework
EVENTED.io
para aplicaciones móviles
con tecnologías web de última generación
Un framework
PARA APLICACIONES MÓVILES
CON TECNoLOGÍAS WEB ESTÁNDAR
¿QuÉ es un framework realmente?
-
CONCEPTOS
- Prácticas
-
Criterios
facilitar el desarrollo
- tiempo = +INGRESOS

¿Por quÉ no utilizar.... ¿CMS?

Tecnologías Anticuadas.
- MUCHA INTEGRACIóN
- MuCHA ACEPTACIón
- POCA ESCALABILIDAD
- POCOS AÑOS DE VIDA
- Tecnologías desbancadas
- Nuevos Patrones de APPS
- POCA ESCALABILIDAD
- POCOS AÑOS DE VIDA
- Tecnologías desbancadas
- Nuevos Patrones de APPS
¿COMO LE OCURRIó A FLASh?

EXACTO
FLASH vs htML5

MUCHOS FRAMEWORKS

uNo mÁS
¿PORQUE?
APLICACIONES MOVíLES
ESCALABLES
TEcnOLOGÍAS WEB
¿QUIEnes LO HACEN?
-
Google
-
Twitter
-
LinkedIn
-
FaceBook
¿DE dÓnde me viene esta motivación?
-
Me gusta lo que hago.
-
Tengo la necesidad de tener mejores herramientas
-
COMPARTIR
EVENTED.IO
Todo empieza
con
EL BAR MÔ
Aplicación Móvil
Un Año de investigación
Primer problema
DESPLIEGUE
Segundo Problema
EXPERIENCIA NATIVA
REsultado final
MI PROPIO
FRAMEWORK
HTml5 + CSS3 + JAVASCRIPT
VS
SDK's Privativos
¿FLASH?
¿PHONEGAP o cordova?

SOlución al DEspliegue
APACHE CORDOVA
(PHONEGAP)
Solución a la experiencia nativa
CSS3
- Transiciones
- Animaciones
Motor de física
-
Basado en CSS
- Controlado por Javascript
¡Single Page Applications!
Olvidar paradigma WEB
En las aplicaciones
CÓdigo se ejecuta solO en el cliente
Esto ocurría en flash también
FRAMEWORK JAVASCRIPT EN EL CLIENTE
PAtrón MVC

-
Directivas
-
CONTROLADORES
-
SERVICIOS
-
FILTROS
- routing
DIRECTIVAS
<tabs>
<pane heading="Static title">Static content</pane>
<pane ng-repeat="pane in panes"
heading="{{pane.title}}"
active="pane.active">
{{pane.content}}
</pane></tabs>
Controladores
<div ng-controller="SampleController">
<input ng-model="person.name"/>
<button ng-click="save()"/>
</div>
function SampleController($scope) { $scope.person = {name: "Aitor"} $scope.save = function() { // Hacer algo } }
Servicios
var app = angular.module('services', []);
app.service('myService', function(){
return {
somefunc: function() {
console.log('Hola mundo');
}
}
});
// El servicio puede inyectarse en cualquier sitio
function SampleController(myService) {
myService.somefunc();
}
FILTROS
<ul>
<li ng-repeat="c in customers | filter:{region: 'Madrid'}">{{c.name}</li> <ul>
<p>{{'SAMPLE_KEY' | localize}}</p>
<p>{{message | pluralize | toUpperCase}}</p
Routing
var phonecatApp = angular.module('phonecatApp', [
'ngRoute',
'phonecatControllers'
]);
phonecatApp.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/phones', {
templateUrl: 'partials/phone-list.html',
controller: 'PhoneListCtrl'
}).
when('/phones/:phoneId', {
templateUrl: 'partials/phone-detail.html',
controller: 'PhoneDetailCtrl'
}).
otherwise({
redirectTo: '/phones'
});
}]);
¿Y EN EL SERVIDOR?
Node.js
Runtime I/O asíncrona
MOTOR v8 "JS" Google
- Node es un entorno de ejecución + librerías.
- Basado en un conjunto de bibliotecas en C sobre el motor v8 de Google.
- Utiliza un ciclo de eventos en lugar de hilos nuevos por cada conexión (Event Loop)
- Cada OPERACIÓN de i/o de node es Asíncrona.
- Centrado en la eficiencia.
- Diseñado para la red. REquest y response.
- Puede manejar miles de conexiones simultáneas con una sobrecarga Mínima (CPU/MEMORIA) en un solo Proceso.
-
Javascript del lado del servidor (SSJS)
Event loop

BENCHmaRK
PHP vs NODE

Base de datos
¿sql o nosql?
Mongo es NOSQL
No mas 'SQL'
Open-Source
Cursos
Education 10gen
Ejemplo
EVENTED.IO
Las mejores prácticas: preprocesadores, patrones de programación, testing, debugging, control de versiones
Angular.JS + Node.js Server + Mongo
Cliente
Backend
EJEMPloS
CONCLUSIONEs
Desarrollo de aplicaciones
By Aitor Osés Martín
Desarrollo de aplicaciones
- 238


