Las principales herramientas de un programador Web

Cuando pensamos en las herramientas que sirven a un programador Web, normalmente nos referimos a todas aquellas app o software que gestionan el test, el debugging y el lanzamiento del sitio web creado.

Sin embargo la terminología tools no se refiere solo a las aplicaciones que consienten hacer todo lo mencionado anteriormente. Sobre todo para el programador Web que a menudo utiliza instrumentos específicos para el diseño como Figma y para el team work como Slack o Teams, por no hablar de los foros donde poderse enfrentar para encontrar soluciones a los problemas como el famoso StackOverflow. 

Por esta razón enumeraré una serie de herramientas que considero necesarias para un programador Web, para dar una visión real de un workflow genuino.

Algunos de ellos te resultarán familiares mientras que otros podrían entrar en tu stack de herramientas diarias. 

¿Qué tener en cuenta a la hora de elegir herramientas de desarrollo web? 

Cuando se empieza con el desarrollo de un proyecto empezando desde cero o adentrándose cuando ya se ha empezado, es necesario considerar que todas las herramientas que conocemos podrían no funcionar y ser eficaces para esta nueva aplicación.

Un buen programador tiene siempre que investigar y profundizar en lo que necesita y las formas de usarlo, obviamente estarán siempre las herramientas preferidas y fijas, pero el concepto es que el propio stack tecnológico no tiene que ser nunca estático.

La pregunta existencial es siempre: ¿Qué herramienta hace que mi trabajo sea más fácil y eficaz?

Algunos conceptos a tener en consideración para responder a esta pregunta podrían ser:

• Escalabilidad: la herramienta debe ser usable de la misma manera tanto cuando el proyecto es pequeño como cuando va a crecer considerablemente.  
• Seguridad: Cuando se comparten herramientas de trabajo y datos sensibles, el equipo y la empresa tienen que saber trabajar siempre con absoluta seguridad.
• Facilidad de uso: La herramienta tiene que simplificar el trabajo y no complicarlo.
• Portabilidad: El programador Web a menudo trabaja desde casa o en la oficina, la herramienta tiene que permitir poder trabajar dinámicamente desde cualquier sitio, garantizando los mismos estándares de uso.
• Funcionalidad: ¿la herramienta aporta efectivamente un valor añadido? Mejorará algunas proceduras simplificando o acelerando el trabajo del programador? 

Entonces, ¿qué herramientas usar?

Para simplificar, me gustaría dividir las diferentes herramientas en diferentes categorías y luego dar ejemplos para cada categoría.¡Empecemos!

Categorias: 

• Code y Text Editors
• Web Frameworks
• Git y algunos de sus client
• Package Managers
• Tools para el trabajo en equipo
• Design y creación de prototipos 

1. Code y Text Editors

Un editor es una de las herramientas indispensables para poder desarrollar de manera eficaz el trabajo de un programador Web.

Cuando un programador encuentra los editor que más le gustan, por lo general tienden a no cambiarlo por mucho tiempo, de hecho esta es una de las herramientas obligatorias en este trabajo, un poco como el set de herramientas de un fontanero o carpintero.

No es negativo usar siempre el mismo editor, de hecho si tiene las funciones más famosas disponibles y se encuentra cómodo, ¿por qué cambiarlo?

Entre los editores más famosos y utilizados encontramos: 

Visual Studio Code

Visual Studio Code desarrollado por Microsoft para ser utilizado en Windows, Linux y MacOs. Permite hacer tantísimas cosas entre las cuales el debugging y el uso de los comandos GIT de manera avanzada; permitiendo una amplia personalización, instalando las extensiones necesarias de vez en cuando.

Sublime Text

Sublime Text es uno de los más famosos Text editor. Incluso si no ofrecen las mismas funciones que otros editores competidores, garantiza la facilidad de uso, una óptima interfaz gráfica y la ligereza del software.

Webstorm

Webstorm es el IDE que utilizo todos los días y sin dudarlo mi preferido. Ofrece una gran cantidad de características de desarrollo y no tiene nada que envidiar a todos los demás competidores, al tiempo que cuenta con una mayor estabilidad. La única pega es que requiere el pago de una licencia anual, característica que puede alejar a muchos usuarios.

2. Web Frameworks

Los Web Frameworks o simplemente Framework son los software creados para facilitar el desarrollo de aplicaciones o servicios Web. Es necesario elegir con cuidado el framework que se utilizará, ya que a menudo resulta costoso cambiar las elecciones realizadas en el curso del trabajo.

Algunos de los Web framework más famosos son:

1. Laravel, el framework en PHP actualmente más popular y famoso, creado en el 2011 por Taylor Otwell. 

Laravel simplifica algunas de las actividades más comunes de los proyectos web, como autenticación, autorización, routing, sesiones, almacenamiento en caché. Posee además un motor de plantillas integrado, Blade, un sistema de migración de base de datos, integración con PHPUnit para pruebas y su propia interfaz de líneas de comando, llamadas Artisan CLI.

Desde hace unos años se sigue considerando como el framework de referencia para muchas empresas, tanto grandes como pequeñas.

2. Django, podemos definirlo como el equivalente de Laravel, escrito en Python. También Django cuenta con un conjunto avanzado de funciones para desarrollar aplicaciones Web ofreciendo como Laravel una gran comunidad de seguidores.

3. Angular, es un Framework JavaScript creado por Google, caracterizado por un sólido ecosistema de bibliotecas; a diferencia de sus competidores, es el que tiene una curva de aprendizaje más lenta. Esto lo hace menos atractivo menos atractivo para aquellos que buscan una solución más rápida de usar.

4. React, es una biblioteca JavaScript creada por Facebook para facilitar el desarrollo Frontend. Caracterizada esta también por un sólido ecosistema de bibliotecas de terceros u oficiales y de una comunidad muy activa.

Por el momento React es una de las bibliotecas JavaScript más populares y usadas en el mundo junto a Vue.js

5. Vue.js, junto con React, ahora está compitiendo en el podio entre las bibliotecas de JavaScript más utilizadas en el mundo, etiquetándose como una alternativa más accesible y versátil respecto a los otros frameworks. Como sus competidores, también Vue.js usa un sistema de división de componentes, dividiendo la aplicación en pequeñas piezas de código reutilizables. También Vue.js cuenta con una excelente comunidad y un próspero ecosistema de bibliotecas y funciones. Además está integrado de forma nativa en cualquier proyecto desarrollado con Laravel.

 

Laravel

3. Git y algunos de sus Client

Git es seguramente el sistema de control versión (VCS) más popular en el mundo. Este software permite a varios desarrolladores colaborar en la producción de un proyecto contemporáneamente. Cada modificación efectuada por uno de los desarrolladores está controlada por un Commit. Además Gif permite crear diversas versiones del software, a través del uso de las ramas de desarrollo, cada una de ellas tendrá sus propios commit. Estas ramas de desarrollo podrían también ser independientes entre ellas.

Gif es un instrumento esencial para cualquier desarrollador Web y no solo, conocerlo permite a cualquiera poder trabajar en cualquier equipo en cualquier parte del mundo.

Al principio Gif fué distribuido y utilizado a través de líneas de comando pero con el paso del tiempo han sido desarrollados otros software que simplifican más aún su uso, exponiendo sus funcionalidades a través de una interfaz visible más intuitiva y simple.

Algunos de los client más difundidos son:

• GitHub Desktop
• GitKraken
• SourceTree

Una lista completa de otros client para Gif la podéis encontrar en este LINK oficial.

GitHub Desktop

 

4. Package Managers 

Los proyectos que desarrollamos dependen siempre más de componentes externos, como por ejemplo los script provenientes del mundo open source o de las librerías, que servicios como Amazon AWS o Google API ponen a disposición gratis para integrar nuestros proyectos con los servicios que ofrecen. Añadir estas bibliotecas a los proyectos, actualizarlas constantemente o eliminarlas con facilidad puede revelarse más tedioso de lo previsto, siempre y cuando sea mejor estar focalizados en el proyecto en sí mismo que todo lo que lo rodea.

Por este motivo han sido inventados los Package Managers, de los tool que permiten las gestiones de todas estas dependencias con extrema facilidad.

Cada lenguaje tiene Package Managers de referencia, como por ejemplo PHP usa Composer. 

Por lo que concierne al mundo JavaScript encontramos principalmente dos: NPM y Yarn. El primero fue creado para ayudar el aterrizaje de NodeJs en el 2009, el segundo fue creado por Facebook.

Como podéis imaginar cualquier desarrollador Web que se aprecie tiene que conocer y utilizar estos package managers.

Logo NPM

5. Tools para el trabajo en equipo

Hasta ahora he hablado de muchos tool técnicos para un programador Web, pero si tu trabajas en una empresa o como autónomo existen otros tool esenciales a la par de un IDE o de un Framework de referencia. Estoy hablando de todas estas herramientas para el trabajo en equipo que permiten comunicar y estar actualizados constantemente.

Como decía, estos programas extremadamente importantes, algunos de los más famosos son:

• Jira, el ideal para planificar, monitorear y liberar el software. Mientras gestiona los sprint y la creación de los ticket. Actualmente es una de las plataformas más utilizadas por las empresas.
• Slack, es una plataforma de mensajería de grupo. Reduce la necesidad de e-mail separando las conversaciones en canales distintos, en modo tal de poder tener un seguimiento de los argumentos, ideas y proyectos sin largas cadenas de correo electrónico. Esto convierte a Slack como la sede virtual del team.
• Microsoft Teams, como Slack, ofrece una lista completa de funcionalidades que ayudarán a vuestro equipo a colaborar y a producir más. La elección entre uno u otro dependerá de las diferencias de precio, di budget y de las elecciones empresariales.

 

6. Design y creación de prototipos

No es suficiente solo con saber programar. Gran parte de un programador web es entender lo que hay detrás de una buena proyección de la interfaz del usuario y de la experiencia del usuario, de prototipos a la creación de un lenguaje visible para tu aplicación. Estos instrumentos de proyección son extremadamente importantes.

Entre los tool de creación de prototipos más famosos encontramos Figma, AdobeXD y Sketch. 

Figma es completamente gratis y ofrece todo aquello que te sirve para poder programar interfaces y prototipos además de accesible desde cualquier buscador. AdobeXD es otro excelente tool a la par de Figma, con la diferencia que opera mejor con todos los demás programas de la suite Adobe.

Sketch está a la par de Figma, la diferencia es que Sketch requiere la adquisición de una Licencia para un uso profesional y además es más estable desde un punto de vista del uso cotidiano.

 

 

Seguramente, habrás oído hablar de muchos de ellos ya que son muy populares. Sin embargo, si eres un programador novato y quizás acabas de terminar una formación, podrías encontrar útil profundizar los tool necesarios para trabajar en equipo.

Trabajar bien en equipo significa a menudo ser productivos y por consiguiente crecer más.