El mundo del programador

Hace unos años, cuando una página web tan sólo contenia codigo HTML, una sola persona conocida como webmaster podía encargarse de todo. Pero todo ha cambiado, las webs y la forma de gestionarlas ha evolucionado mucho, ahora no se trata tan solo de hacer páginas webs estáticas sino en aplicaciones web que se adaptan a todo tipo de dispositivos y que interactuan con el usuario a distintos niveles.
PiecesSlider

Ahora bien, un proyecto web esta dividido principalmente en dos capas, el Front-End (que es lo que el usuario ve) y el Back-End (la tecnología que hay en una capa detrás) complementadas con un buen diseño capaz de ofrecer una buena usabilidad y una eficiente arquitectura de la información, es decir la base de datos.

Back End

Es la capa que se encarga de procesar la información que llega del usuario, ya sea para almacenarla en base de datos o devolverla al usuario. Detrás de esto se encuentra el software de la aplicación, el servidor que la maneja y la base de datos que la almacena. Los lenguajes de programación que existen en esta parte son:

Los 3 últimos son los más utilizados hoy en día en las principales Startups y aplicaciones web, pero no funcionan solos, tienen con ellos poderosos frameworks y extensiones que los hacen más manejables y productivos.

La información o datos que manejan las aplicaciones normalmente es almacenada en una base de datos. Existen dos tipos: Relacionales en las que unas tablas están relacionadas con otras a través de una clave. Y no relacionales (NoSQL) que guardan los datos en documentos y para ciertas aplicaciones son más rápidas

Front End

El Front-End es le aparece al usuario en pantalla, la parte visual de una aplicación o proyecto web. Antiguamente se limitaba a la maquetación de un sitio con HTML, se le añadia estilo con CSS y alguna animación o efecto con JavaScript. Pero eso paso a la historia, ahora tenemos aplicaciones web que funcionan enteramente en el navegador y únicamente reciben datos desde un API en formato JSON a través de AJAX o WebSockets.

Las tecnologías que operan en esta parte son:

  • HTML5, aporta semántica al contenido y estructura la información
  • CSS3, maqueta la información y diseña
  • JavaScript, permite la programación en el cliente y su conexión con el servidor, maneja el DOM, añade interacción, etc

Por supuesto exiten herramientas para el Front-End:

Diseño, Experiencia de Usuario y Usabilidad (UI/UX)

Con el avance del Front-End, ahora el diseño y la interacción con los usuarios ocupan una nueva especialidad. En esta parte se tocan cosas como:

Arquitectura de Información

El contenido en la web actual no es estático, está generado en su mayor parte por los usuarios y ellos interaccionan entre ellos. Hay que saber estructurarlo, como redactarlo, como presentarlo. En esta parte entra el SEO (Search Engine Optimization), la estrategia digital de la marca/proyecto (Inbound Marketing, Outbund Marketing) y el Social Media.

Y eso es en resumen las partes más importantes y roles que conlleva un proyecto web hoy en día. Lo recomendable es especializarse en lo que más te guste pero saber un poco de todo para tener una visión general del proyecto.

Herramientas para programar

Os voy a exponer algunas de las herramientas que utilizo como desarrollador web y que me facilitan bastante la productividad.

  • Editor de texto: Sublime Text 2, Multiplataforma. Escrito en Python. Muy rápido, y ligero. Contiene numerosos paquetes y funcionalidades que lo hacen ser EL EDITOR. Bien es cierto que si programas en Objective-C te es más útil XCode, y si lo haces para Android te sea mejor (aunque sea un dolor) utilizar Eclipse. Pero si te dedicas al desarrollo web, es lo mejor.

  • Cliente FTP: Cyberduck, para Mac. Tiene una UI agradable y permite conexiones SFTP con archivos de clave secreta. Ideal si quieres acceder a un servidor creador en AWS.

  • Navegador Web: Google Chrome. Es mi navegador por defecto. Hace tiempo usaba Firefox por su consola firebug para depurar, pero ahora con chrome se puede hacer lo mismo gracias a sus extensiones de las que hablará más adelante en otra entrada

  • Servidor Web local: XAMPP. Multiplaforma, ideal para montar un servidor Apache + PHP + MySQL local en pocos minutos. Incluye phpmyAdmin para gestionar la base de datos. Si tu proyecto utiliza alguna de estas tecnologías te lo recomiendo.

  • Comunicación: Utilizo varios:

    • Skype para conversaciones con una sola persona, normalmente para trabajos freelance con clientes extranjeros, son la mejor herramienta.
    • Hangouts si son con varias personas y puedes compartir escritorio,
  • Gestor de tareas: Trello. Básico y muy simple pero muy útil. Multidispositivo

  • Repositorios y control de versiones

  • Tratamiento de imágenes:
    Photoshop CS6

  • Manejo de archivos

    • Dropbox, genial para compartir documentos e imágenes entre miembros del equipo
    • Google Drive, perfecto para guardar ideas, escribir documentación y modificar en linea con otros miembros del equipo. Te olvidas de tener documentos en tu ordenador con mútltiples versiones. A si los tienes siempre a mano y en cualquier dispositvo y cuando quieras (siempre que tengas conexión a mano).
  • Diseño de Mockups y Wireframes:
    Moqups: Excelente herramienta para realizar Mockups de una manera sencilla y rápida, se integra con Google Drive.

  • Virtualización: Parallels 8, De pago. Funciona realmente bien en Mac. Suelo tener alguna distribución Linux (Ubuntu) y copia de Windows XP para probar rarezas.

¿Para qué programar?

Cuando no estoy trabajando en la oficina o haciendo encargos freelance me gusta trastear con otras tecnologías y lenguajes que no suelo utilizar. Voy a exponer algunos mótivos por los que desarrollar proyectos propios puede acabar siendo rentable en muchos aspectos:

Es divertido

No hay nada cómo poder trabajar para uno mismo. Tu planificas tus horarios, nadie te supervisa, creas algo a tu gusto, tu decides que detalles son importantes y cuales no. Es una buena manera de probarse a uno mismo y conocer nuevas áreas.

Aprendes

¿Cuál es la mejor forma de aprender una tecnología nueva como pueden ser Node? ¿O usar una base de datos que no has usado nunca? En un proyecto de consultoría tradicional de traje y corbata ya te adelanto que no será. Prueba a hacer un “hola mundo” en un lenguaje que no conozcas, después amplíalo, descubre que puedes hacer con esa nueva plataforma, lee documentación, etc. En definitiva: juega.

Ganas experiencia

Imagina que al poco de haber hecho un pequeño proyecto en un lenguaje que hace unos meses ni conozcas, aparece ante tí una oferta de trabajo (ya sea freelance o contratado) ¡Ya tienes el primer paso dado! Sin apenas darte cuenta has ganado experiencia. Puede que an no seas experto, pero con el tiempo irás mejorando.

Amplías portafolio

Hoy en día da igual que tengas 2 carreras, 3 máster y 40 certificados. Incluso me atrevería a decir que ni siquiera que hayas trabajado X años en una empresa pueda servir dentro de un tiempo. Ahora prima más lo quá has hecho o sabes hacer qué lo que has estudiado. Ahora la gente quiere algo visible para saber si eres la persona que necesitan.

Si haces un diseño, súbelo a Dribbble, si haces código, súbelo a GitHub. Estos portales son ahora tanto o más importantes que un buen perfil en Linkedin.

Esa es una de las razones por las que mi colega Jorge y yo desarrollamos Pelitweets. No tenemos modelo de negocio definido y no esperamos ganar dinero por ahora. Después de un tiempo trabajando para empresas o clientes privados, tienes trabajo hecho que no puedes enseñar por contrato u otras razones y de esta manera amplias tu portafolio.

Consigues clientes o trabajo

Cuando te inscribes a una oferta o te contacta alguien y te pide un portafolio, ahora ya tienes algo que poder enseñar, tuyo 100%. Es una manera de probar tanto tus conocimientos técnicos como tus habilidades. Has invertido tiempo en desarrollar tu proyecto, pero esa inversión puede verse amortizada con una buena oferta posterior.

Por eso os animo a que invirtáis vuestro tiempo libre en aprender cosas nuevas y realizar pequeños proyectos propios, nunca se sabe quién puede estar al otro lado viendo tu trabajo.

Tagged with:

Sucender es un desarrollador informatico, apasionado del diseño web, HTML, CSS, JavaScript y Node.js. Available for hire.

View all contributions by

Website: http://www.ayudaparamiweb.com/

CSS Reference

Learn about all important CSS properties from the basics with our extensive and easy-to-read CSS Reference.

It doesn't matter if you are a beginner or intermediate, start learning CSS now.