¿Cuáles son las áreas en las que un ingeniero front-end debería tener una sólida comprensión?

Copiando de mi respuesta anterior: la respuesta de Vishwajeet Vatharkar a ¿Cuáles son las áreas en las que un ingeniero front-end debería tener una sólida comprensión?

Comprenda el diseño de la experiencia del usuario El ingeniero front-end debe comprender los principios básicos del diseño UX, IMO.
¡La ingeniería UX es algo que diferencia entre un buen desarrollador front-end y uno excelente!
Hay excelentes cursos en coursera.org y en Lynda.com para aprender lo mismo.

Programación y tecnología Como ingeniero front-end, ¡debería ser capaz de construir sus propios componentes de interfaz de usuario de alta calidad!
Teniendo en cuenta el panorama general, en toda la pila de tecnología, la ingeniería frontend tiene la tasa de cambio más rápida. Verás muchas bibliotecas, marcos. ¡Tendencias de UX cada dos días! Y como ingeniero de ‘alta gama’, ¡los clientes (y empleadores) esperarían que los mantuviera al día!
¡Para eso, debes aprender a aprender en el ecosistema que cambia rápidamente!
Siempre recuerda esto:

Al aprender una tecnología que cambia rápidamente, la perspectiva es más importante que el contenido. – R. Pattice

No mencionaré ninguna biblioteca / marco específico, ya que podría volverse irrelevante / obsoleto en pocos meses.
Póngase cómodo con HTML-CSS, JavaScript (con los últimos estándares) siga las guías de Mozilla Developer Network para aprender lo mismo.
Siga GitHub y Hacker News para mantenerse al día con las últimas tendencias.

¡Aprende haciendo! ¡Comienza a trabajar en tus ideas! ¡Empieza pequeño! ¡Implemente algunos componentes de interfaz de usuario o personalice algunos CSS de framework! La programación de la interfaz de usuario es algo muy emocionante, ¡puedes VER y SENTIR las cosas que estás construyendo!

¡Todo lo mejor!

Para ser un ingeniero FE exitoso, hay algunas habilidades tangibles y no tangibles con las que debe familiarizarse y, finalmente, dominarlas.

Aquí hay una breve lista de estas habilidades tangibles:

  • Lo habitual: HTML y CSS. Comprenda cómo funcionan y cómo se representan en el navegador. Comprenda que el motor de renderizado de cada navegador seguirá una implementación similar, pero no exacta, de los estándares, según lo definido por el W3C. Aprenda a codificar HTML 5 semántico y CSS3 eficiente.
  • JavaScript Conozca JS sin formato, sin todos los marcos y bibliotecas elegantes. Debe conocer JS como un lenguaje de programación, no simplemente como una herramienta útil para hacer que los botones parpadeen en una página. Intente comprender las funciones más avanzadas de JavaScript, como vincular, aplicar, llamar, prototipo, asignar, reducir, etc. (Consulte Mozilla Developer Network para esto) Después de eso, aprenda las bibliotecas y marcos útiles, como jQuery, Underscore, Backbone, Angular, etc. mira su código fuente. Comprenda los patrones de diseño, luego use algunos patrones de diseño en su propio código. ¡JavaScript es muy importante! No puedo enfatizar esto lo suficiente. Una ventaja es mantenerse siempre actualizado con los últimos estándares, como ECMAScript6.
  • Actuación. Comprenda cómo se carga cada parte del sitio web. Aprenda cómo y cuándo cargar eficientemente sus imágenes, secuencias de comandos, hojas de estilo, etc. Este es el factor de gran dinero. Esto es lo que impulsa a las empresas. Puede encontrar la cura para el cáncer en su sitio web, pero si tarda demasiado en cargar, nadie lo verá.

Tener estas habilidades tangibles es genial (disculpe si me perdí algunas), pero no serán mucho sin estos intangibles:

  • Habilidades de toma de decisiones. Necesita tomar decisiones basadas en muchos factores. Ejemplos de estas decisiones son: cuándo usar SVGs versus imágenes; cuándo pero tus imágenes en sprites; cuándo usar Sass o CSS simple; ¿Cuál será el próximo marco que elija? etc. Para aprovechar al máximo estas decisiones, debe comprender los tangibles, por supuesto. También debe saber cómo incluir todos los factores, como el desarrollo, el rendimiento, la usabilidad, la curva de aprendizaje, la habilidad de los desarrolladores, el tiempo, el costo, etc.
  • Disponibilidad para aprender siempre. Las tecnologías se mueven muy rápido en el front-end. Puede elegir una nueva tecnología que sea la mejor del momento y para cuando su equipo la implemente, la nueva mierda ya estará disponible. ¿Qué haces, dejar todo y rediseñar? Por supuesto que no, no puedes permitirte hacer eso. Pero, de vez en cuando, tal vez cada dos años, deberá rediseñar su aplicación con lo último y lo mejor. ¡Se necesita mucha energía y dedicación para estar siempre en la cima!

El front-end siempre está cambiando muy rápidamente, por lo que lo más importante es mantenerse siempre fiel a los fundamentos. Independientemente de cuál será la próxima gran cosa, es importante comprender el JS detrás de él. ¡Siempre sigue aprendiendo y nunca te quedarás atrás!

¡Buena suerte!

PD: ¡Disculpe mi gramática y ortografía ya que estoy en mi iPhone!

Soy un desarrollador web front end experimentado y lo he estado haciendo durante más de 14 años, pero no me gustaría llamar a mi auto high-end.

Comience aprendiendo HTML / CSS y Jquerry y comience con sitios web simples en su círculo personal, también puede hacerlo de forma gratuita para su cartera y ganar experiencia. Avanza en los sistemas CMS, Front-end más avanzado, como la interfaz de usuario móvil, desarrollando y mejorando la experiencia del usuario y mucho más.

Es un camino muy largo para llegar a la marca “High-End”, permanecer en la comunidad, leer blogs, hablar con diseñadores experimentados y construir una buena carrera.

La mejor de las suertes

Manoj Soni

Tengo el grado de diseñador, pero también aprendí varios lenguajes de programación, tanto backend como frontend. Trabajando durante 10 años en diseño web, de los cuales los últimos 4 exclusivamente en el diseño y desarrollo de aplicaciones web en empresas de TI, he dirigido equipos compuestos por programadores frontend, backend y diseñadores. En mi opinión, el conocimiento técnico de los lenguajes de programación está disponible gratuitamente en la web y es muy lineal … puedes aprender tutoriales perfectamente dirigidos (no es necesario estudiar computación) mientras que la comunicación del tema compositivo, la estética / el significado y determina los puntos de vista que Crear una aplicación web y generar identidad, diferenciación y valor de un producto es un proceso creativo que no tiene una receta estándar y es imposible de resolver mirando un foro o tutoriales. Ambas son tareas diferentes, una es diseñar planes, decidir qué se hará y cómo, y la otra se encarga de construirlo. Te recomiendo estudiar diseño (diseño de producto) en una universidad y realizar tutoriales de forma independiente. Al hacer tutoriales, recomiendo que sean cosas avanzadas desde el principio, estudia Node.js, aprenda a hacer una API REST, por ejemplo, algo que suena muy complicado, pero le aseguro que no será mucho y aprenda backend, para construir una base de mongo datos (que es mucho más fácil que en SQL y PostgreSQL) para usar la consola (terminal) y generará un par de servicios básicos (publicar, eliminar, obtener, poner) para luego realizar una aplicación web que recomiendo marionette.js y aprende bien una estructura para guiar tu código además de pensar en construir código html a partir de funciones y métodos javascript que darán un mayor dinamismo, y finalmente recomiendo no usar bootstrap o algo así para administrar tu CSS, solo usa menos para compilar y haga sus estilos de código para tener más control sobre lo que será su diseño formal fuerte y la experiencia del usuario.

Soy un ingeniero front end autodidacta. He trabajado en el backend, como desarrollador y administrador del sistema. Todo autodidacta. Estas habilidades le brindan una ventaja al saber cómo trabajar en una aplicación completa.

La dificultad es el proceso de entrevista. Sin experiencia en CS, tiendo a tropezar con las típicas “listas vinculadas” u otras preguntas algorítmicas.

Al haberme centrado principalmente en la FE durante los últimos 7 años, encuentro estas preguntas de entrevista menos populares. La mayoría de las veces una entrevista FE intentará determinar si usted sabe cómo hacer el trabajo. Ocasionalmente obtendrá un tipo de backend que le hará la pregunta estándar de “listas enlazadas” o “atravesará un árbol binario”. Nada de lo que he tenido que hacer como desarrollador front-end.

Creo que ganarás más dinero sabiendo que codificar que no, me enfocaría principalmente en Javascript, CSS, HTML, Linux y aprendería a usar Git.

También es útil si eres bueno en diseño, me encuentro con ganas de hacer más diseño a medida que pasa el tiempo.

No necesitas un título en ingeniería informática para ser un desarrollador front-end. A continuación se muestra una lista de algunas tecnologías y habilidades con las que debe ser bastante competente, para conseguir un trabajo como desarrollador front-end.

  • HTML5 / HAML
  • CSS3 / SASS
  • JavaScript y jQuery
  • Marcos CSS como Twitter Bootstrap o Zurb Foundation.
  • Temas de WordPress
  • Fuerte sentido de UX, diseño y experiencia con estándares de desarrollo front-end contemporáneos.

Estos deberían ser suficientes para conseguir ese primer trabajo o al menos una pasantía.

Espero que esto ayude. Buena suerte. 🙂

Debe saber HTML (idealmente 5), CSS y Javascript. Me detendría aquí, pero al ver el término ‘ingeniero’ que pusiste allí, aclararía y diría que necesitas saber cómo escribir un buen HTML semántico (puedes buscar en Google este término), debes saber cómo usar pre-poseedores de CSS como SAAS, menos, stylus, etc., ya que aumentan enormemente su productividad.
Finalmente, la pieza clave de su pila de front-end sería Javascript, Learn Javascript, se lo agradecería en el futuro por hacerlo, lo hago todos los días. Comience con Javascript vainilla y luego pase a las bibliotecas js como jquery, bootstrap, mootools, etc.… y al hacerlo, aprenda un framework MVC Javascript como Angular JS, knockout, etc.

Estas son las tres líneas de 3 líneas que crean el triángulo de las habilidades de ingeniero front-end, tome cualquiera de ellas y no será un triángulo.

Bonificación: conozca los motores de plantillas de Javascript como Moustache.js, Handlebars.js.

Ah, sí, debería poder convertir sus diseños visualizados en páginas web también conocidas como HTML, aquí es donde utilizaría sus sartenes. Y definitivamente debes saber sobre el diseño web receptivo.

Puede consultar mi otra respuesta para encontrar enlaces útiles para aprender lo que he mencionado anteriormente.

La respuesta de Mushtaq Jameel a ¿Cuáles son algunos buenos sitios web (gratuitos o no) para aprender HTML5, CSS3, Java, jQuery y PHP?

Si estudias CS, definitivamente te ayudará con tus habilidades de programación y las habilidades y conocimientos relacionados. Si solo estudias CS sin un propósito, no te ayudará mucho. Sin embargo, creo que tiene un objetivo firme de ser un desarrollador front-end, por lo que estudiar CS será muy útil, seguro.

Sin embargo, no sería una única forma. Hay personas que nunca estudiaron CS pero que son súper buenas en programación. Son muy talentosos o han estudiado mucho los lenguajes de programación.

Básicamente, sin dolor no hay ganancia. Aunque estudié CS durante muchos años, todavía no tengo un conocimiento profundo en muchas áreas. Si quieres ser bueno como desarrollador front-end, ya has configurado un área objetivo específica. Te recomiendo que estudies CS, pero si no tienes suficiente tiempo o dinero, entonces busca los lenguajes de programación. Pero estudie no solo la gramática, sino también las arquitecturas, los sistemas, las redes, etc. Comprender cómo funciona es más importante que simplemente imprimir ‘Hello World’. Será lento al principio, pero aumentará tus habilidades al final.

(A2A)

El diseño web tiene más que ver con la perspectiva y el arte que con un tema.

Si recién está comenzando y no tiene idea sobre HTML, CSS, JavaScript, muévase aquí primero Mozilla Developer Network (en ese orden).

Ahora puedes probar el curso de desarrollo web en línea – Cómo construir un blog – Udacity

Aprenderá más construyendo cosas por triviales que parezcan, en lugar de solo leer sobre ellas.

Puede encontrar muchos recursos respondidos aquí: ¿Cuál es el mejor curso de diseño web en línea?

Espero eso ayude.

Para JavaScript:

  • Marco MVH Superheroico JavaScript
  • jQuery

Para CSS / HTML:

  • Bootstrap · El marco front-end más popular del mundo para dispositivos móviles y receptivo.
  • IU semántica
  • Marco avanzado de aplicaciones móviles híbridas HTML5

– HTML y CSS
– Sass o Stylus
– Marco CSS (Bootstrap, Pure, Foundation …)

– Javascript
– Jquery
– Marco JS (Angular, Backbone, React …)

– Herramientas: Gulp o Grunt, Bower, Yeoman …

– WordPress

———————————————————-
– Aprende nuevas tecnologías: Udemy, Treehouse, Udacity …
– P / R: Desbordamiento de pila, foros …
– Diseño web de noticias / dev. : Vandelay Design, Codrops, Css-trick,
Smashing Magazine, etc.

Respuesta n. ° 1: ¿Tiene más talento natural como diseñador o como ingeniero? Responde eso y luego estudia el otro. En otras palabras, use sus estudios para apuntalar sus debilidades, no para ampliar sus fortalezas.

Respuesta # 2: Aunque no tengo nada más que respeto por el gran diseño y los grandes diseñadores que lo crean, hay MUCHOS diseñadores en el mundo que compiten por trabajos de desarrollo front-end. No hay casi tantos con las habilidades técnicas hardcore.

De acuerdo, para el desarrollo front-end, debes aprender HTML / CSS, ambos son el alma del correo del desarrollo del sitio web. Después de eso, solo necesito concentrarme en Javascript y Jquery. Una vez que haya terminado con eso, tenga más conocimiento sobre html5, css3 y bootstrap de twitter.

Por otro lado, debe tener conocimiento sobre Adobe Photoshop, Corel Draw, Fireworks o Illustrator para los segmentos de diseño de gráficos.
Para más información visite Desarrollo de software

Intenta convertirte en un arquitecto web en lugar de solo un desarrollador web front-end.
FYQ: Aprenda Java Script, JQuery, HTML5, CSS3, estos son necesarios solo para el desarrollo del lado del cliente.
Aprenda cualquier lenguaje de script del lado del servidor como PHP, Python, Ruby.
Desarrolla tus habilidades lógicas, juega con bucles y algoritmos.

Suponiendo que tiene una aptitud para la ingeniería (no necesariamente la programación, pero las habilidades necesarias para abstraer algo y luego crear una forma interactiva de esa abstracción), HCI, usabilidad y arte lo llevarán más lejos en una carrera avanzada de diseño front-end que la capacitación técnica pura.

Como mencionaste al desarrollador, no estoy contando las habilidades como la edición y el diseño de imágenes. Aunque siempre es útil tener experiencia básica con la misma herramienta.

Debería comenzar con HTML, CSS y Javascript básicos. Presta más atención a los frameworks como bootstrap o foundation, jQuery. Una vez que comience a crear aplicaciones web profesionales, se encontrará utilizando estos marcos mucho más que CSS auto escrito. Pero eso no significa que pueda saltar directamente a los marcos.

Ajax y gran parte de JavaScript es parte de la mayoría de las aplicaciones web. Es posible que también requiera el uso de websockets.

Más tarde, como profesional, el backbone o angualr puede ser tu camino.

Todos los recursos para aprender arriba están disponibles gratuitamente en Internet. Puede encontrar la mayoría de ellos como un comienzo en w3schools.

El front-end profesional necesita un buen manejo de varios tipos de marcos. Sin embargo, una habilidad de lenguaje de Java o Python es buena. El front-end es diferente del diseño de la interfaz de usuario, por lo que no necesariamente tiene que estar jugando con sus lápices todo el día.

Yo estudiaría Diseño de interacción. El código front-end es bastante fácil de aprender por sí mismo, no necesita un título en informática (aunque si desea codificar, hágalo).

Ser un diseñador que también es un desarrollador front-end es lo más valioso para los empleadores.

Lo he respondido aquí. La respuesta de Sridhar Pandurangiah a ¿Qué cosas tengo que aprender para hacer un sitio web profesional y atractivo?

Comience con HTML y css, luego aprenda tecnologías avanzadas como html5, css3, angularjs / jquery.

More Interesting

Go vs Node.js: ¿Cuál para una aplicación de iPhone que procesará rutas para Google Maps?

¿Cómo se construye el software en capas?

¿Es este el momento adecuado para cambiar de trabajo en la industria del software?

¿Cuál es la diferencia entre la ingeniería de construcción y lanzamiento, DevOps y la ingeniería de confiabilidad del sitio?

Mi primer trabajo de control de calidad fue un ingeniero de control de calidad remoto durante 8 meses probando manualmente una aplicación de iOS, luego me despidieron. ¿Cómo continúo y construyo una carrera en QA ahora?

Soy un estudiante de secundaria con experiencia en el desarrollo de proyectos Java y en el uso de herramientas de la industria, pero sin antecedentes formales (sobre los cuales las compañías insisten). ¿Cómo puedo desarrollar efectivamente un fondo tan formal?

¿Para qué usan Terminal los desarrolladores con Mac?

¿Cuántos tipos de lenguajes de programación hay?

¿La prueba de software profesional es una profesión moribunda, ya sea en el mundo de inicio o en el gran mundo corporativo, o en ambos? ¿Se requerirán probadores de software en los próximos años o décadas?

¿Cómo sería para los programadores / programadores si no hubiera www.stackoverflow.org?

¿Cuáles son algunos libros de computadora que debes leer? No me refiero solo a libros técnicos, sino principalmente a libros de informática.

Cómo evaluar el esfuerzo de implementación y los costos en un nuevo proyecto de desarrollo de software

¿Les importa a los grupos de desarrollo de software si su gerente de proyecto sabe algo sobre codificación?

¿Cuál es la mejor manera de documentar los requisitos de un sitio web?

¿Los gerentes de producto tienen menos demanda que los ingenieros de software o más demanda?