¿Cómo convertirse en un excelente ingeniero de front-end?

Recientemente recibí un correo electrónico de un lector de mi blog y por alguna razón me hizo pensar. El correo electrónico dice así:

Hola, Philip, ¿puedo preguntarte cómo convertirte en un excelente ingeniero de front-end?

¿Alguna sugerencia?

Debo admitir que me sorprendió mucho cuando me hicieron esta pregunta porque nunca me he considerado un "buen" ingeniero front-end. De hecho, durante mis primeros años en la industria, realmente no creía que estuviera calificado para ningún trabajo. Postulé para estos puestos porque no me di cuenta de lo poco que sabía, y los obtuve porque las personas que me entrevistaron no sabían qué preguntas hacerme.

Dicho esto, terminé haciéndolo bien en todos los puestos y convirtiéndome en un miembro importante del equipo. Cuando finalmente me voy (porque tampoco estoy preparado para el próximo desafío), normalmente me piden que contrate a mi reemplazo. Mirando ahora cómo abordé estas entrevistas, me sorprende cuánto valoré este conocimiento, a pesar de mi falta de conocimiento en el campo cuando comencé a trabajar. Aunque sé por experiencia personal que el éxito es posible, es posible que mi yo actual no contrate a mi yo anterior.

Cuanto más trabajo en línea, más me doy cuenta de que la diferencia entre las personas buenas y las personas realmente buenas no es su conocimiento, sino su forma de pensar. Obviamente, el conocimiento es fundamental en algunas situaciones, pero en un campo que cambia rápidamente, cómo se adquiere el conocimiento siempre es más importante que lo que se sabe en un momento dado (al menos a largo plazo). Quizás lo más importante: cómo utilizar este conocimiento para resolver problemas cotidianos.

Aquí hay toneladas de artículos que analizan los lenguajes, marcos y herramientas que necesita conocer. Quería adoptar un enfoque diferente. En esta publicación de blog, analizaré la forma de pensar de los ingenieros de front-end y espero brindar algunas ideas sobre "¿Cómo convertirse en un buen ingeniero de front-end?

No se limite a resolver el problema , pero descubre el meollo del problema.

Demasiadas personas juguetean con la escritura de CSS y JavaScript hasta que encuentran algo que funciona, y luego siguen adelante. Sé que esto sucede porque lo veo todo el tiempo. Situación de revisión de código.

A menudo pregunto a la gente: "¿Por qué agregas flotador? " o "¿Es realmente necesario este desbordamiento: ocultar? "Ellos responderán: "No lo sé, pero si lo elimino, no funcionará".

Lo mismo ocurre con JavaScript. Veré setTimeout usado para evitar condiciones de carrera. , o Alguien evita que un evento se propague independientemente de cómo afectará a otros controladores de eventos en la página.

Sé que a veces necesitas algo útil y lo necesitas ahora, pero si nunca lo dedicas. para comprender la causa raíz del problema y se encontrará en la misma situación una y otra vez

Tomarse el tiempo para descubrir la causa del hack puede parecer costoso ahora, pero le garantizo que lo ahorrará. su tiempo en el futuro Una mejor comprensión del sistema con el que está trabajando significa menos conjeturas y comprobaciones

Aprenda a anticipar cambios futuros en el código de su navegador y en el backend. El código generalmente se ejecuta en un entorno que usted controla, mientras que la interfaz está completamente fuera de su control y la plataforma o dispositivo que utilizan sus usuarios puede cambiar en cualquier momento. Y su código debe poder manejar estos cambios con elegancia.

Recuerdo haber leído el código fuente de un popular framework JavaScript en 2011 y haber visto el siguiente código (modificado para simplificar):

visie6= !isIE7amp !isIE8amp ;& !isIE9;

En este caso, IE6 es la versión IE de IE6, que es probablemente la versión más popular capaz de manejar IE6. Pero cuando salió IE10, la mayoría de nuestras aplicaciones fallaron por completo.

Entiendo que en el mundo real la detección de funciones no es 100 % efectiva y, a veces, hay que confiar en el comportamiento del automóvil o en la lista blanca de navegadores para obtener falsos positivos (o falsos negativos) de errores de detección de funciones, pero en cualquier caso tiempo, es absolutamente fundamental predecir que es casi seguro que estas deficiencias ya no existirán en el futuro.

Para muchos de nosotros, el código que escribimos hoy trascenderá lo que hacemos ahora. Parte del código que escribí hace ocho años todavía se ejecuta en grandes sitios de producción, lo que me gratifica y al mismo tiempo me aterroriza.

Lea las especificaciones

Los errores del navegador siempre existen, pero cuando dos navegadores muestran el mismo código de manera diferente, lo que a menudo se considera navegadores "buenos" tiene razón y los navegadores "malos" están equivocados sin comprobándolo ellos mismos. Los navegadores "malos" están equivocados, pero no siempre es así, y si sus suposiciones son erróneas, es casi seguro que cualquier solución alternativa que elija fallará en el futuro.

Valores predeterminados para proyectos flexibles El tamaño mínimo es un ejemplo. punto Según la especificación, los valores mínimos iniciales de ancho y alto de los elementos flexibles son automáticos (no 0), lo que significa:

Elementos flexibles El tamaño mínimo predeterminado. es 0.