Comprende el modelo cliente-servidor con claridad: cómo se conecta el navegador con un servidor, qué papel juegan las bases de datos, y por qué tecnologías como PHP, Node.js, NGINX o Apache son clave. Aquí verás cómo se comunican HTML, CSS y JavaScript con el back end mediante GET, POST, AJAX y WebSockets, además de ejemplos de stacks como LAMP y MEAN, y un proyecto local con Arduino.
¿Qué es el modelo cliente servidor y por qué importa?
El cliente es tu navegador: abre un archivo HTML que invoca JavaScript y produce interacción. A esto se le llama front end. El servidor vive en Internet o en la nube, ejecuta el back end y se conecta a las bases de datos para procesar y devolver resultados seguros.
- El front end corre en el navegador y usa HTML, CSS y JavaScript.
- El back end corre en el servidor y accede a la base de datos para procesar datos.
- Los programadores suelen especializarse en uno, pero entienden ambos mundos.
Sobre bases de datos: existen muchas. MySQL (relacional) y MongoDB (no relacional que trabaja con JavaScript) son muy populares; MySQL es más usada. También se mencionan Oracle, SQL Server y PostgreSQL.
¿Cómo se conectan front end, back end y bases de datos?
Cuando escribes una URL, ocurre una cadena de eventos que transforma un nombre de dominio en una respuesta con HTML, CSS y JavaScript. La seguridad depende de no exponer datos sensibles en el front end y de usar el back end como guardián de acceso.
¿Qué sucede desde la URL hasta la respuesta?
- El dominio se resuelve en un servidor de DNS y se obtiene una IP.
- Un software de servidor como NGINX, Apache o el propio Node.js recibe la URL.
- El back end (por ejemplo, Go, Python, Node.js) procesa la petición y consulta MySQL o MongoDB.
- Devuelve al navegador un resultado listo: HTML, CSS y JavaScript.
El servidor escucha en un puerto: el web suele ser el 80 por defecto; el navegador lo añade de forma automática.
¿Por qué no acceder directo a la base de datos?
- El código del front end es visible y no se puede proteger de forma real.
- Conectarse a la base de datos desde el navegador expondría datos de otros usuarios.
- El front end envía credenciales al back end; este decide qué datos leer y regresar según permisos.
¿Qué métodos usa el front end para hablar con el back end?
- GET: envía variables en la URL. Útil para filtros, no para contraseñas.
https://tienda.com/autos?marca=ferrari&modelo=2016
- POST: envía datos “por debajo” en los headers HTTP mediante formularios; ideal para usuario y contraseña.
- AJAX: actualiza partes de la página sin recargar, de forma asíncrona.
- WebSockets: comunicación en tiempo real bidireccional, útil en chats y videojuegos.
¿Qué stacks, servidores y herramientas debes conocer?
En front end la base es HTML5, CSS3 y JavaScript (ECMAScript 6). Cuando inicias, céntrate en estas tres. En back end, el lenguaje popular es PHP, pero también puedes usar Ruby on Rails, Python, Node.js, Go, Java, C# ASP .NET o incluso WordPress como CMS. En servidores destacan NGINX, Apache, Node y, en tecnologías Microsoft, IIS.
¿Qué tecnologías componen el front end?
- HTML5 para estructura.
- CSS3 para estilos.
- JavaScript (ES6) para interactividad.
- Librerías y herramientas: Angular, React JS, Stylus, Jade (opcionales al inicio).
¿Qué stacks destacan y para qué sirven?
- LAMP: Linux + Apache + MySQL + PHP; stack clásico para web.
- MEAN: MongoDB, Express, AngularJS, Node.js; popular para apps JavaScript completas.
- Un ejemplo empresarial: MySQL, Nginx, MongoDB y lenguajes de servidor como Python con Django, Go y Node.js.
- Para tiempo real se usan sockets: comunicación cliente-servidor constante, ideal en chats y videojuegos.
¿Cómo montar un servidor local con Arduino y Node.js?
- IP local del propio equipo:
127.0.0.1 (también localhost).
- Puerto recomendado en desarrollo:
8080 (se evita el 80 por uso del sistema).
- Stack del proyecto: Node.js (también referido como NoJS), Express en el servidor, y JavaScript + HTML en el navegador.
- Por qué servidor: el navegador no accede a dispositivos; el servidor, como programa nativo del sistema, sí puede usar el puerto USB para hablar con Arduino.
¿Con qué parte te quedas: front end, back end o ambos? Cuéntame en los comentarios qué te gustaría construir y qué stack te interesa explorar.