5. Configuración de Variables de Entorno

Comentarios

Publicar un comentario

Entradas más populares de este blog

18. Visualizar nuestros componentes limpios con StyleSheet

  Tema: 18. Visualizar nuestros componentes limpios con StyleSheet Objetivo: Aprender a organizar y limpiar los estilos de componentes en React Native utilizando StyleSheet.create() , separando la lógica de presentación del JSX para mejorar la legibilidad y mantenibilidad del código. Contenido del tutorial: 1. ¿Qué es StyleSheet? Definición: Una API de React Native que permite definir estilos de manera estructurada y optimizada. Ventajas: Mejora el rendimiento (caché de estilos). Separa estilos de la lógica del componente. Facilita el mantenimiento y reutilización. Valida los nombres de propiedades en tiempo de desarrollo. 2. Importar StyleSheet Se importa desde react-native : jsx import { StyleSheet } from 'react-native' ; 3. Estructura básica de StyleSheet.create() Sintaxis: jsx const styles = StyleSheet . create ({    nombreDelEstilo : {      propiedad1 : valor1 ,      propiedad2 : valor2 ,    },    o...
Leer más

15. Componente Image

  Tutorial: Componente Image en React Native 📱 Parte 15: Componente Image - Mostrando Imágenes en tu App 🎯 Objetivo: Aprender a usar el componente Image para mostrar imágenes en React Native desde diferentes fuentes: archivos locales, URLs remotas y base64. 📸 Analizando el Ejemplo de la Imagen Observando el código de la imagen: javascript < Text style = {{ margin : 5 , fontSize : 20 , fontWeight : 'bold' , color : 'gray' }} >   Componente Imagen </ Text > { /* Imagen local */ } < Image   style = {{ width : 150 , height : 150 }}   source = { require ( './imgs/react-native.jpg' )} /> { /* Imagen remota */ } < Image   style = {{ width : 150 , height : 150 }}   source = {{ uri : 'https://reactnative.dev/img/tiny_logo.png' }} /> Resultado visual esperado: text ┌─────────────────────────────────┐ │ Componente Imagen               │ │         ...
Leer más

Tema: 23. Justify Content en Flexbox para Column (Columna) en React Nativ

Objetivo: Comprender y aplicar la propiedad justifyContent en contenedores con flexDirection: 'column' (valor por defecto) para controlar la distribución vertical de elementos en React Native. Contenido del tutorial: 1. Introducción a justifyContent en columnas Por defecto en React Native: flexDirection: 'column' Cuando usamos flexDirection: 'column' : Eje principal → Vertical (de arriba a abajo) Eje cruzado → Horizontal (de izquierda a derecha) justifyContent controla: Distribución de elementos a lo largo del eje vertical 2. Configuración inicial del ejemplo Código base para columnas: jsx import React from 'react' ; import { View , Text , StyleSheet } from 'react-native' ; const App = () => {    return (      < View style ={ styles . container }>        < View style ={ styles . boxSize }>          < Text style ={ styles . text }> 1 </ Text > ...
Leer más