Los elementos comunes son:
Consultas de medios para un diseño receptivo: aprenda un marco que ayude con esto, como Bootstrap o Foundation.
Preprocesadores de CSS: MENOS o SASS le permiten ser más expresivo y dinámico en su CSS y también pasar menos tiempo editando (a menos que se deje llevar como yo).
Grunt o Gulp : estos son asistentes de flujo de trabajo y ayudan a automatizar diversas tareas como minificación, agrupación / concatenación, optimización de imágenes, etc.
Bower : facilita la gestión de dependencias, para que pueda actualizar o agregar recursos de soporte en un instante.
Yeoman : un asistente de andamios que le ahorra tiempo escribiendo todo el código repetitivo que es tan tedioso de copiar y pegar.
jQuery : simplifica mucho trabajo de JS repetitivo
Ahora, si desea crear sitios web que sean bastante estáticos y ‘para mostrar’, como sitios personalizados, sitios de folletos o simplemente páginas de punto de contacto, Illustrator o Photoshop lo ayudarán a que se vean profesionales.
Si desea crear aplicaciones web que realmente hagan cosas interesantes y se parezcan más a las aplicaciones de escritorio tradicionales, deberá aprender algún tipo de marco de aplicación de página única (SPA), como Backbone, Ember o Angular. Mi preferencia es angular, pero todos son buenos en cosas similares y cuál elijas depende tanto de lo que quieras hacer con él como de tus preferencias personales.
Un avance en JavaScript que ha surgido recientemente para los desarrolladores de aplicaciones es Typecript (TS). TS le permite codificar con tipos (clases), interfaces, genéricos y mucho más que es difícil o imposible con JS natural. Es solo el compilador el que se ocupa de todo eso y genera JS nativo tras la compilación (ECMA3 o 5 como prefiera). Diría que vale la pena aprender esto si va a construir aplicaciones JS más grandes y complejas, ya que tendrá menos Heisenbugs en su JS gracias a la verificación en tiempo de compilación. Hay algunas alternativas (Dart y Coffeescript para dos) pero TS, en lo que a mí respecta, marca más casillas.
Para ser un desarrollador web completo, también debe comprender lo siguiente:
Experiencia de usuario ( UX )
Diseño de interfaz de usuario (UI)
Posicionamiento en buscadores ( SEO )
Arquitectura informacional
Que se trata de ‘qué’ es lo que estás desarrollando. Nunca tendrá una especificación de diseño exhaustiva, por lo que debe tener una buena intuición sobre cómo estructurar cosas que las personas encuentren fáciles y agradables de usar (y que los motores de búsqueda puedan entender y clasificar). Si su desarrollo tiene la intención de vender algo, entonces debe asegurarse de que esté centrado en la conversión y que canalice a las personas hacia el objetivo deseado; ya sea un botón ‘agregar a la cesta’ o ingresar su correo electrónico, etc.
En pocas palabras, practique, practique, practique y si disfruta de lo que hace, será algo natural (la mayoría de estas cosas surgieron de la necesidad, por lo que se sentirán intuitivas cuando se sienta cómodo con ellas).
¡Disfrutar!