Las 11 etapas del Desarrollador Web ilustradas con memes

La vida o carrera profesional de un Desarrollador Web no es fácil, al igual que todas tiene sus aciertos, problemas, frustaciones pero también éxitos, iluminaciones y logros personales que se van cumpliendo a lo largo de toda la vida, desde los inicios donde todo es nuevo pero excitante hasta cuando te conviertes en un Ninja de los lenguajes web y aún así, todavía te parecen interesantes.

Etapa 1 – Noob

noob-o

Le etapa por la que todos pasamos en todos los conocimientos que ha desarrollado la humanidad, porque como siempre he escuchado: nadie nació aprendido. En esta etapa cada nueva línea de código es confusa y no sabes exactamente lo que estás haciendo pero lo haces y continuas aprendiendo porque es lo que disfrutas.

Etapa 2 – Los primeros pasos

1248951765_kitten-mittens

Mientras en la primera etapa siempre te estás preguntando ¿Por dónde empiezo? en esta etapa ya se tiene un poco más de conocimiento y sabes que camino seguir. Empiezas a desarrollar tus habilidades como desarrollador, haces cambios de CSS que no estás muy seguro pero lo haces y cuando le das F5 al navegador notas el cambio y sientes lo genial que funciona la Web.

Etapa 3 – Completa frustración

1291664255_obama-kiks-door-open

La Web es inmensa, tanto en contenido, texto, imágenes, vídeo y demás así como en los lenguajes de programación y de marcado. Te puedes pasar en esta etapa mucho tiempo leyendo libros técnicos de todos los tipos una y otra vez, lo que te puede llevar a una frustración debido a la inmensa variedad que existe, lo bueno es que aprenderás de la forma correcta como hacer las cosas, lo malo es que te puede tomar demasiado tiempo.

Etapa 4 – Los momentos Yeah!

1269259657_omg_cat

Los mejores momentos que se pueden tener cuando se está aprendiendo cualquier conocimiento. Son esos momentos donde te das cuenta como funcionan las cosas, como están conectadas y sabes porque se comportan así. En está etapa empiezan a conectarse los puntos de todo lo leíste en los libros técnicos y de especificaciones.

Etapa 5 – Código delicado

1238064149_bubble

Es una etapa larga al igual que sus predecesoras, en esta etapa ya estás creando proyectos y aplicaciones que cumplen con los requerimientos y las metas o objetivos propuestos. Tus métodos y funciones tienen decenas de líneas de código que pueden ser optimizadas y refinadas.

No te preocupes, al menos ya estás creando código que funciona.

Etapa 6 – Imitador

1257979618_risky-business

Aunque el nombre suene un poco mal, para nada lo es. Es una etapa importante, porque imitar y ver lo que hacen otros desarrolladores estrellas es una buena forma de mejorar tus habilidades. Recuerda que «Los grandes artistas copian, los genios roban», no debes sentirte mal haciéndolo, eventualmente imitar a los que llevan años programando no te llevará muy lejos si te quedas haciéndolo siempre, con el tiempo aprenderás y desarrollarás tu propio estilo.

Etapa 7 – Engreído

15g6454656

En este punto ya tienes un poco más de conocimiento y empiezas a ver a otros desarrolladores por encima del hombro, pero no te das cuenta todavía de lo pequeño que eres con respecto al mundo.

Evita decir comentarios del tipo: «Aprender a programar, noob» no hace poco tu también eras uno de ellos y sabes el difícil camino por el cuál subiste para llegar hasta acá, ser engreído o arrogante no es beneficioso para nadie, lo mejor es que sigas aprendiendo y ayudes a los que vienen detrás de ti.

Etapa 8 – Aprendiendo Vim

1290708698_magic-chair

¿Algunas ves has visto a otros desarrolladores web utilizar su editor de código como Dioses? Bueno, probablemente este utilizando Vim, aunque al principio se sienta muy difícil y lo veas como algo que no tiene nada que ver con la Web luego notarás el increíble poder que tienes cuando aprendes a utilizar de la forma correcta todas sus capacidades.

En esta fase ya tienes un estilo de programación definido, pero combinado con tu capacidad de manejar tu editor de código te hará ver como un mago ante la consola y el teclado. Saber utilizar las herramientas es tan importante como las técnicas de programación.

Etapa 9 – Código digno de arte

1278414923_coraline-vs-puppeteer

Ves tú código luego de cientos de horas de programación y te parece lo más hermoso del mundo, la definición, la estructura, la identación, tu estilo hecho arte. Tu código cumple con estándares, normas, está versionado, es escalable y testeable.

Pero utilizar técnicas rebuscadas, confusas o complicadas para hacer algo no son signos de que eres un programador maduro, tampoco lo es reducir toda la lógica a una solo línea de código. En realidad es un signo de que eres un desarrollador engreído y no quieres que tu código no sea leído o mantenido por nadie más en el futuro.

Un código es digno de arte cuando su legibilidad es fácilmente tan importante para ti como el problema que resuelve. En esta etapa, tú código es para humanos, no para maquinas.

Etapa 10 – Destreza

1305563147_evan-longorias-amazing-baseball-catch

Cuando programar se convierte en un instinto has alcanzado la siguiente etapa de tu carrera. Ya no piensas en términos de lenguajes o frameworks. En esta etapa simplemente ves los problemas y sabes que lenguaje utilizar de todos los que conoces para darle solución. Un desarrollador experimentado entiende porque el camino sencillo es rara vez la mejor ruta. Cada nueva funcionalidad es discutida con todos los miembros del equipo, se escribes los requerimientos, las historias de usuario y son generados pruebas…todo esto sin escribir una solo línea de código.

Ahora eres un desarrollador experimentado y serio con el cual otros desarrolladores desean trabajar. Felicitaciones.

Etapa 11 – Heroe / Rock star

1243419788_bakflip-basketball-trick

Pocos alcanzan este nivel. La etapa de estrella de rock en el punto más alta de la montaña que sugiere la curva de aprendizaje en esta carrera. Además de tu trabajo regular, ocasionalmente das charlas en conferencias de desarrolladores, participas más en proyectos de escala mundial, contribuyes en listas de correo a crear nuevos estándares o herramientas para programar.

Ahora eres a los que el resto se refiere como Heroe o Ninja.

Solo tu conoces el largo largo camino que se debe recorrer para llegar hasta acá.

Artículo creado originalmente por Jeffrey Way, publicado en Nettuts+

 







Browserhacks: Encuentra la solución a problemas de CSS en todos los navegadores

3-13-2013 7-44-36 PM

La Web en su filosofía de ser abierta, compatible y disponible para todos a veces supone un buen dolor de cabeza para los desarrolladores quienes muchas veces (por no decir siempre) nos encontramos con problemas de compatibilidad entre los navegadores, creaste algo genial, funciona y se ve bien, corre rápido, pero cuando vas a probarlo en otro navegador es un desastre total, no es de la quinta parte de como se ve y se comporta en el otro navegador.

Encontrar las soluciones a estos problemas de compatibilidad no es nada fácil, muchas veces no sabes ni que utilizar para solventarlos, pero ahora te será más fácil con Browserhacks, una colección de hacks y trucos de CSS y Javascript que te permitirán resolver mucho más rápido los diarios problemas que surgen cuando se está desarrollando para la Web.

Tienen trucos para todos los navegadores, Chrome, Firefox, Internet Explorer, Opera y Safari, resalto Internet Explorer porque como bien sabemos es el que más problemas da, menos mal Microsoft lo ha hecho más compatible y actualizado en las últimas versiones, para utilizar un Hack solo basta copiar y pegarlo en tu hoja de estilo o archivo de Javascript y ya esta.

Browserhack

Vía: Kabytes

Comparación de frameworks CSS

Frameworks CSS

Si eres un desarrollador frontend conoces de primera mano que existen en el mercado una basta variedad de Frameworks para todo, des de maquetación, grids, animaciones, funcionalidad específicas y muchos otros.

Existen tantos que decidirse por alguno puede ser una tarea que toma días en resolver, muchos sitios tiene opiniones muy variadas y diferentes,  a veces crees que encontraste el indicado pero luego surge uno perfecto que soluciona todas las necesidades que tienes para empezar el proyecto que tienes en mente.

Por ello te presento hoy CSS Frontend Frameworks un sitio web creado por usabli.ca, un grupo de desarrolladores independientes que crean aplicaciones y productos con alta usabilidad, el sitio muestra la comparación de más de 30 frameworks diferentes, entre la información que utilizan para compararlos está la compatibilidad con las versiones de los navegadores más usados, Chrome, Firefox, Safari, Opera e Internet Explorera, el lenguaje dinámico que utilizan para su creación, si es Responsive, es decir, si está creado de tal forma que el sitio web que lo utilice se puede ver correctamente en móviles y tablets, la licencia bajo la cual es ofrecido y por último un pequeño texto descriptivo del Framework.

CSS Frontend Frameworks comparison

Aprende jQuery paso a paso con tryjQuery

3-6-2013 5-03-16 PM

jQuery es una librería gratuita de JavaScript que facilita muchísimo el trabajo al momento de trabajar con el HTML de páginas web y la más popular en el mundo JavaScript, su slogan es «Escribe menos, haz más» y lo cumple al pie de la letra, tiene métodos, funciones y una sintaxis que mejora el rendimiento del trabajo cuando trabajar con HTML se trate, permite crear animaciones, manejar eventos, crear plugins para la librería y especialmente, crear aplicaciones AJAX.

Aunque la librería y los métodos son expresivos, fáciles de usar y con una documentación completa y extensa nunca está de más tener a mano un buen tutorial práctico para comprender mejor su uso, para ello existe tryjQuery, un sitio web creado por CodeSchool y jQuery para ayudarte paso a paso y de una manera muy práctica conocer jQuery a través de vídeos, una consola interactiva en la cual puedes escribir código jQuery directamente en el navegador.

Se empieza por supuesto desde lo más básico, como seleccionar elementos del DOM y progresivamente aumenta el nivel de dificulta al manejo de eventos y cambios en el estilo del HTML, está pensado lanzar la versión número 2 del curso/tutorial con temas más avanzados en algunas semanas.

Aprende jQuery: tryjQuery

Aprende Git Branching online y de forma gratuita

2-24-2013 12-24-26 PM

Git es un sistema de control de versiones gratuito creado para manejar todo tipo de proyectos sin importar su tamaño de una manera simple y efectiva, Git viene a reemplazar al protocolo FTP al momento de actualizar el código en los servidores de producción, ahora no tienes que esperar mucho tiempo a que termine de subir todos los cambios que existe en Local al servidor, con Git solo basta con hacer un push al servidor y ya está.

Git es más rápido y eficiente que SVN, otro sistema de control de versiones, gracias al diseño que plantea, fue creado por Linus Torvalds, el creador de Linux, Git plantea el uso de ramas o branchs para el manejo de las versiones del código fuente, es decir, cada branch o rama puede ser una funcionalidad nueva o el arreglo de algún fallo en el software, las cuáles son ramas del tronco principal, esto permite hacer un versionado rápido y sobretodo muy eficiente al código.

El concepto de branchs y versionado no es tan fácil de asimilar, por eso hoy les presento Learn Git Branching, un sitio web totalmente interactivo que te explica paso a paso como se hace de una manera correcta versiones de software utilizando Git, luego de tener una pequeña introducción, puedes empezar a seguir la clase teniendo la posibilidad de introducir comando reales de git directamente en el navegador mientras ves al lado derecho de la pantalla un gráfico que muestra la evolución de las versiones que estás realizando, luego de hacer los primeros 5 tutoriales y aprender lo básico de git puedes seguir con la parte avanzada, donde tienes algunos retos para versionar correctamente un software utilizando lo antes aprendido.

Learn Git Branching

La lista de chequeo definitiva para los desarrolladores Web

1-29-2013 1-28-13 PM

Cuando estamos creando una aplicación o sitio para la Web hay algunas cosas o puntos importantes que son esenciales para que la aplicación tenga un éxito garantizado, la mayoría de estos requisitos son esenciales y cada uno de nosotros obligatoriamente debe conocerlos como la etiqueta <title> o comprobar la validez del HTML y el CSS escrito de toda la aplicación, aún así hay cosas que se nos pueden escapar como una página 404 personalizada.

Web Developer Checklist contiene una lista de 40 características o funcionalidades que debe tener una aplicación o sitio web cuando esté finalizado las cuales puedes ir marcando mientras avanzas en el proyecto. Cada una de ellas están clasificadas de acuerdo a un tema específico como Móvil, Usabilidad, Estadísticas, Rendimiento, SEO, Calidad del código, Semántica, Accesibilidad, Seguridad y opcionales, cada característica contiene enlaces a aplicaciones o herramientas externas que te ofrecen ayuda y más información sobre dicha característica.

Web Developer Checklist

Los diferentes tipos de programadores

No todos programamos igual, algunos les gusta hacerlo de forma rápida, otras de la manera más correcta, casi religiosa y otros están en la mitad, pero todos nos gusta hacerlo y lo disfrutamos, mientras otros programan por hacerlo, por el trabajo, no les apasiona ni mucho menos lo disfrutan.

Bueno, a continuación les presento los 5 tipos de programadores más comunes que existen:

Programador parchador

Puede que el código no sea lindo, pero maldición, ¡funciona!

Este tipo es la base de tu empresa. Cuando algo falla, él lo arreglará rápido y de manera que no volverá a romperse. Por supuesto no le importa cómo se vea, la facilidad de uso, ni ningún otra de esas preocupaciones triviales, pero lo hará pasar, sin mucha chara o tonterías que hagan perder el tiempo. La mejor forma de usar esta persona es apuntarlo a un problema y alejarse.

Programador perfeccionista

¿Que le querés hacer qué a mi código?

Es el tipo al que no le importan las fechas límite o presupuestos, eso es insignificante cuando se compara con la forma de arte que es la programación. Cuando finalmente recibes el producto terminado no tendrás otra opción que someterte a la impresionante gloria y radiante belleza del código perfectamente formateado, no, perfectamente bello, que es tan eficiente que cualquier cosa que quisieras hacerle no haría más que difamar una obra maestra. Es el único calificado para trabajar en su código.

Programador anti-programador

Soy un programador, maldición. Yo no escribo código.

Su mundo tiene una simple verdad; escribir código es malo. Si tienes que escribir algo entonces lo estás haciendo mal. Alguien más ya ha hecho el trabajo así que simplemente utiliza su código. Te dirá cuánto mas rápida es su práctica de desarrollo, aunque le lleva tanto tiempo  o más que a los demás programadores. Pero cuando obtengas el proyecto serán solo 20 líneas de código actual y será muy fácil de leer. Puede no ser muy rápido, eficiente, o compatible hacia adelante, pero estará hecho con el menor esfuerzo requerido.

Programador a medias

¿Qué quieres? Funciona, ¿no?

El tipo al que no podría importarle menos la calidad, eso es trabajo de otra persona. Logra las tareas que le piden hacer, rápido. Puede no gustarte su trabajo, los otros programadores lo odian, pero la gerencia y los clientes lo aman. Por más dolor que te cause en el futuro, él sin ayuda es quien mantiene las fechas límites así que no puedes burlarte (no importa cuánto quieras hacerlo).

Programador en la teoría

Bueno, eso es una posibilidad, pero en la práctica esto puede ser una alternativa mejor.

Este tipo está mas interesado en las opiniones que en lo que se debería hacer. Pasará el 80% del tiempo mirando en blanco su computadora pensando maneras de lograr una tarea, 15% de su tiempo quejándose de fechas límite irrazonables, 4% de su tiempo refinando las opciones, y 1% de su tiempo escribiendo código. Cuando recibas el trabajo final siempre será acompañado por la frase “Si tuviera más tiempo podría haber hecho esto de la manera correcta”.

 

También me encontré con una reflexión sobre Los dos tipos de programadores

 

Hay dos “clases” de programadores en el mundo del desarrollo del software: voy a llamarlos el 20% y el 80%. Los tipos del 20% son lo que se llamarían programadores “alfa” – los líderes, el tipo que lugares como Google y Fog Creek Software buscan contratar desesperadamente. Éstos tipos fueron los primeros en instalar Linux en su casa en los 90´s; la gente que escribe compiladores en Lisp y aprende Haskell los fines de semana “por diversión”; participan activamente en proyectos open source; siempre están al tanto de las últimas, y más frescas tendencias en la programación y herramientas.

Los tipos del 80% hacen el bulto de la industria del desarrollo de software. No son estúpidos; son meramente vocacionales. Fueron a la escuela, aprendieron suficiente Java/C#/C++, luego obtuvieron un trabajo escribiendo aplicaciones internas para bancos, gobiernos, firmas de viajes, firmas legales, etc. El mundo usualmente ni ve su software. Usan cualquier herramienta que les provee Microsoft — usualmente VS.NET si están en C++, o capaz un GUI IDE como Eclipse o IntelliJ para desarrollar en Java. Nunca han usado Linux, y no están muy interesados en él de todas formas. Muchos nunca han usado siquiera control de versiones. Si lo han hecho, es con cualquier herramienta entregada con la caja Microsoft (como SourceSafe), o alguna cosa antigua que le hayan entregado. Saben exactamente lo suficiente para hacer su trabajo, luego se van los fines de semana a casa y se olvidan de las computadoras.”

 

Por último les dejo un cómic que también intenta darle una clasificación a los programadores.
Programadores-560x1024

 

 

¿Y tú con cuál tipo te sientes identificado?

 

5 tipos de programadores en PicandoCódigo. Original por Steven Benner

Distintos tipos de programadores en Viviendo entre Pingüinos. Original por IBanjo

Cómic en Mi Vida con GNU/Linux. Original por Sinergia sin Control

Aprende a programar en Javascript, CSS3, HTML5, Ruby y PHP en español con Programando.la

1-18-2013 9-11-56 PM

Aprender a programar es ahora más fácil que nunca, solo basta con las ganas de hacerlo para lograrlo y convertirte en un experto del lenguaje que aprendas.

En los últimos años han surgido plataformas web con el único objetivo de enseñarte a programar en algún lenguaje, principalmente lenguajes web como HTML5, CSS3, Ruby o JavaScript, pero estas plataformas por desgracia o afortunadamente, están en Inglés, afortunadamente ya existe Programando.la, un sitio web que recopila más de 100 vídeos tutoriales completamente en español sobre diversos lenguajes como HTML5, JavaScript, CSS3, Python, PHP, Java, Ruby, Ruby on Rails y C++, el sitio además cuenta con un listado de documentos en inglés con tutoriales y especificaciones de los lenguajes.

Programando.la

 

Extensionizr: Crea tu extensión para Google Chrome en segundos

Extensionizr

Si eres desarrollador de extensiones para Google Chrome Extesionizr es perfecto para ti.

Extensionizr te permite crear fácilmente en segundos, una plantilla personalizable para empezar con tu extensión de Google Chrome, viene con muchas opciones de configuración, puedes seleccionar si será una extensión oculta, una página o una acción sobre el navegador, el tipo de página que tendrá la extensión, si la extensión tendrá una página de configuración, añadir las URL sobre las que la extensión necesitará permisos y por último permite seleccionar los permisos que necesitará la extensión sobre el navegador, como los marcadores, el historial, pestañas entre otras.

Una vez tengas todas las opciones que necesites podrás descargar un archivo comprimido que viene con todo listo para seguir desarrollando tu extensión.

Extensionizr

¿Qué es SQL Injection?

Las aplicaciones o sitios web funcionan gracias a bases de datos encargadas de almacenar toda la información con la que interactuamos a diario, gran parte de esta información es creada por nosotros, los usuarios, a través de formularios principalmente, los datos de estos formularios son guardados gracias a consultas de SQL que se encargan de recoger la información y guardarla de forma correcta en la base de datos.

SQL Injection es una técnica de infiltración de código que se aprovecha de la no validación del ingreso de los datos en los formularios para insertar código SQL y de esta forma afectar negativamente los datos en la base de datos. En la siguiente infografía pueden encontrar como evitar esta vulnerabilidad y las soluciones para tener una aplicación web completamente segura.