Portada » Que debería poder hacer un desarrollador Frontend en 2023

Que debería poder hacer un desarrollador Frontend en 2023

by Donal Sandro Noblejas Huaman

Descubrimos lo que todo desarrollador front-end debería poder hacer en 2023 en los puestos de pasante, junior, middle y senior.

Cada año resulta cada vez más difícil ingresar a TI. Debido a los altos salarios, un estilo de vida cómodo, ambiciones y la necesidad de especialistas, ahora casi una de cada dos personas quiere convertirse en programador. Debido a estos factores, el mercado laboral de TI se está sobresaturando, por lo que también ha aumentado la necesidad de habilidades especializadas. Ahora incluso se exige a los desarrolladores que sepan programar, lo sé, esto es terrible…

Esto no significa que no tenga sentido dedicarse a las tecnologías de la información ahora; este hecho sólo indica que la competencia ha aumentado. Personalmente creo que esta situación, por el contrario, tiene un efecto beneficioso para todo el mundo, ya que la competencia genera progreso. Y para usted, este es un incentivo adicional para convertirse en un especialista aún más solicitado y con una personalidad fuerte.

(Hoja de ruta)

Para convertirse en desarrollador front-end es necesario estar siempre al tanto de las últimas tecnologías y desarrollarse constantemente, como en cualquier área de las tecnologías de la información.

Debido al rápido ritmo de desarrollo de las tecnologías de la información, cada año aparece algo nuevo y, por el contrario, algo fortalece su posición. En este artículo, he preparado para usted una hoja de ruta para desarrollarse como desarrollador front-end. Recopilé información de muchas fuentes, cursos y mis creencias personales y experiencia como desarrollador Frontend empleado.

Principiante

Ahora estamos hablando de una persona que recién comienza a incorporarse a la industria TI, y más específicamente al desarrollo de interfaces, es importante resaltar aquí que este conocimiento es la base máxima. Con este conocimiento, es poco probable que pueda encontrar un trabajo, pero le dará un impulso al desarrollo. En mi experiencia, un principiante, como mínimo, debe estar familiarizado con la siguiente lista de tecnologías:

  1. Qué es TCP/IP, de qué capas se componen y qué protocolos contiene. (En particular Ethernet, IP, UDP, TCP, HTTP1/2/3)
  2. ¿Qué es HTML? Elementos básicos de marcado. Optimización SEO semántica y accesibilidad.
  3. ¿Qué es CSS? Propiedades básicas de estilo. Posicionamiento de elementos de disposición. Caja flexible. Red. Adaptabilidad mediante la redacción de consultas @media. Animaciones y transformaciones. Pseudoelementos y pseudoclases. Metodología BEM.
  4. Conceptos básicos del lenguaje de programación JavaScript. Tipos de datos. Ciclos, Condiciones, Trabajo con objetos. Funciones. Prototipos y herencia. Trabajar con objetos. Métodos de matriz.
  5. Seleccione el editor de código. Personalmente recomiendo Visual Studio Code o WebStorm (pago) según mi experiencia.

Aprendiz (Aprendiz)

Si está familiarizado con los conceptos descritos anteriormente, puede pasar a la siguiente etapa: Aprendiz. Habiendo estudiado las tecnologías descritas en esta sección, ya tienes cierto peso en el mundo de las TI e incluso puedes conseguir una pasantía en una empresa de TI, el pasante debe estar familiarizado con la siguiente lista de tecnologías:

  1. Ser capaz de trabajar con el entorno del navegador y DOM (Document Object Model). Eventos del navegador. Manejo de errores (Try/Catch). Errores de usuario. POO. Sistema modular. Exportar e importar. Importaciones dinámicas. API web.
  2. ¿Qué hace que JavaScript sea asincrónico? ¿Qué es el bucle de eventos?Micro any macro tasks. Promises. Fetch API. Syntactic sugar – Async and Await.
  3. ¿Qué son las zonas y dominios DNS? Intercambio de recursos entre orígenes (CORS). Solicitudes de verificación previa. Modo sin CORS. Encabezados de solicitud y respuesta.
  4. ¿Qué son las linters? Configurar ESLint y conectar complementos. Configurando Prettier y Stylelint. Pre-commit Check
  5. Cómo funciona el control de versiones (Git). Regístrate en GitHub. Commits. Repositories. Forks. Merge Requests. Checkout. Branches.
  6. ¿Qué es Node.js? Cómo funciona el administrador de paquetes Npm. paquete.json y paquete-lock.json. Instalación de npm, desinstalación de npm. Dependencias y dependencias de desarrollo. Crea tu propio paquete.
  7. ¿Qué es un preprocesador? SASS y SCSS. Variables. Importaciones. Anidamiento. Modules Hagfish.

Junior (desarrollador junior)

Después de estudiar la siguiente lista de tecnologías, según lo que veo en Youtube o udemy todos los días, ya puedes convertirte en desarrollador junior en una empresa de TI:

  1. ¿Qué es un modulo assembler? Babel. Setting up Webpack. Rules. Modules Plugins. DevServer. Transition to Vite
  2. ¿Qué es React y qué problemas resuelve? Ciclo de vida de los componentes. Características del árbol DOM virtual. React componentes. Basic hooks and developing your own. React Portals. React Refs. JSX syntax. Props & State.
  3. Características de la arquitectura FLUX. Reducers. Actions. useContext hook Redux and Redux Toolkit. Redux Thunk. RTK Query. (Opcional to learn MobX and/or Zustand)
  4. ¿Qué es una ruta? ¿En qué consiste un objeto Ubicación? Cómo manipular el historial de sesiones usando Historia. React Router Library.
  5. Cómo hacer que el estilo sea más efectivo. ¿Qué es PostCSS? Complemento de módulos CSS. Biblioteca TailwindCSS. ¿Qué es una biblioteca de interfaz de usuario? MUI. Ant Design
  6. ¿Qué es VPS/VDS? Comandos básicos de terminal para sistemas Linux. Derechos de acceso. Ubuntu. Apache. Configuración básica del servidor web. SSH. Cifrado asimétrico. Puedes empezar en Amazon web services.por ejemplo.
  7. ¿Qué es CI/CD? Integración. Entrega. Despliegue. Estructura y ambientación. Pipelines. Artifacts. Stages. Variables

Medio (Especialista Medio)

Si has estudiado todos los temas anteriores, en mi opinión, ya puedes llamarte Desarrollador Front-end Junior. Pero es demasiado pronto para detenerse ahí. Para convertirse en un desarrollador de front-end intermedio, debe estudiar la siguiente lista de tecnologías:

  1. ¿Qué es TypeScript y qué problemas resuelve? Interfaces. Tipos. Genéricos. Enumeración. Integración con la tecnología. Escribiendo una aplicación React.
  2. ¿Qué es la autorización? Identificación. Autenticación. Métodos de autenticación. Bearer Token. JWT. Route protection. OAuth protocol. Integration with services.
  3. ¿Qué está fuera de línea? Cómo funcionan los trabajadores web y de servicios. Registro de servicios. Ciclo de vida de los Trabajadores de Servicios. API de caché. Métodos API de caché. Cómo almacenar en caché una selección de consultas.
  4. ¿Qué es PWA (aplicación web progresiva)? Fiabilidad. Rapidez. Atractivo. Favicón. Configuración del manifiesto.
  5. Cómo configurar la disponibilidad de la aplicación. ¿Qué son los lectores de pantalla y la voz en off? Accesibilidad del teclado. Biblioteca de trampas de enfoque. Semántica. Análisis de accesibilidad vía Lighthouse.
  6. Cómo localizar una aplicación. Objeto navegador. Internacional Pluralización e Internacionalización. Library l18next. Localazy.
  7. ¿Qué es Next.js y qué problemas soluciona? ¿Qué son SSG, SSR, ISR y cuál es la diferencia entre ellos? Aplicación de enrutamiento Next.js. Mejoramiento. SEO.
  8. ¿Por qué los sitios web se ralentizan? Métricas clave de Web Vitals. Análisis de rendimiento. Métodos de optimización. Sacudida de árboles. React.lazy y React.Suspense. Cómo el navegador dibuja páginas. Layout. Paint. Compose. Canalización de renderizado. Análisis de HTML y CSS. Combinando DOM y CSSOM. Árbol de renderizado. Memorización. Memoization. useMemo and useCallback. Image optimization. Houdini Paint API.
  9. ¿En qué consisten las pruebas de aplicación? Monitoreo de errores. Servicio de centinela. Qué es E2E, Unit and Integration Testing. Testing pyramid. Library Jest. Timers Jest. Mock functions. TDD. Testing a React application using the React Testing Library.  Métodos para buscar elementos en una página. Pruebas de eventos. Pruebas E2E con Cypress.

Sénior (desarrollador sénior)

Bueno, pasemos a la última etapa. Después de haber estudiado todas las tecnologías anteriores, ya se ha establecido como un desarrollador de interfaces seguro, pero puede crecer indefinidamente. A continuación he enumerado las tecnologías actualmente relevantes para su desarrollo:

GraphQL, Apollo, PostgreSQL, Fastify, Vue, Angular, Svelte, Remix, Astro, React Native, Relay Modern, Redux Saga, Web 3.0

Esto es sólo una parte de lo que puede aprender y es sólo lo que se aplica al desarrollo front-end. Después de estudiar todas las tecnologías descritas anteriormente, puede pasar al desarrollo Full-stack u otra especialización en general. Lo principal es que te guste lo que haces.

Conclusión

Como comprenderá en este artículo, el camino hacia la TI no es nada fácil y requiere mucho tiempo. Este camino no es en absoluto fácil ni rápido. La velocidad del desarrollo depende directamente de usted y de sus aspiraciones. En mi país Perú hay personas medianas que tienen entre 18 y 19 años y no saben que harán de sus vidas y algunos trabajan solo con HTML algo de CSS y toda6no adaptan a dispositivos móviles y la información está en internet solo pongan cualquiera de las herramientas mencionadas y verán. Debes dedicar tu vida a esto. Haz que tu trabajo sea parte de ti mismo. Deberías disfrutar de tu trabajo. En cualquier caso, vale la pena intentarlo, tal vez te encuentres en esto

Autor Donal Sandro Noblejas Huamán

Lima Perú 🇵🇪

Whatsapp:5192411889751939416004

Sitio web verlista.com/

https://pe.linkedin.com/in/donal-sandro-noblejas-huaman

You may also like

Leave a Comment

Are you sure want to unlock this post?
Unlock left : 0
Are you sure want to cancel subscription?
-
00:00
00:00
Update Required Flash plugin
-
00:00
00:00