Cuando miro el código del diseñador

@author @troleandogeeks

VIVIR AL LÍMITE

breaking-cat:

VIVIR AL LÍMITE - Lo estás haciendo de puta madre

Fuente: http://www.cuantarazon.com/377234/vivir-al-limite

Troleando cops

El desplegado (deployment) en Web Logic

image

/*
 * @author <The Coding Love> @thecodinglove
 */

Cuando por fin mi script termina y funciona perfectamente

/*
 * @author <Les Joies du Code> @lesjoiesducode
 */

#winter in Petite-Italie #montreal #quebec #canada  (at Petite Italie / Little Italy)

#winter in Petite-Italie #montreal #quebec #canada (at Petite Italie / Little Italy)

View high resolution

10 indispensables que un programador front-end debe saber en una entrevista de trabajo

El mercado ha cambiado y las soluciones son cada vez más diversas. Hace 5 años difícilmente podríamos encontrar puestos de trabajo que tuvieran como título: “Programador Front-End”.

Gracias a que los dispositivos móviles y aquellos llamados tabletas se pusieron de moda en el mercado, diversos conceptos y patrones han emergido y evolucionado en el mundo del UI (User Interface).

Aquí dejo en claro los 10 principales conceptos que un programador debe saber a la hora de la entrevista técnica:

1. Patrones de diseño.

Quizás la teoría más importante que hace a la diferencia entre un buen y un mal programador.  Hay que saber, inclusive dormido cuales son las clasificaciones de estos patrones, donde los usamos y dar ejemplos de ellos.  En la vida diaria de un programador estamos expuestos a ellos, pero a veces no sabemos identificarlos con claridad.  Un entrevistador puede estar lo suficientemente preparado para preguntar ejemplos de patrones como:

Patrón Observador (comúnmente conocido como Publisher/Consumer).

Inyección de Dependencias (jQuery permite la creación de plugins mediante esta técnica)

Patrón Decorador (permite encapsular la definición de un objeto y agregar mayores funcionalidades sin modificar la clase del objeto original).

Patrón Builder (centraliza la creación de un componente).

2. Integración Cross-Browser.

Aprendamos que existen propiedades en html, css o javascript que no siempre son compatibles entre diferentes navegadores.  Aprendamos también existen navegadores propios de dispositivos móviles y que Internet Explorer 7 y 8 siguen en el mercado.  Un entrevistador puede quizás buscar la forma de que hables de dichas diferencias, propiedades que son disponibles en navegadores modernos y que no eran posibles hacer en Internet Explorer hace 10 años.  Existen actualmente soluciones javascript que hacen posibles (parcialmente) esas discrepancias de propiedades HTML y CSS, hay que estar preparados para estudiarlas y mencionarlas.

3. Box-Sizing.

Cuando se viene la hora de describir como un componente HTML se despliega en pantalla, debemos conocer que todo elemento cuenta con content, padding, border y margin.  También debemos saber que no todos los exploradores miden las dimensiones de nuestros componentes tomando como referencia, el borde o el contenido del componente, para eso existe la propiedad box-sizing.

4. MVC.

AngularJS o EXT.js son algunos ejemplos de plataformas MVC que son ampliamente utilizadas en el desarrollo front-end.  Al menos comprendamos que MVC tiene raíz en “Modelo-Vista-Controlador”.  Hay entrevistadores quienes todavía estan casados con el concepto de que un JSP es la representación de una Vista, para esto puedes citar ejemplos Java (Spring, Struts, Seam) o PHP (codeIgniter, cakePHP, Symfony o Zend) los cuales pueden ser más familiares para un programador de la época de las cavernas.

5. El objecto ”prototype” en javascript.

En javascript existe un objeto capaz de modificar las clases ya definidas en un contexto javascript.  Aunque la palabra “clase” no es precisamente la adecuada para nombrar las definiciones de los objectos en javascript, es indispensable saber para que se utiliza y en que situaciones es recomendable usarlo.  Lo que más valora un entrevistador es que uno sea capaz de responder que el objeto prototype es práctico únicamente si queremos modificar objetos nativos en javascript, como Date, Number, Array entre otros; fuera de eso se recomienda no manipular al libre juicio otra definición de objetos.  Javascript permite definir objetos mediante notaciones JSON, lo cual hace que la sobre-escritura de prototype sea realmente innecesaria.

6. RESTful APIs.

La arquitectura “Representational State Transfer” no es más que el parte-aguas entre el front-end y el back-end.  Cuando un proyecto persigue esta arquitectura, el equipo de desarrollo back-end puede hacer su implementación en Java, C#, PHP, Pyton o el lenguaje que mejor satisfaga las necesidades del servidor.  Con esto, su trabajo termina en ofrecer un conjunto de servicios (API), de preferencia documentados, con los cuales se transmiten los recursos necesarios que el UI necesita consumir.  Esta comunicación entre front y back ends se puede dar con diversos protocolos (HTTP) y en diversos formatos (XML, JSON).  El término conocido como “AJAX” tiene un papel muy importante en la comunicación entre clientes y servidores y generalmente los entrevistadores adoran escuchar ese término.

7. Diseño Adaptativo (Responsive Design).

Digo. Para que crear diferente código del lado del cliente para satisfacer diferentes resoluciones o dispositivos?  El responsive design es un concepto que ataca la idea de multiplicar código y que ajusta la estructura del UI, sin necesidad de crear múltiples versiones del mismo, para ofrecer la mejor experiencia a diferentes resoluciones/dispositivos.

Sería de gran utilidad revisar herramientas como bootstrap, foundation o blueprint para comprobar experiencia con sitios adaptativos.

8. Deep Linking.

El desarrollo en Web no es solo cuestión de ocuparse de la experiencia en el espacio de un usuario, también es importante crear una buena experiencia en su tiempo.  Deep linking es un concepto que muchas veces se ha sacrificado en la moda de desarrollar aplicaciones completamente interactivas con el servidor usando peticiones “ajax” del lado del cliente.  Un usuario agradece que la aplicación guarde historial de las páginas o módulos visitados y poder usar las herramientas de navegación del navegador (dígase “atrás”, “siguiente”).  Mencionar frameworks como AngularJS o plugins en jQuery como jQuery Address podría ayudar al entrevistado a no quedarse nulo frente a este tema.

9. CSS de estructura / CSS de theming.

Para aquellos programadores que se inquietan por lo que ofrecen los navegadores modernos, echarle un vistazo a propiedades como transition, transform, box-shadow, text-shadow no estaría de mas.  Inclusive entender selectores como :after, :before, :first-child o :last-child.  En el front-end moderno es muy importante para un cliente poder tener la posibilidad de crear temas en su sitio web.  Puntualizar la diferencia entre el CSS de layout o estructura y el de theming es algo de suma importancia a la hora de hablar del CSS.  A la repetitiva pregunta de un entrevistador de: “Cuando se crea un sitio desde cero, se comienza a desarrollar pensando en Móvil o en Escritorio?" No hay respuesta correcta, lo mejor es decir que depende del sitio, sin embargo quienes preguntan más dicha discordia son aquellos que prefieren comenzar a desarrollar desde una versión móvil.

10. Pre-procesadores de CSS.

Si somos de los que todavía nos gusta desarrollar css propiedad por propiedad, quizás no estamos del todo listos para tomar una posición senior en front-end.  Pre-procesadores como SASS o LESS ayudan a que el integrador desacople las propiedades CSS en una sitio.  No sin antes mencionar que una vez que el CSS está pre-procesado, al generar un archivo resultante, este tiene la capacidad de estar optimizado y mínificado para que su acceso sea más rápido en servidores de producción.

La moral genética del lenguaje.

En el habla hispana, como en otras lenguas existen muchos bloggeros que son realmente apasionantes en su forma de escribir.  Relatan, con mucho mayor sabor, todas esas cosas que tienen como misión expresarle a sus lectores, sin embargo, a muchos de ellos les encantaría que sus voces y sus opiniones, sus legados y sus movimientos sociales llegaran a aquellos que no hablan o entienden su lenguaje.

En pleno siglo XXI y en vísperas del 2014, las limitaciones de comunicación son cada vez más estrechas, sin embargo la problemática del lenguaje sigue siendo un paradigma cuya responsabilidad recae más que del emisor, en el receptor del mensaje.

Un blogger que tienen una impecable manera de escribir y cuyo blog está completamente construido y romantizado en castellano difícilmente tienen lectores australianos o canadienses cuya necesidad por leer el español es de baja prioridad.

Es por eso que muchos optan, y se puede ver claramente en sus cuentas de facebook o twitter, por migrar sus pensamientos al inglés. El inglés es el lenguaje más utilizado en Internet, y por tanto asumimos que es el lenguaje que puede alcanzar, el mayor número de lectores.  Aunque a muchos no nos guste, esto se debe a lo sencillo que resulta para cualquier persona, lograr aprenderlo, entenderlo y reproducirlo.

Sin embargo, según lingüistas expertos, dejar de usar el español para que los anglos nos lean es un fenómeno que promueve que nuestro lenguaje no sea de amplia necesidad de aprender por los mismos anglos.  Es más sencillo para un árabe o un húngaro intercambiar ideas con un hispano en inglés que en cualquier otra lengua en medios como el Internet.  Puede que muchos se sientan cómodos hablando el inglés, pero culturalmente a muchos nos incomoda que el esperanto moderno sea precisamente la lengua de ingleses y estadounidenses que históricamente se han dedicado a mermar nuestra lengua.

Específicamente en México, la historia sitúa al náhuatl o al maya o al huichol, el tarasco o el otomí, como las lenguas que originalmente le pertenecen a suelo mexicano.  Son ellas, por ende las lenguas que deberían defenderse al máximo, no por los mismos nativos, sino también también por aquellos mexicanos que conocen la historia de dichas lenguas y que catalogarlas como indígenas es simplemente “Injusto”.

Cuáles son entonces las lenguas que debemos defender? Aquellas que consideremos las apropiadas para ser heredadas y con ello, las que reflejen de mejor forma nuestra identidad.  Culturalmente, el lenguaje es una de las formas más poderosas para agrupar a la gente dentro de los estereotipos raciales, de ser identificados por los enemigos para ser señalados y acusados de aquello que históricamente ha dejado huella negativa en ellos; pero también es una de las formas más importantes de unirnos como sociedad y recae en todos aquellos que comparten nuestro lenguaje remover los estereotipos negativos que hemos cargado injustamente debido al simple hecho de hablar una lengua de nacimiento que no elegimos.

Oh yes baby! I will throw you a null pointer through an html5 alert!

Oh yes baby! I will throw you a null pointer through an html5 alert!

View high resolution

Verano 2013, Festival Sikh en el barrio de Parc.  No es muy común ver esto en Montreal Québec.

Verano 2013, Festival Sikh en el barrio de Parc.  No es muy común ver esto en Montreal Québec.

View high resolution

Sainte Thérèse #quebec #canada

Sainte Thérèse #quebec #canada

View high resolution

Old Port #Montreal #qc #canada

Old Port #Montreal #qc #canada

View high resolution

Harlem Shake con los terroristas

Todo empezó a finales de enero de este año, el 2013. He tratado de saber a ciencia cierta cual ha sido la causa natural de este boom y cuál fue el primer video en ser publicado.  En instantes se escribían artículos, comentarios, nuevos videos, en días, hay cientos de videos circulando en las redes sociales, he visto desde gatos, perros, oficinas enteras, gente aleatoria en Central Park, la banana style hasta compañías de tecnología, que por supuesto no podían quedarse atrás en poner a sacudir a su staff entero.

Pero que es el Harlem Shake?

Según las referencias más antiguas que se tienen del término el Harlem Shake es un estilo de baile y de música derivada del Hip Hop donde consiste en sacudir las extremidades de forma rítmica mientras se pivotan los hombros al cuerpo.  Dicho estilo alcanzó su tope de popularidad en el 2001, sin embargo en agosto del 2012 un intérprete nombrado Baauer mostró a las redes sociales un release electrónico http://www.youtube.com/watch?v=Bk1_DbbzSdY que a decir verdad no alcanzó tantas visitas hasta que la parodia del “Shake” llegó en escena.

La parodia.

La parodia inició cuando a un youtuber llamado Filthy Frank el día 2 de Febrero del 2013 subió una versión donde 4 chavos con su más ridículo disfraz sacuden sus telas al “Horny Gorilla Style”.  Después de 31 segundos aproxiamadamente comienza su propia interpretación del “Harlem Shake” sacudiendo las extremidades en forma sumamente cómica (Aquí el video, para que vean que no les miento http://www.youtube.com/watch?v=8vJiSSAMNWw).  Ese mismo día un youtuber que subía videos de él mismo en su patineta, se le ocurrió subir su propia parodia.

En menos de una semana, el éxito de la parodia era inminente. Ahora todo youtuber ha realizado su propia parodia, y resulta muy divertido escoger de entre tantas las interpretaciones más divertidas.

Estos son mis top 10, disfrútenlos y coméntenlos:

10. Laundry Edition

http://youtu.be/pbhskUXZIIk

9. Mate1.com Edition

http://youtu.be/FvOw4SEhTaY

8. Office Edition (Maker Studios)

http://www.youtube.com/embed/0IJoKuTlvuM

7. Call of Duty Edition

https://www.youtube.com/watch?feature=player_embedded&v=3AjtMp5whww#!

6. Fifth Avenue Edition

http://youtu.be/XFo5vZdGn4U

5. Plátano terrorista

http://www.youtube.com/embed/SItm0NC0gG0

4. Montreal Subway

http://youtu.be/j7-lGJ0yq9k

3. Que vengan los bomberos

http://www.youtube.com/embed/YETVpKSgV5U

2. feat Snoopy

http://www.youtube.com/embed/wqZc2dyClko

1. Norvegian Army Edition

http://www.youtube.com/watch?feature=player_embedded&v=4hpEnLtqUDg