Full Stack Developer

Hola

Hoy voy hablar sobre un perfil que se esta demandado mucho en los últimos años, que es Full Stack Developer.¿Qué es un Full Stack Developer?

En pocas palabras "el puto amo", es decir una persona que sabe de todo y tiene un conocimiento medio ó alto de tecnologías, heramientas, paradigmas, metodologias, servidores, redes, etc y gran facilidad de aprender. ¡Casi nada!

En el mundo del desarrollo web (donde estoy actualemente trabajanado) son muchas las tecnologías y las herramientas que hay para el desarrollo web, dependiendo del tamaño del softtware se puede utilizar un conjunto de tecnologías y herremientas para su desarrollo.

Para un desarrollo pequeño o mediano este sería el stack tecnologico

y para un desarrollo grande

Como veis son un monton de tecnologías, falta las herremientas, metodologías, servidores, etc. como veis hay que saber de muchas cosas para poder ser un Full Stack Developer.¿Se puede ser un Full Stack Developer?

Sí, pero no se hace de noche de la mañana, se tarda varios años y siempre se tiene que estar actulizando, probando y evaluando. Como he dicho al principio para ser FSD (Full Stack Developer) tienes que ser el puto amo.

Seguridad web (Métodos)

Hola

Una vez visto la teoría en que consistente la seguridad web, vamos a ver que métodos que tenemos para poder implementar nuestra seguridad en nuestras aplicaciones web JEE:

• HTTP-BASIC
• HTTP-DIGEST
• FORM-LOGIN
• CLIENT-CERTIFICATE-AUTENTICATION
• CUSTOMER AUTENTICATION

Esta son los métodos que tenemos para implementar seguridad en nuestras aplicaciones la mas usuada de FORM-LOGIN (Formulario de logeo). Todos estos métodos no sirve para poner seguriad tambien para nuestra Api Rest excepto FORM-LOGIN y ademas podemos añadir una mas que esta cogiendo mucha fuerza en el mundo de Api Rest que es Oauth, el listado de seguridad sería para las Api Rest las siguientes:

• HTTP-BASIC
• HTTP-DIGEST
• OAUTH
• CLIENT-CERTIFICATE-AUTENTICATION
• CUSTOMER AUTENTICATION

Como vemos hay muchos métodos para elegir e incluso podemos hacer el nuestro propio. Como siempre hay frameworks que nos facilita la vida para poder usar estos métodos de seguridad en nuestras aplicaciones, estos son algunos:

• SpringSecurity 
• SecurityFilter
• Shiro
• Picketlink

En las proxima entradas pondre ejemplos de algunos de los metodos de seguridad para nuestra aplicaciones y un resumen de la seguridad web.

Seguridad mundo web (Teoría)

Hola

En esta entrada voy hablar sobre la seguridad, durante este tiempo hemos visto como relizar aplicaciones web, un punto muy importante en el desarrollo del mundo web es el tema de la seguridad. ¿Que consiste? 

Cuando hablamos de seguridad en el mundo web es restringuir o controlar el acceso a mi aplicación.
Como siempre un ejemplo se ve mejor, a continuación vamos a ver como funciona la seguridad de la página web 'Cosas':

Acabamos de entrar en la web de 'Cosas' página que se dedica al a venta de cosas, cuando accedemos a la web, la primera página nos ofrece la opción de buscar articulos y añadir a un carrito de compras.

Yas hemos elegido los productos que deseamos comprar y pulsamos el boton comprar y la aplicación nos pregunta ¿Qué si ya tenemos una cuenta?. Al ser la primera no tenemos y decimos que no y  nos ofrece la posibilidad de crear una cuenta y procedemos a crear una cuenta rellenado el formulario con nuestros datos personales, direccion, etc.

Una creada la cuenta, pagina web cambia, es decir, tiene el mismo aspecto pero sale más opciones que antes no había, un avatar, nuestro nombre de usuario, opción de ver configuración, opción de ver pedidos, boton de cerrar sesión, etc y por último terminamos nuestra comprar.

El adminitrador de la página web 'Cosas' entra cada día para ver si hay pedidos para relizar los paquetes enviarlos a sus compradores, el administrador entra a 'Cosas' pulsa el boton acceso que le aparece una página que le piden sus credenciales. Una vez que el administrador introduce sus credenciales obtiene una pagína web parecida al usuario que ha realizado la compra pero con más opciones.

El administrador entra el opción de ver pedidos, puede ver y gestionar los pedidos realizados por los usuarios, el administrador busca los pedidos con estado nuevo, una vez que ha realizado el pedido y enviado a la empresa de mensajería. El administrador cambia el estado del pedido a enviado y cierra su sesión.

El usuario que ha relizado la compra entra a la página 'Cosas' para ver el estado de su pedido. el usuario entra a 'Cosas' y pulsa el boton acceso que le aparece una página que le piden sus credenciales y poesteriormente elige la opción 'ver pedidos', donde tiene un historico de sus pedidos y el estado de cada pedido, en su caso encuentra que su pedido se encuentra en estado 'enviado'.

Como véis es un caso muy general que en mundo web este ejemplo. De este ejemplo vamos analizador para obtener la caracteristicas de la seguridad que tiene implementada. Lo primero que podemos abstraer son los distintos tipos de usuarios:

•  Anónimo
•  Usuario
•  Administrador

Otra cosa que podemos abstraer es que hay usuario que estan autenticados (logeados) y no autenticados:

• No autenticados: Anónimo.
• Autenticados :  Usuario y Administrador.

Si seguimos analizando nuestro ejemplo, sí estan autenticados el usuario y dependiendo de quien sea puede ver más o menos opciones en la página web.

• Permisos para tipos Usuario
• Permisos para tipos Administrador

Con esto ya tenemos analizado el sistema de seguridad de la página web 'Cosas', como se puede ver la seguridad el mundo web esta formado por:

• Tipos de Usuarios
• Permisos de Usuarios

La seguridad web consiste:

 1º Autenticación (Obtener el tipo de usuario)
 2º Autorización para ver tal cosas (Ver los permisos de pendiento del tipo de usuario)

Una vez visto la teoría de la seguridad web vamos a explicar los distintos técnicas que tenemos de de implantar seguridad en nuestras aplicaciones web y api rest.

Ejemplo de Backbone

Despues de ver la distintas clase de Backbone y sus caracteristicas, procedemos para hacer un pequeño ejemplo completo con todos los componentes de Backbone. A ver el ejemplo se ha realizado con la herramientas y tecnologias:

• BackEnd  RestGenerator para generar Api Rest (JAX-RS, Spring, Mybatis, H2)
• FrontEnd Html5, CSS3, Backbone, Jquery, Underscore

Como siempre el ejemplo esta publicado en github y con la explicación de como usarlo. Aqui tenéis un resumen de lo que hemos visto de Backbone.

Backbone (Router)

Router

Las routers son las encargadas de enrutar las URLs de nuestras aplicaciones

 Base = Backbone.Router.extend({
 routes : {
  "" : "root",
  "usuario/:id" : "usuarioSingle"
 },
 root : function () {
  console.log('Estoy en root');
 },
 usuarioSingle : function (id) {
  console.log('Estoy en un usuario '+id);
 }
});

 Backbone.history.start({
  silent : false //Para que salte el evento
 });

Vamos a explicar un poco esta clase para compreder su funcionamiento.

Routes

Para ello se define un objeto hash routes que contendrá todas las rutas que se atenderán, debiendo contener al menos una.

Con esto tenemos la base para crear rutas en backbone, os envito a ver todos los métodos que tiene la clase Route de Backbone.

Backbone (View)

View

Las vista son las encargadas de representar la datos de nuestro modelo al usuario y también se encargan de capturar eventos y reaccionar de forma adecuada.

UsuarioView = Backbone.View.extend({
   tagName : "li",
   className : "item",
   events : {
    "click .delete" : "deleteUsuario"
   },
   initialize : function () {
    console.log('creado una view de usuario');
    this.template = _.template( $('#usuario-template').html());
   },
   deleteUsuario : function(e){
    this.$el.unbind();
    this.$el.remove();
   },
   render : function () {
    var data = this.model.toJSON();
    var html = this.template(data);
    this.$el.html(html);
   }
});

var usarioView = new UsuarioView({model : usuario});

Vamos a explicar un poco esta clase para compreder su funcionamiento.

La propiedad el

Cada instancia de una vista contendrá una propiedad llamada el, que será el objeto DOM que tendrá todo el contenido de la vista. Este elemento se crea automáticamente como un elemento div vacío, salvo que se indique lo contrario con las propiedades tagName y className, en nuestro caso va ser un elemto li con la clase item.
Por comodidad yo uso la propiedad $el que es el objecto DOM pero convertido en un objecto de jquery.

El método render

Este método se debe sobre escribir siempre porque es un método vacío, este método es el encargado de renderizar la plantilla de la vista con los datos del modelo y actulizar la propiedad $el

Eventos

Toda vista puede definir eventos y sus escuchadores, para ello se define un objeto hash llamado events con el siguiente formato en cada propiedad: {“event selector”: “callback”}. De esta forma indicaremos que para cada evento que ocurra bajo los elementos indicados por el selector se ejecutará la función callback.

Con esto tenemos la base para crear vistas de backbone, os envito a ver todos los métodos que tiene la clase View de Backbone.

Backbone (Collection)

Collection

Las colecciones son un conjunto de modelos. Una regla es que cada colección tiene que ser de un tipo de modelo,
aunque realmente no hay restricción alguna y pero por convección se hace así. Vamos a ver como crear una colección

Usuarios = Backbone.Collection.extend({
  url : '/rest/usuario/all',
  model : Usuario,
  initialize: function(){
   console.info('Creado una collecion de usuarios');
  }
});

Aqui hemos creados la clase collection de Usuarios, Como podemos ver el atributo model le indicamos el tipo de nuestra coleccion,
vamos a ver algunas metodos de la clase Collection

• add
• get
• at
• fetch

   
El método add añadido un modelo a nuestra coleccion

var usuarios = new Usuarios();

usuarios.add([{nombre:'Pepe', apellidos:'Perez Alonso'}, 
              {nombre:'Jose', apellidos:'Garcia Serrano'}]);

El método get obtiene el modelo con el id que le pasamos por argumento

usuarios.get("id-de-usuario");

El método at obtiene el modelo en la posción que se pase por argumento

usuarios.at(1)

El último método fetch es el encargado de hacer un petición al servidor y obtener un conjunto de datos  y crear un modelo por cada uno de los datos obtenidos en la petición y añadirlo a la colección

usuarios.fetch();

Con esto tenemos la base para crear colecciones de backbone, os envito a ver todos los métodos que tiene la clase Collection de Backbone.