React Native es uno de los frameworks de software más populares y se ha utilizado para desarrollar aplicaciones como Facebook, Instagram y Skype. Si te dedicas a la creación de aplicaciones móviles, contar con un desarrollador experto en React Native es esencial.
Para encontrar a la persona adecuada para el puesto, primero tienes que establecer un proceso de selección de candidatos exhaustivo. Una vez que hayas evaluado a los candidatos con una evaluación de habilidades de React Native, la entrevista es tu oportunidad para identificar al candidato que mejor se adapte a tu empresa haciendo las preguntas correctas.
El objetivo es encontrar al desarrollador con las habilidades que mejor se adapten a las necesidades de tu organización, ya sea para mantener una cartera existente de aplicaciones o construir aplicaciones completamente nuevas desde cero.
Con nuestras 40 preguntas de entrevista sobre React Native a continuación, tendrás la posibilidad de adaptar las entrevistas a las necesidades específicas de tu negocio.
Hemos dividido las preguntas en tres categorías, basadas en el nivel de experiencia necesaria para el puesto que buscas cubrir:
Básico, para desarrolladores React Native junior
Intermedio, para desarrolladores React Native con algo de experiencia
Avanzado, para desarrolladores React Native senior
Además incluímos ejemplos de respuestas para cada pregunta para que puedas evaluar a los candidatos de forma efectiva, incluso si no tienes experiencia con React Native.
Puedes utilizar estas preguntas de entrevista de nivel básico para evaluar las habilidades y los conocimientos de los desarrolladores de React Native principiantes o junior al inicio de sus carreras.
Ejemplo de respuesta:
Desde su lanzamiento en 2015, React Native ha construido una reputación como framework de JavaScript confiable y efectivo. Algunas de sus principales fortalezas incluyen:
Compatibilidad multiplataforma: La mayor parte del código es multiplataforma, lo que significa que los desarrolladores solo tienen que crear una aplicación en lugar de dos aplicaciones separadas para iOS y Android
Feedback en tiempo real: React Native ofrece una función de "hot reloading" que permite a los desarrolladores ver inmediatamente los cambios realizados que han realizado en una ventana de vista previa independiente
Interfaz de usuario flexible: La interfaz de React Native es adaptable y facilita que varios desarrolladores trabajen juntos en un proyecto
Plugins de terceros: React Native es compatible con muchos plugins de terceros que se pueden utilizar para apoyar y mejorar el proceso de desarrollo de aplicaciones
Comunidad: Como framework de código abierto popular, React Native cuenta con una gran comunidad de desarrolladores que intercambian conocimientos
Ejemplo de respuesta:
React Native se utiliza para desarrollar aplicaciones móviles para iOS y Android, mientras que ReactJS se utiliza para crear aplicaciones web en un navegador web.
Ambos utilizan componentes de XML de JavaScript reutilizables, pero la sintaxis varía: mientras que React Native utiliza componentes de vista de la aplicación como y , ReactJS utiliza etiquetas HTML como y .
Ejemplo de respuesta:
Las aplicaciones híbridas están desarrolladas para ser utilizadas en todas las plataformas, mientras que las aplicaciones nativas están desarrolladas para una plataforma específica. React Native se utiliza para el desarrollo de aplicaciones híbridas.
Si bien las aplicaciones híbridas son más rápidas de desarrollar y generalmente requieren menos mantenimiento que las aplicaciones nativas, es posible que su rendimiento sea ligeramente inferior al de sus homólogas nativas.
Ejemplo de respuesta:
React Native es una gran opción para desarrollar una aplicación híbrida que no requiera un rendimiento extremadamente alto.
La compatibilidad multiplataforma significa que los equipos de desarrollo pueden ahorrar mucho tiempo al utilizar React Native en comparación con un framework nativo.
Sin embargo, puede que no sea adecuado para diseñar aplicaciones complejas o si los desarrolladores no están familiarizados con el código de React.
Ejemplo de respuesta:
Los componentes son los bloques de construcción de React Native; cuando se combinan, forman la aplicación en su totalidad. Algunos de los componentes más comunes son:
View, utilizado para mostrar todo el diseño de la app
Text, utilizado para mostrar texto
TextInput, utilizado para introducir texto
ScrollView, utilizado para insertar un contenedor de desplazamiento
StyleSheet, utilizado para insertar objetos de estilo
Image, utilizado para renderizar imágenes
Button, utilizado para insertar botones
Ejemplo de respuesta:
El desarrollo orientado a componentes (CDD) es una metodología de desarrollo en donde el proceso de construcción se centra en componentes en lugar de objetos. Los componentes están débilmente acoplados y cada cumple su propio propósito.
Cuando se combinan, los componentes (botones, barras de navegación, imágenes) forman el programa como un todo. React Native es un framework basado en componentes.
Ejemplo de respuesta:
Los props proporcionan propiedades a los componentes insertados en un programa, lo que hace que los componentes sean modificables y personalizables. Por ejemplo, el mismo componente puede ser utilizado en diferentes partes de una aplicación. Cuando usamos props, podemos alterar la apariencia o el comportamiento del componente.
Ejemplo de respuesta:
AsyncStorage es el módulo de almacenamiento de React Native basado en clave-valor y no encriptado que permite a los desarrolladores almacenar datos para su uso sin conexión. Normalmente, se utiliza para almacenar datos cuando una aplicación no está vinculada a un servicio en la nube, o cuando características específicas requieren almacenamiento de datos.
Ejemplo de respuesta:
En las aplicaciones React Native, Flexbox se utiliza para proporcionar un diseño consistente a través de diferentes tipos de pantalla. El algoritmo Flexbox ayuda a estructurar el posicionamiento de los diferentes componentes y crear una UI responsiva para el usuario final.
Ejemplo de respuesta:
En React Native, el estado se refiere a la información sobre una propiedad en un momento dado. A diferencia de las props (propiedades), el estado es mutable; puede cambiar. Normalmente, esto ocurre cuando un usuario interactúa con el componente.
Por ejemplo, si tu aplicación tuviera un formulario de llenado para que los usuarios lo completen, el estado de ese componente cambiaría cuando el usuario escribe algo.
Ejemplo de respuesta:
En React Native, puedes importar componentes que hayas creado tú mismo o importar componentes ya creados desde otro archivo.
Para importar un componente, necesitas escribir <import component="" from="">, cambiando la palabra entre corchetes según el tipo de componente que deseas importar.</import>
Ejemplo de respuesta:
Si bien React Native se utiliza generalmente con JavaScript, también es compatible con otros lenguajes de programación a través de la Interfaz Nativa de Java (JNI) del framework, como Python, C++ y C.
Ejemplo de respuesta:
En React Native, el código JavaScript se ejecuta a través de dos motores:
JavaScriptCore se utiliza en simuladores iOS y emuladores Android; prácticamente todas las operaciones se ejecutan a través de este motor
V8 se utiliza cuando se realiza la depuración en Chrome
Puedes usar estas preguntas de entrevista de nivel intermedio para puestos de desarrollador React Native con experiencia media, donde el candidato ya cuente con algunos años de experiencia.
Ejemplo de respuesta:
Como cualquier framework de software, React Native tiene sus inconvenientes. Éstos incluyen:
Falta de natividad: React Native no es una solución nativa, lo que significa que sus aplicaciones pueden ser ligeramente más lentas que las nativas
Problemas de depuración: React Native se construye utilizando Javascript, Objective-C, Java y C o C ++, lo que puede dificultar la depuración
Gestión de memoria: Las limitaciones de memoria hacen que React Native no sea adecuado para desarrollar aplicaciones de cálculo intensivo
Baja seguridad: El diseño de código abierto de React Native deja las apps más expuestas a amenazas, lo que es especialmente peligroso para apps que contienen información sensible, como servicios bancarios
Curva de aprendizaje: React Native es uno de los frameworks de software más difíciles de aprender, especialmente para desarrolladores junior
Ejemplo de respuesta:
Algunos de los problemas de rendimiento más comunes en React Native incluyen:
Alto uso de CPU: Transferir funciones complejas al hilo de JavaScript puede causar problemas de rendimiento
Fugas de memoria: Se puede perder información en el puente durante la transferencia del dominio principal al dominio de React Native, especialmente en aplicaciones de Android
Navegación lenta:El puente entre múltiples hilos también puede provocar tiempos de navegación más lentos
Ejemplo de respuesta:
Existen diversas técnicas para optimizar el rendimiento de una aplicación en React Native, como:
Eliminar todas las sentencias de consola
Redimensionar y reducir el tamaño de las imágenes
Almacenar en caché las imágenes internamente
Comprimir o convertir datos JSON sin procesar
Utilizar la división de código para listas grandes
Programar animaciones
Eliminar bibliotecas y funciones innecesarias
Ejemplo de respuesta:
El proceso de renderización del código en React Native es el siguiente:
Cuando se abre la app, el hilo principal (o hilo UI) comienza la ejecución cargando paquetes JavaScript
Una vez que el código JavaScript se ha cargado correctamente, el hilo principal lo envía al segundo hilo JS donde se realizan más cálculos
Cuando React Native comienza la renderización, el algoritmo reconciliador genera un DOM virtual o diseño, que luego se envía a un tercer hilo paralelo
El hilo paralelo calcula un nuevo DOM y envía las características del diseño al hilo principal de la interfaz de usuario
El hilo de la interfaz de usuario luego renderiza el DOM recibido para mostrarlo en la aplicación móvil
Ejemplo de respuesta:
El puente actúa como capa de transporte entre los módulos JavaScript y Native. En el proceso de renderizado:
El puente recibe primero la respuesta del usuario para abrir la app desde el módulo Native
A continuación, pasa la carga útil serializada al módulo JavaScript
Una vez que el evento ha sido procesado y se ha generado un DOM virtual en el módulo JavaScript, el puente recibe la respuesta serializada por lotes
El puente pasa la respuesta serializada por lotes al módulo Native para la renderización final
Ejemplo de respuesta:
En React Native, el manager de interacciones se utiliza para aplazar la ejecución de una función hasta que se haya completado una "interacción" especificada.
Esto es importante porque React Native tiene un único hilo de ejecución (single-threaded), lo que significa que las animaciones en cola de la interfaz de usuario pueden congestionarse. El administrador de interacción ayuda con este problema y garantiza que las animaciones se ejecuten sin problemas y de forma programada.
Ejemplo de respuesta:
Fabric es un tipo de arquitectura moderna creada en 2018 que busca solucionar algunos problemas de rendimiento en React Native. Fabric moderniza la capa de renderizado del framework permitiendo que tareas con prioridad específica se ejecuten de forma síncrona, mejorando así la velocidad.
Ejemplo de respuesta:
En React Native, existen dos formas principales de realizar la depuración:
Depuración remota
Para iOS, abre el menú y selecciona ''Depurar remotamente''
Para Android, abre el menú y selecciona "Depurar remotamente"
La opción "Depurar remotamente" abrirá la herramienta de Depuración para desarrolladores de Chrome
Depuración dentro de la aplicación
Para iOS, ejecuta el comando adb shell react-native start --inspect
Para Android, ejecuta el comando adb shell react-native start --inspect
Estos comandos iniciarán las herramientas de depuración integradas en la aplicación para el sistema operativo correspondiente.
Ejemplo de respuesta:
La inserción de texto básico en aplicaciones React Native se gestiona mediante los componentes Text y TextInput. TextInput permite a los usuarios escribir en la app. Podemos implementarlo usando la siguiente sintaxis: <import text="" textinput="" view="" from="">.</import>
Ejemplo de respuesta:
Existen varios trucos útiles para optimizar el rendimiento de las imágenes en React Native. Estos incluyen:
Utilizar herramientas de almacenamiento en caché de imágenes
Utilizar formatos PNG o WEBP en lugar de JPEG
Utilizar imágenes más pequeñas
Reducir el número de renderizados
Ejemplo de respuesta:
En React Native, los temporizadores permiten a los desarrolladores manipular el orden en el que se producen los eventos en un programa. Hay cuatro tipos diferentes de temporizadores y cada uno cumple un propósito diferente:
Timeout implementa un retraso
Interval permite repetir acciones a intervalos dados
Immediate permite que las acciones ocurran lo antes posible
Animación permite que las animaciones se muestren cuando el programa está listo para renderizar fotogramas
Ejemplo de respuesta:
Los hooks permiten a los desarrolladores "engancharse" en componentes existentes y acceder a su estado y características de ciclo de vida. Anteriormente, estas no serían accesibles para su uso en otros lugares. Con los hooks, los desarrolladores ahora pueden aprovechar el estado y las características del ciclo de vida de un componente sin tener que escribir una nueva clase.
Ejemplo de respuesta:
Podemos crear botones básicos usando la siguiente sintaxis: <import view="" button="" stylesheet="" from="">. Los botones básicos admiten un nivel mínimo de personalización y pueden modificarse utilizando TouchableOpacity o TouchableWithoutFeedback.</import>
Ejemplo de respuesta:
La actualización rápida permite a los desarrolladores obtener comentarios casi instantáneos sobre los cambios recientes en su aplicación. Una vez que se activa "Habilitar actualización rápida" en el menú de desarrollador, cualquier edición nueva en el programa se hace visible en unos pocos segundos para una evaluación fácil.
Puede utilizar las preguntas de entrevista de nivel avanzado a continuación cuando contrates a un desarrollador de React Native senior con varios años de experiencia.
Ejemplo de respuesta:
La mayoría de los datos de React Native se almacenan en Async Storage. Como una forma de almacenamiento local sin cifrar, no es adecuada para almacenar datos sensibles como tokens y contraseñas.
Como alternativa, React Native Keychain ofrece una forma segura de almacenamiento que también funciona de forma similar a Async Storage. Para iOS, el almacenamiento Keychain se puede utilizar para proteger datos sensibles, mientras que los desarrolladores de Android pueden utilizar Facebook Conceal y Android Keystone.
Ejemplo de respuesta:
Cuando se presentan problemas de rendimiento, hay varias soluciones disponibles para los desarrolladores. Por ejemplo, aquí hay algunas soluciones para algunos problemas comunes de rendimiento:
Alto uso de CPU: La optimización de las aplicaciones mediante la compresión de datos, la eliminación de renderizaciones innecesarias y el uso de almacenamiento en caché mejorará la velocidad de rendimiento
Fuga de memoria: Las fugas de memoria pueden evitarse depurando, evitando el uso de sentencias de consola y comprobando regularmente el código en busca de inconsistencias
Navegación lenta: Utilizar React Navigation en lugar de otras herramientas de navegación como Navigator o NavigationExperimental ayudará a resolver los problemas de navegación
Ejemplo de respuesta:
Alrededor del 85% del código de React Native es multiplataforma, lo que significa que la mayoría de los procesos son los mismos tanto en iOS como en Android. Sin embargo, hay algunas diferencias menores. Estas incluyen:
El desarrollo en iOS utiliza Mac y Xcode, mientras que el desarrollo en Android se basa en Android SDK y un emulador
Los plugins de terceros que no ofrecen funcionalidad nativa tendrán que utilizarse de forma diferente
El proceso de puente puede ser ligeramente diferente cuando al desarrollar aplicaciones complejas
Ejemplo de respuesta:
Se pueden seguir varios pasos para optimizar las animaciones en React Native. Estos incluyen:
Usar lazy loading para que los componentes solo se rendericen cuando estén en uso
Eliminar los valores animados del estado para evitar sobrecargas innecesarias
Usar shouldComponentUpdate para acelerar el proceso de renderizado
Utilizar useNativeDriver para Android para transferir todo el trabajo de animación a la capa nativa
Ejemplo de respuesta:
Utilizar plugins de informes de errores de terceros para obtener un informe de errores y diagnosticar aún más el fallo. Estos plugins ayudan a recopilar, organizar y analizar informes de errores, y también proporcionan soluciones rápidas para que la aplicación pueda volver a funcionar. Algunos plugins populares de informes de errores incluyen:
Bugsnag
Crashlytics
Sentry
TestFairy
Rollbar
Ejemplo de respuesta:
Redux es una útil herramienta de gestión de estados. Se puede implementar siguiendo estos pasos:
Instala los paquetes Redux necesarios en línea
Crea una carpeta Redux en la raíz de la app
Dentro de la carpeta Redux, añade tres archivos: actions.js, reducer.js, y store.js
En el nuevo archivo reducer.js, importa desde 'redux'
En el archivo store.js, importa desde 'redux' para crear el store
Importa la tienda a la app React Native
Ejemplo de respuesta:
En React Native, TouchableOpacity es un contenedor utilizado para cambiar la transparencia de un botón. Cuando se utiliza en un botón, la opacidad disminuye en respuesta al tacto, lo que permite a los usuarios ver el fondo cada vez que lo presionan.
Ejemplo de respuesta:
Flexbox generalmente funciona de la misma manera en React Native como lo hace en CSS en la web. Sin embargo, hay algunas diferencias menores en los valores. Estas incluyen:
El valor por defecto en React Native es columna, mientras que el valor por defecto para CSS es fila
El valor por defecto en React Native es flex-start, mientras que el valor por defecto para CSS es stretch
El valor por defecto en React Native es 0, mientras que el valor por defecto para CSS es 1
Ejemplo de respuesta:
Una fuga de memoria ocurre cuando la memoria que ya no es necesaria para una aplicación permanece en la aplicación en lugar de ser devuelta al sistema operativo. Esta es una de las causas más comunes de problemas de rendimiento.
En teoría, la gestión de la memoria la realiza automáticamente el recolector de basura. Sin embargo, este proceso sigue siendo propenso a errores. Las herramientas de depuración pueden emplearse para detectar problemas de fuga de memoria. Algunas de las causas más comunes de estos problemas son:
Temporizadores y oyentes en componentDidMount
Estilos en línea
Fugas de ámbito de cierre
El uso de console.log
La depuración puede identificar la raíz de la fuga de memoria; una vez eliminada, el problema debería estar resuelto.
Respuesta de ejemplo:
Existen varias técnicas para optimizar el rendimiento de los elementos de FlatList. Por ejemplo, podemos:
Evitar el uso de imágenes en alta definición (1080p)
Optimizar la propiedad maxToRenderPerBatch
Utilizar la propiedad getItemLayout
Utilizar la propiedad keyExtractor
Reducir el número de vistas
Optimizar la propiedad windowSize
Ejemplo de respuesta:
La recarga en vivo en React Native actualiza toda la aplicación cuando cambia un archivo, mientras que la recarga en caliente solo actualiza los archivos que han cambiado.
Cuando se utiliza hot reloading en una aplicación, el estado sigue siendo el mismo y el desarrollador vuelve a la página en la que comenzó. Lo contrario ocurre con live reloading.
Ejemplo de respuesta:
ScrollView carga todos los elementos de datos en una sola pantalla con fines de desplazamiento. Todos los datos se almacenan en RAM, lo que puede causar problemas de rendimiento para grandes cantidades de datos.
FlatList solo muestra los elementos que se muestran actualmente en la pantalla (10 por defecto), evitando así cualquier problema de rendimiento.
Por lo tanto, es mejor utilizar FlatList para grandes conjuntos de datos, mientras que ScrollView se puede utilizar para conjuntos de datos más pequeños.
Ejemplo de respuesta:
Los vectores son una parte integral del diseño de aplicaciones en React Native. Se pueden instalar inicialmente ejecutando el siguiente comando: npm install react-native-vector-icons. Luego, los iconos vectoriales seleccionados pueden importarse a la aplicación de React Native para su uso.
Respuesta de ejemplo:
En React Native, setNativeProps se utiliza para cambiar un componente directamente en un nodo DOM en lugar de en el estado de la aplicación. Aunque esto puede ayudar a resolver problemas, también hace que el código sea más difícil de trabajar en el futuro.
Se considera una solución de respaldo para problemas de rendimiento relacionados con animaciones y solo debe usarse si setState y shouldComponent no resuelven el problema.
Realizar una entrevista efectiva es un paso importante a la hora de contratar a un nuevo desarrollador de aplicaciones, pero varios otros pasos deben venir antes de eso. La naturaleza técnica de React Native implica que es esencial evaluar primero la competencia del candidato.
Por ejemplo, puedes crear una tarea con límite de tiempo en React Native para que los candidatos completen, como identificar problemas con un fragmento de código de muestra. Adapta la tarea a las necesidades de tu empresa siempre que sea posible.
Alternativamente, puedes utilizar la prueba de React Native de TestGorilla para evaluar rápidamente las habilidades y conocimientos de los candidatos, y preseleccionar a los mejores, a los que podrás invitar a una entrevista. Esto te permite simplificar y optimizar la etapa de selección además de evaluar la experiencia de un candidato incluso si no tienes conocimientos de programación.
Realizar una evaluación de habilidades al principio del proceso de selección te ayudará a identificar a los candidatos más capacitados. Así podrás dedicar más tiempo a los candidatos preseleccionados: en lugar de realizar decenas de entrevistas y evaluaciones de programación, podrás concentrarte solo en unos pocos.
Esto te permite comparar con confianza la experiencia de los candidatos con las necesidades de tu empresa para evaluar si son adecuados para el puesto.
Al utilizar las preguntas de la entrevista anteriores junto con las evaluaciones de habilidades, puedes identificar a los mejores candidatos para tu empresa. Con el desarrollador React Native adecuado en tu equipo, podrás competir en el mercado de aplicaciones móviles en constante evolución y extremadamente lucrativo, que actualmente se estima en 700.000 millones de dólares.
Recuerda adaptar tus preguntas al nivel de experiencia adecuado y a los requerimientos de tu empresa. El proceso de selección no consiste en encontrar al mejor desarrollador React Native en general, sino al que mejor se adapte a las necesidades de tu empresa.
La prueba de React Native de TestGorilla puede ayudarte a encontrar a los mejores desarrolladores React Native de forma rápida y sin prejuicios. Regístrate gratis hoy mismo y comienza a tomar mejores decisiones de contratación.
Crea evaluaciones previas al empleo en minutos para evaluar a los candidatos, ahorrar tiempo y contratar a los mejores talentos.
Sin spam. Cancela la suscripción en cualquier momento.
Nuestras pruebas de selección identifican a los mejores candidatos y hacen tus decisiones de contratación más rápidas, fáciles y libres de prejuicios.