Profesión: desarrollador front-end

xxx: ¿en qué escribes frontend?
yyy: en muletas y bicicletas
xxx: mmm, buen marco!
Bash.im


Cuando se te ocurre convertirte en programador, inspiras el manual C de Shildt, pides un grueso libro Stroustrup C ++ y aprendes a bromear sobre un puntero a un puntero a un puntero y sobre la recursividad. El duro romance de la primera vez ... Pero todo cambia cuando JavaScript entra accidentalmente en tu vida. “¡Qué sintaxis simple y directa es! Todo, está decidido, escribiré sitios web ", piensa el programador novato y decide convertirse en el gurú de toda la web. Pero luego la pila seleccionada cambia su cara amiga, y cuanto más, más. Pero no puede detenerse ahora, porque usted es uno de ellos: desarrolladores front-end. Aquellos que están "mirando la cara del sitio". Bueno, queria unirme? Entonces para ti 2 series de nuestra sección especial "Profesión: ..."


Ya estábamos preparando este artículo cuando la publicación "Habr Careers" salió el miércoles con una entrevista con un representante de una escuela en línea sobre el trabajo del front-end, que no pudo sino alegrarse: significa que el siguiente material necesario, útil y relevante aparecerá en nuestra serie "Profesión: .." . Por cierto, el primer número se dedicó a la profesión de administrador del sistema

¿Quién es?


Primero, algunas letras y digresiones.

En el umbral de la tercera década del siglo XXI, parece que el interés de los usuarios y desarrolladores se ha desplazado de las interfaces web a las aplicaciones móviles e IoT. Pero solo parece. Hagamos un experimento mental simple. Piense en cuántos sitios visita desde todos sus gadgets por semana y analice qué aplicaciones móviles ha instalado. Lo más probable es que esté viendo toda la información y recursos de noticias en las versiones completa y móvil de los sitios (en el navegador), y las aplicaciones móviles realizan tareas "específicas": redes sociales, mensajería instantánea, planificadores, pasatiempos, etc. Es decir, es demasiado pronto para hablar sobre la extinción de la web.

Además, una de las tendencias de 2019-2020 (y creo que antes del año 2025) se ha convertido en las llamadas PWA (Progressive Web Apps), que se llaman el futuro de la web móvil. Para decirlo lo más simple posible, PWA no es más que el sitio móvil de una persona sana como debería ser. PWA fue mejor definido por uno de los creadores de este concepto y autor del término Alex Russell: "Las aplicaciones web progresivas son solo sitios web que tomaron todas las vitaminas correctas". ("PWA es solo un sitio que toma todas las vitaminas necesarias").

PWA ofrece al usuario un conjunto de características que generalmente se asocian con una aplicación móvil nativa. Por ejemplo, puede obtener una carga instantánea en la segunda llamada, configurar el icono del sitio en la pantalla del gadget para un acceso rápido, recibir notificaciones personalizadas, rechazar la navegación del navegador y trabajar en un conveniente modo de pantalla completa, etc. 

Por cierto, si está interesado en conocer mejor a PWA, hay una página genial al respecto y, por supuesto, las recomendaciones de Google .

Entonces, mis amigos, es obvio que, independientemente del crecimiento de las aplicaciones y tecnologías móviles, la web seguirá siendo un estándar abierto para la interacción del usuario y cualquier conjunto de información (sitios, blogs, redes sociales, tiendas en línea y todo lo demás) durante mucho tiempo. 

Algo me llevó al backend. No es la cuestión. La conclusión es que con cualquier backend de cualquier sitio debe haber una "cara" del sitio y de alguna manera debería funcionar. Y todo sucede cuando vienen: desarrolladores front-end. Son responsables de desarrollar la interfaz externa del sitio, es decir, cómo interactúan el backend y el diseño del sitio con el usuario (si por casualidad estás en Habré, explicaré: hay mucho de todo oculto detrás de cada sitio: diseño, varias capas y un gran backend, es decir, toda la lógica de trabajo , DBMS y así sucesivamente). En general, una vez que se cubrió la verdad en esta imagen:



Esta imagen épica y familiar ya se ha transformado hoy y, de hecho, la profesión de desarrollador front-end se ha vuelto incomparablemente más compleja y multicomponente que hace unos 7-10 años. Ahora se ve así, y el 2028 se siente mucho más cerca :-) 



Las ofertas de front-end son responsables del funcionamiento lógico de todos los componentes del sitio, incluidos el contenido, los botones, las imágenes, la navegación y los enlaces internos. A menudo son ellos quienes diseñan la estructura primaria del sitio, trabajan con los requisitos de los usuarios (clientes), es decir, son responsables del lado del cliente de la interfaz de usuario. Y si el back-end es responsable del hardware y el software y es más importante para ellos cómo interactúa el software con el hardware, entonces el front-end interactúa con un "hardware" mucho más complejo: los órganos de visión, audición y, a veces, el sentido del tacto de la gente común. La tarea es hacerlo conveniente, rápido, transparente, esperado, etc. En general, si el front-end corta, todos lo notarán de una vez. 

¿Todavía no tienes miedo de esas perspectivas? Luego vamos más allá. 

¿Dónde se necesita?


En resumen, donde haya desarrollo web, a saber:

  • , — : , , , , , , . , , .
  • -, , .
  • - : , , CRM, ERP, BPM .
  • .

Es decir, si lo desea, puede encontrar un trabajo en cualquier campo que le interese, combinando el interés y el oficio del front-end. Sí, algunas empresas buscan full-stack, pero, por regla general, se trata de corporaciones muy serias que están listas para pagar por un programador real de full stack o pequeñas oficinas para las que full-stack es un programador similar para soportar un sitio en CMS. El resto son sus posibles empleadores. Por ejemplo, al momento de escribir el artículo sobre "Habr Career" hay 249 vacantes selectivas de este tipo, y en hh.ru, un poco más de 4100 (aunque no son tan selectivas, pero es significativo). 

salario promedio


También veremos los salarios en Haber Career. Tome los datos para la segunda mitad de 2019, independientemente de la propiedad de una pila en particular. Por cierto, el conocimiento de una biblioteca o marco en particular no agrega mucho al salario, entre 5 y 15 mil rublos. 
Nivel de especialista
salario promedio
Júnior
53 404 rub.
Medio
99 396 rub.
Mayor
170 535 frotar.
Presentador (líder)
185 533 frotar.

La diferencia entre los niveles es bastante notable, y la pila dentro de las vacantes es bastante extensa, por lo que solo con los cursos en línea de JavaScript, es poco probable que pueda hacer una carrera profesional.

Requisitos profesionales básicos


De hecho, un desarrollador front-end bien pagado no solo debe conocer el lenguaje de programación básico, sino también las bibliotecas y los marcos. Hemos elegido las cinco tecnologías más populares que son propiedad de desarrolladores de varios niveles. Además, comenzando con Junior, algunas otras habilidades importantes que se pueden ver en la última línea se unen a la propiedad de la pila. En principio, todo se espera, para mí prácticamente no hay sorpresas en la mesa.
Pasante (pasante)
Júnior
Medio
Mayor
Presentador (líder)
  1. Javascript
  2. Mecanografiado
  3. HTML
  4. CSS
  5. React.js

  1. Javascript
  2. React.js
  3. HTML
  4. CSS
  5. Redux

  1. Javascript
  2. React.js
  3. Vue.js
  4. Redux
  5. CSS

  1. Javascript
  2. React.js
  3. Angular
  4. Vue.js
  5. Redux

  1. React.js
  2. Javascript
  3. Vue.js
  4. Angular
  5. Mecanografiado


Git, BEM, diseño adaptativo, DBMS
+ diseño de navegador cruzado
+ gestión de desarrollo, Ruby on Rails
+ gestión de personas, diseño de arquitectura de aplicaciones

En las descripciones de trabajo del desarrollador front-end, puede cumplir con varios requisitos, desde el conocimiento básico de HTML hasta el conocimiento completo de todo en el mundo y, además, PHP. Destacaremos los requisitos básicos.

  • Competencia y comprensión de los principios de diseño web, UI / UX.
  • Comprender las necesidades de los diferentes grupos de usuarios, incluida la necesidad de trabajar con Accesibilidad (accesibilidad del sitio para lectura, comprensión e interacción de personas con discapacidad).
  • Habilidades para monitorear el rendimiento y las condiciones del sitio, monitorear el tráfico.
  • Comprender las reglas y problemas de usabilidad, habilidades para solucionar problemas rápidamente.
  • Diseño de arquitectura de aplicaciones web.
  • Probando sitios de usabilidad, características especiales, depuración necesaria.
  • Perfilado, refactorización y optimización de aplicaciones desarrolladas.

A veces, los requisitos de los empleadores incluyen habilidades de diseño web, trabajar con editores gráficos, conocimiento y capacidad para aplicar SEO (optimización de motores de búsqueda), etc. Sí, de hecho, a menudo estas habilidades aumentan significativamente el valor de un especialista, pero piense en ello, pero ¿le gustaría deshacerse de 2-3 publicaciones por el precio de una? Pero el conocimiento de otros lenguajes de programación orientados a la web (PHP, Ruby, Python) permitirá no solo trabajar mejor con el backend cuando desarrolle el frontend, sino que también aumentará significativamente su valor en el mercado laboral, y al mismo tiempo puede ser el primer paso para el crecimiento hacia un stack profesional completo -desarrollador.


Los marcos web más populares según el informe StackOverflow . Recomiendo ir a la página del informe y ver toda su pestaña, al menos en gráficos, para cambiar de pestaña, de modo que obtenga una imagen completa de lo que está sucediendo en TI global. Muchas ideas incluso para un especialista en TI avanzado y experimentado.

Y de nuevo, un maravilloso esquema de tecnología 2020 para un desarrollador front-end (hoja de ruta)



Cualidades personales importantes


No soy partidario de evaluar a los especialistas por sus cualidades personales y exijo compasión desde el principio o introversión desde el final. Sin embargo, teniendo ciertos rasgos de personalidad, el desarrollador front-end hará frente al trabajo un poco mejor que sus competidores y colegas.

  • , , - , , , , . , . - , - — .
  • , , .
  • , , , « », .
  • Las habilidades artísticas, el gusto y el sentido del estilo ayudarán a combinar un diseño listo para usar y una interfaz bien construida. 

Al mismo tiempo, como cualquier técnico, el desarrollador debe comprender los algoritmos, tener un pensamiento lógico y poder hablar de manera concisa tanto en el contenido como en el código.

La necesidad de conocimiento de lenguas extranjeras.


Para cualquier programador, un inglés de al menos intermedio superior con un sesgo en inglés técnico es altamente deseable. Para que pueda leer en el original las numerosas recomendaciones de Google y otras compañías para un desarrollo óptimo (¡mucha documentación útil!), Autoestudio con la ayuda de conferencias extranjeras, comunicarse con colegas en foros, hacer preguntas y también leer libros sobre usabilidad y diseño, entre los cuales hay muy muchas ediciones geniales en inglés y aún no traducidas. 

Es extremadamente difícil de desarrollar en programación sin conocimiento de inglés, especialmente en tecnologías web. 

Donde estudiar


En las realidades rusas, como ya dijimos en el primer artículo sobre administradores de sistemas, la educación superior es necesaria para un empleo exitoso. Por lo tanto, es deseable tener una buena base educativa (politécnica, universitaria, al límite, una especialidad técnica en alguna universidad básica). En principio, con las habilidades de pensamiento lógico y la capacidad de trabajar con algoritmos, cualquier educación superior es adecuada: sería una persona inteligente. Hoy en día, ya hay especialidades y direcciones en las universidades, donde los estudiantes aprenden los conceptos básicos del desarrollo front-end y backend, lo cual es muy bueno. Pero esto no es absolutamente suficiente.

Por supuesto, lo primero que se encuentra al elegir la profesión de desarrollador front-end son las escuelas en línea. Mientras escribía este artículo, busqué en Google varias imágenes e informes del sitio sobre el tema de la interfaz. Tengo todo Yandex y Google ahora en los anuncios que me prometen hacer un gurú de JavaScript en 2-3-6-12 meses. Me sentiría tentado si no supiera qué es JavaScript y cómo aprenderlo en 21 días. Tomar un curso para comenzar u organizar el conocimiento o no tomarlo depende de su deseo, tiempo e ingresos. En cualquier caso, simplemente no podrá escuchar: tendrá que sentarse y pulsar las teclas, hacer sitios de prueba o cortar el servicio de su mascota (por cierto, incluido el backend).

Sin embargo, aprender el desarrollo front-end se reduce a esto: tomas el proyecto y aprendes de él. Si desea dinero, puede intentar crear un sitio web para una pequeña empresa u obtener una pasantía (pero para esto ya debe tener al menos algunas habilidades de desarrollo o prueba). Solo la codificación diaria, la búsqueda de soluciones óptimas, un análisis exhaustivo del código lo ayudarán a bombear como desarrollador. 

Libros principales y herramientas de aprendizaje


La lista de libros y recursos depende de la pila que elija. Pero hay algunos que absolutamente cualquier front-end necesita (e incluso cualquier programador en principio). Haré una lista caótica, en cuanto a la fuerza de mis propias impresiones.

  • « ». , . (, ) , , .
  • htmlbook.ru — , . - . 
  • — , . JavaScript.
  • « JavaScript. -» — . , «» 2019 , .
  • webref.ru — , , . 
  • — ( O'Reilly).
  • codecademy.com — . , , , . , — 15$ . , , . 
  • htmlacademy.ru — , . , .
  • , Youtube . , , . , . 
  • Y, por supuesto, no tenga miedo y no sea tímido al comprometerse con proyectos de código abierto (comience con pequeños, y allí llegará a bibliotecas y marcos), elija el código de alguien, aprenda principios y algoritmos.
  • Un buen artículo con un inglés muy simple y consejos para comenzar su viaje en JavaScript.
  • Por supuesto, Habr. ¡Un equipo de RUVDS tradujo muchísimo en JavaScript y frontend!

La última vez que nos reprocharon que indicamos pocos libros y recursos. Por desgracia, hay un conjunto para cada necesidad, y tanto cubrir es simplemente imposible. Por lo tanto, en los comentarios, diga dónde y cómo estudió, con la ayuda de lo que practicó, para principiantes y no solo esta será una información súper útil.

Futuro front-end


La licitación inicial tiene tres vías principales de desarrollo.

  1. -. — ; — , , TDD, ; — , ; — . 
  2. (-) — , , . - ( , - — -).
  3. , , , , . , .

En cualquier caso, solo los más aburridos y desmotivados podrán quedarse quietos y no moverse a ninguna parte en sus carreras, porque el dinamismo de la web en sí arrastra a los desarrolladores y los obliga a desarrollar sus habilidades. Y sí, siempre puedes ser muy bueno, el mejor desarrollador front-end.

Mitos de la profesion


▍ Frontend se está muriendo


El mito principal es que la profesión de desarrollador front-end está muriendo. Por supuesto no. Además, las interfaces son cada vez más complicadas año tras año, y el sector de TI necesitará especialistas avanzados que puedan resolver estas complicaciones. Se necesitará desarrollo front-end durante bastante tiempo, y no se reemplazarán plantillas, visivigi, CMS y otros medios. La importancia y la necesidad de la profesión se pueden juzgar mediante una serie de gráficos: creo que todo está claro y no hay necesidad de repetir una vez más que la profesión que proporciona lo más importante es la interacción del usuario y la interfaz.


Solo mire los 10 lenguajes de programación más populares en los proyectos de GitHub y evalúe la posición de JavaScript en este gráfico. En este caso, una línea recta no significa morir, significa estabilidad y demanda.


Los lenguajes de programación más populares del informe StackOverflow . Por cierto, JavaScript ha mantenido la delantera aquí por séptimo año.

Y aquí están las tendencias de Google.


Dinámica de consultas de desarrolladores frontend en el mundo, 5 años


La dinámica de la consulta "frontend" (rojo) y "frontend" (azul) en Rusia, 5 años

▍ Los empleadores realmente no entienden los tipos de programadores


Pero el segundo mito nifiga no es un mito, sino pura verdad. Los empleadores a menudo no entienden a quién están contratando y no buscan a alguien que esté listo para resolver problemas específicos y asumir la responsabilidad de su solución, sino a alguien que "necesita saber" algún tipo de pila de tecnología led. Es por eso que debe estar preparado para el hecho de que un trabajo de front-end una vez se verá como un trabajo de diseñador de diseño, y el segundo, en un trabajo de pila completa. Si el empleador aprendió la abreviatura TDD (desarrollo impulsado por pruebas), entonces la vacante también se puede encontrar entre los evaluadores :-) De hecho, un juego como el que se encuentra en los requisitos para programadores de front-end no se encuentra prácticamente en ninguna parte (solo peor con especialistas en relaciones públicas y comercializadores, esos generalmente debería ser una MFP). Si realmente quieres unirte a la empresa y entiendes que la entrevista no irá allí,intente transferir la conversación a las tareas y diga cómo exactamente las resolverá y con la ayuda de qué pila. Sin embargo, si ya no asististe a la entrevista, ¿quizás piensas demasiado bien sobre la compañía? 

Consejo principal


Toda la web está cambiando muy rápidamente: aparecen nuevas tecnologías, nuevos patrones de interacción, nuevas utilidades y actualizaciones de marcos y bibliotecas. Sin embargo, si pierde uno de los nuevos productos, mañana el sitio del que será responsable no se volverá más lento, aterrador y no se convertirá en una calabaza. Cuando elija tecnologías, cambie la pila, cambie la lógica de la interfaz, piense en sus usuarios, a qué están acostumbrados, mire análisis, mapas de calor y realice solo cambios realmente necesarios y útiles. Mientras tanto, aprender cosas nuevas y probarlas en proyectos favoritos, porque la experiencia solo viene con la práctica, y la comprensión de las mejores soluciones proviene de ejemplos vivos. 

¿Y cómo y por qué decidiste convertirte en un desarrollador front-end? ¿Qué es bueno en la profesión y qué no? Cuéntanos en los comentarios, ayudaremos a quienes se encuentran en una encrucijada.

Source: https://habr.com/ru/post/undefined/


All Articles