Programación Móvil 2_Conexión a Servidores de Internet_Conexión de aplicaciones móviles a servidores LAMP

in #frexusdamgit-appmovilbdlast month (edited)

Autor: @abisa19
Fecha: 13/11/2025
Materia: Desarrollo de Aplicaciones Móviles
Profesor: @frexus


Conexión a servidores en Internet
La conexión a servidores desde dispositivos móviles es fundamental para acceder a datos en tiempo real, realizar actualizaciones y sincronizar información. Las aplicaciones móviles generalmente se conectan mediante protocolos como HTTP/HTTPS , ya que a menudo interactúan con API REST , que actúan como puente entre la aplicación y el servidor.

image.png

Tipos de conexiones en aplicaciones móviles
Las aplicaciones móviles pueden usar distintas formas de conexión:

Cliente-servidor tradicional (usando REST o GraphQL).
WebSockets para comunicación en tiempo real (como chats o juegos).
Firebase o Backend-as-a-Service para soluciones rápidas en la nube.
Conexión asincrónica , que permite trabajar incluso con conectividad limitada.
Estas conexiones definen la experiencia del usuario, especialmente en entornos móviles con conexión variable.

Conexión a bases de datos web desde móviles
Las apps no se conectan directamente a las bases de datos , sino a través de APIs intermedias (como PHP, Node.js o Django), que realizan las operaciones en la base de datos (CRUD: crear, leer, actualizar, eliminar).

La lógica general es:

La app realiza una solicitud (ej. POST, GET) a la API.
La API valida la solicitud.
Se conecta a la base de datos y devuelve una respuesta en JSON.
La app muestra la información al usuario.
Conexión a servidores de aplicaciones desde dispositivos móviles
El servidor de aplicaciones ejecuta la lógica de negocio (como la autenticación o el procesamiento de datos). La app móvil se comunica con estos servidores mediante APIs, donde se gestiona la seguridad, la validación y el control de acceso.


PRACTICA_PARTE 1:

BUENAS PRACTICAS: Para esta parte de las practicas del tema visto en clase se debe hacer el uso de una conexion de base de datos con html y php cimple para poder comprender la conexion de nuestras aplicaciones moviles, para ello:

Usar HTTPS para cifrar los datos.
Validar siempre del lado del servidor.
Implementar tokens de acceso (ej. JWT).
Manejar errores de red con cuidado (timeouts, no hay conexión, etc.).

ACTIVIDAD PRACTICA_PARTE 1:
Requisitos:

XAMPP o LAMP instalado y corriendo (Apache y MySQL).
Editor de código (VS Code recomendado).
Node.js y Expo CLI instalados.
Dispositivo móvil con la app Expo Go (o emulador).
Computadora y móvil conectados a la misma red local.

Paso no.1 Craer la base de datos en phpmyadmin, para esta parte se crea en phpmyadmin crear la base de datos llama "tienda".

image.png

Despues, vamos a crear los datos utilizando el siguente scrip,

CREATE DATABASE tienda;

USE tienda;

CREATE TABLE productos (
  id INT AUTO_INCREMENT PRIMARY KEY,
  nombre VARCHAR(100),
  precio DECIMAL(10,2)
);

INSERT INTO productos (nombre, precio) 
VALUES ('Camisa', 250.00), ('Pantalón', 400.00);

Una ves creada la base de datos, utilizamos una herramienta que nos sirve para poder trabajar con a base de datos ya una ves creada en phpmyadmin, para ello utilizaremos heydysql.

image.png

Parte 2: Crear API PHP (server local):
Para esta parte crearemos dos archivos que nos servira para la conexion de poder ver y mostras los datos registrados en la bse de datos.
/htdocs/tienda-api/
├── conexion.php
├── obtener_productos.php

image.png

Los dos archivos del php (La conexion y el obtener_producto.php):

image.png

Conexión a la Base de Datos:

1. (Codigo de la conexion): 

image.png

2. (Codigo del obtener_Productos): 

image.png

Parte 3: App Móvil en React Native

image.png

EXPO GO APP:

image.png


Caso de estudio:
He leido el caso de estudio narrativo: “ La señal que nunca llegó ” , donde aprendi cómo un error común de conexión casi frustra un emprendimiento móvil.

Después de leer el caso de estudio, responde las siguientes preguntas de reflexión:
A). ¿Qué tipos de conexiones debe dominar un desarrollador móvil para construir aplicaciones funcionales?

Un desarrollador móvil debe dominar varios tipos de conexiones esenciales para garantizar el flujo de información entre el cliente (la app) y los servicios externos. Entre ellas destacan las conexiones HTTP/HTTPS, utilizadas para el consumo de APIs REST, las conexiones WebSocket para comunicación en tiempo real (por ejemplo, chats o actualizaciones instantáneas) y las conexiones asíncronas, que permiten que la aplicación procese datos sin bloquear la interfaz del usuario.

B). ¿Qué errores comunes se cometen al intentar conectar una aplicación móvil con bases de datos?

Uno de los errores más comunes es intentar conectar la app directamente a la base de datos, lo que expone credenciales y vulnera la seguridad. También es frecuente usar direcciones locales (localhost) en lugar de IPs o dominios públicos, lo que provoca fallos cuando la app se ejecuta fuera del entorno de desarrollo.

C). ¿Qué papel juega la API como intermediaria entre la aplicación y el servidor de base de datos?

La API actúa como un intermediario seguro y estructurado que permite que la aplicación móvil se comunique con el servidor y, a través de este, con la base de datos.
Su función principal es recibir solicitudes (requests) desde la app, procesarlas en el backend, ejecutar las operaciones necesarias en la base de datos (lectura, inserción, actualización o eliminación de datos) y devolver una respuesta (response) en formato estándar, como JSON.

D). ¿Por qué no es recomendable que una aplicación móvil se conecte directamente a una base de datos remota?

No es recomendable porque rompe los principios de seguridad y arquitectura cliente-servidor.
Una conexión directa expone credenciales del servidor, abre puertos inseguros y deja la base de datos vulnerable a ataques, inyecciones SQL y manipulación de información.

E). ¿Cómo afectan las decisiones sobre arquitectura de red (local vs. internet) al comportamiento de la aplicación?

La arquitectura de red define el alcance, rendimiento y estabilidad de una app.
Si una aplicación está configurada para operar solo en un entorno local (usando localhost o una red doméstica), funcionará únicamente en ese contexto, pero fallará en producción cuando se ejecute desde Internet.
En cambio, una arquitectura pensada para la red global incluye servidores accesibles públicamente, dominios seguros (HTTPS) y mecanismos de conexión asíncrona.
Las decisiones de Lucas de migrar su backend a un servidor LAMP, usar dominio público y habilitar HTTPS transformaron su app de un experimento local a una aplicación funcional y escalable en la nube.

F) ¿Qué aprendizajes técnicos y emocionales te deja el caso de Lucas sobre trabajar en entornos reales?

Desde el punto de vista técnico, el caso enseña la importancia de comprender el flujo completo de una aplicación móvil: desde la interfaz (frontend) hasta el servidor y la base de datos. Lucas aprendió sobre APIs, CORS, HTTPS, JWT, entornos de producción y arquitectura cliente-servidor, elementos fundamentales para cualquier desarrollador profesional.


Comentario general sobre el caso de estudio “La señal que nunca llegó”

El caso “La señal que nunca llegó” muestra cómo la falta de comprensión sobre las conexiones y la arquitectura de red puede poner en riesgo incluso las mejores ideas. Lucas, el protagonista, experimentó frustración y errores al intentar conectar su aplicación móvil directamente con la base de datos, pero esa experiencia se transformó en un aprendizaje profundo.
Su historia enseña que el desarrollo de aplicaciones va mucho más allá del diseño y la interfaz: requiere entender cómo interactúan las APIs, los servidores y las bases de datos para crear un sistema estable, seguro y funcional. Además, resalta la importancia de la paciencia, la investigación y la resiliencia frente a los problemas técnicos.
En esencia, este caso demuestra que el verdadero crecimiento profesional ocurre cuando un desarrollador asume sus errores, busca soluciones y comprende que una aplicación no solo debe verse bien, sino estar correctamente conectada al mundo real.


PRACTICA _ PARTE DOS DEL FREXUS:

Realiza la actividad práctica guiada: Desarrolla tu propia app móvil con Expo + PHP + MySQL en tu red local y experimenta en tiempo real cómo se crean conexiones y operaciones CRUD.
Después de realizar la actividad práctica, prueba lo siguiente:
• Que la app se conecta correctamente a la IP del servidor local.
• Que se puede ver, agregar y eliminar productos.
• Verifica los errores en la consola si algo falla (CORS, IP incorrecta, etc.).
• Luego genera un reporte de lo que hayas descubierto.

Esta práctica no solo enseña a crear una app con CRUD, sino también cómo se comunican las apps móviles con servidores reales , una habilidad esencial en el desarrollo profesional. Con esta base, puedes llevar tu app a internet simplemente reemplazando la IP local por un dominio o IP pública.


PRACTICA: "App móvil con CRUD conectado a servidor LAMP"

Objetivo general:
Desarrollar una app móvil en React Native (Expo) capaz de conectarse a una API PHP que realiza operaciones CRUD sobre una tabla en MySQL, todo dentro de una red local.

Herramientas necesarias:
MySQ: Base de datos

PHP (Apache o XAMPP): API en backend

React Native + ExpoApp: móvil frontend

Postman (opcional): Prueba de endpoints API

VS Code: Editor de código

Expo Go: Pruebas en el móvil (iOS/Android)

Parte 1: Crear la base de datos
En phpMyAdmin o línea de comandos de MySQL:

image.png

Despues, vamos a crear los datos utilizando el siguente scrip,


USE tienda;

CREATE TABLE productos (
  id INT AUTO_INCREMENT PRIMARY KEY,
  nombre VARCHAR(100),
  precio DECIMAL(10,2)
);

image.png

image.png

image.png

Parte 2: Crear la API en PHP
Estructura del backend (ubicado en /htdocs/api):

api/
├── conexion.php
├── obtener.php
├── crear.php
├── actualizar.php
├── eliminar.php

image.png

image.png

Parte 3: Crear app en React Native con Expo
Crear proyecto:

npx create-expo-app tiendaApp --template -blank
cd tiendaApp
npx expo start

Instala dependencias (opcional si usarás formularios o navegación):
npm install react-native-paper

image.png

image.png

npx expo start

image.png

EXPO GO APP:

image.png


ACTIVIDADES DE REFORZAMIENTO:

-Sopa de Letras:

image.png

image.png

-Crucigrama:

image.png

image.png


CONCLUSIONES FINALES:

Después de estudiar el tema de la conexión de apps móviles con servidores LAMP, comprendí lo importante que es manejar correctamente la comunicación entre una aplicación y un servidor. Aprendí que una app nunca debe conectarse directamente a una base de datos, y entendí por qué: esto puede causar fallas, inseguridad y pérdida de información. Ahora veo claramente el papel fundamental que tiene la API como intermediaria, ya que valida, protege y organiza todo lo que la app envía y recibe.

También entendí que existen distintos tipos de conexión —REST, WebSockets, asincronía y servicios en la nube como Firebase— y que elegir la correcta influye directamente en el rendimiento y la experiencia del usuario. Me quedó muy claro que la arquitectura cliente–servidor es la base de cualquier proyecto móvil profesional.

image.png

Durante la práctica, pude ver cómo pequeños detalles como la IP del servidor, problemas de CORS o rutas mal escritas pueden causar errores importantes. Sin embargo, estos mismos errores me ayudaron a entender mejor el proceso y a desarrollar más paciencia, análisis y precisión. Me di cuenta de que trabajar con servidores reales requiere atención, pruebas constantes y buena organización.

En general, este tema me enseñó tanto la parte técnica como la parte práctica de conectar una app con un servidor real. Ahora me siento más seguro para crear mis propias aplicaciones con operaciones CRUD y para llevarlas después a internet utilizando un dominio o una IP pública.