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.
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.