A lo largo de tu vida como programador o programadora, te encontrarás con múltiples conceptos que debes conocer y que verás realmente en todas partes. Protocolos, servidores, puertos, el funcionamiento de cada tecnología. Veamos a continuación un explicativo de conceptos básicos que tienes que comenzar a interiorizar.
Estructura de un dominio
Las páginas web se identifican por un dominio único e irrepetible. Conocerás el dominio de Google (https://google.com) o el dominio de Platzi (https://platzi.com).
Los dominios son también llamados URI y están compuestos por varias partes.
¿Qué es una URI?
URI son las siglas en español de Identificador de Recursos Uniforme y es ese identificador único de una página web. El mismo está compuesto por dos partes, una URL (Localizador de Recursos Uniforme) y una URN (Nombre de Recurso Uniforme).
Composición de una URI
Dentro de una URI, podemos identificas varias partes que componen a la misma:
URI:
Esquema: Protocolo que la URI utiliza, pudiendo ser HTTP o HTTPS.
Dominio: Nombre del dominio de la página.
Puerto: Puerto por el que el servidor se encuentra “escuchando” para responder con la información de la página.
Ruta: Nombre de la página concreta que queremos solicitar dentro del dominio.
Cadena de búsqueda: Parámetros opcionales o variables para dar más información a la ruta.
URN:
Nombre: Hace referencia a una sección particular dentro de una página. También denominado “fragmento”.
Entendiendo cómo se compone un dominio, profundicemos y comprendamos el qué y el porqué de cada parte.
Protocolo HTTP
Conoces vagamente lo que es el protocolo HTTP o HTTPS. El Protocolo de Transferencia de Hipertexto es una forma estandarizada de hacer las cosas o de transmitir información, en este caso. La S de HTTPS significa Secure o seguro y permite la transferencia de datos codificados para evitar robo de información.
Tal vez recuerdes el significado de HTML (Lenguaje de Marcado de Hipertexto), mientras que el protocolo HTTP también hace referencia a esa palabra: “Hipertexto”. HTTP es el método de transferencia de este tipo de información.
Muchas veces el protocolo que utilizamos cuando utilizamos un navegador se encuentra implícito. Observamos la URI y solo vemos platzi.com/home, el HTTPS siempre se encuentra ahí, pero para hacer más amena la lectura de un dominio, los navegadores lo ocultan.
También cabe mencionar el famoso “WWW” que muchas veces acompaña a una URI. Puedes encontrarlo con el nombre de W3 o simplemente “La Web”. El mismo significa World Wide Web o Red Informática Mundial.
Dominio de una página
El nombre propiamente dicho de una página se lo conoce como Dominio. Cuando hablamos de “la página de Platzi”, hacemos referencia a su dominio que es https://platzi.com.
Observa también el .com que tantas veces has visto en otras páginas. La extensión de los dominios hacen referencia al grupo al que este pertenece. Pudiendo tener extensiones gubernamentales como .gob, extensiones propias de un país como .ar o .mx o extensiones de otro tipo como .net que también es muy utilizado, entre muchos otros tipos de extensiones.
Los dominios son también denominados como DNS (Domain Name System). Es un concepto algo más avanzado que no debes preocuparte en este momento, pero en pocas palabras, es la forma de resolver y localizar una página web en internet en todo el mundo.
Imagina que en el mundo existen cientos de miles y miles de servidores con páginas webs. ¿Cómo encontrar el servidor de Platzi? Los DNS resuelven esto y permiten que la página de Platzi llegue a tu navegador.
Puertos
Los puertos son ese canal por el que se intercambia información entre un cliente y un servidor o entre subsistemas. Es un número que va del 0 al 65535 (2^16) y se aconseja escoger uno a partir del 1024. Muchas tecnologías o protocolos tienen un puerto por defecto ya establecido como el puerto 80 para HTTP o el puerto 443 para el HTTPS.
Si utilizamos un puerto que ya se encuentra en uso, podemos tener problemas con nuestra aplicación. Por este motivo, se utilizan a partir del puerto 1024, dado que de ahí para atrás muy posiblemente ya se encuentran en uso en tu computador.
A medida que ganes experiencia en múltiples tecnologías te encontrarás con que existen muchos otros puertos ya predefinidos como el puerto 21 para el protocolo FTP, 22 para SSH, 3306 para MySQL, entre otros. Para NodeJS, se suele utilizar el puerto 3000 o el 8080.
Los puertos suelen estar ocultos y no los verás en una URI. Cuando accedes a una página a través de HTTP, implícitamente estás utilizando el puerto 80 o el puerto 443 si se trata de HTTPS. Si decides cambiar el puerto (no es recomendable), si deberás hacer referencia al mismo como platzi.com:3000/.
Ruta de una página
La ruta es el nombre de una página en particular dentro de toda una página web. El nombre de cada página es asignado por el propio programador. Si te encuentras desarrollando una página de un buscador, puedes denominar a la misma como /buscador o /search, la páginas principal de una web suele ser /home o simplemente /.
Te animo a explorar la ruta de cualquier página que visites. Verás que su nombre siempre está relacionado con el contenido de la misma.
Parámetros de consulta
Los parámetros de consulta deben ser opcionales. Una página continuará funcionando o será correctamente localizada existan o no estos.
Los mismos comienzan luego de un ? seguido del nombre de la variable y de su valor. Si una página tiene más de un parámetro, estos se separan con el caracter &. Por ejemplo: ?nombre=freddy&pais=colombia.
Estos parámetros se suelen utilizar para crear buscadores. Son variables para crear filtros de búsquedas o pasarle información dinámica que será capturada por la aplicación y manipulada.
Sección de una página
Dentro de una misma página encontrarás varias secciones. Las mismas pueden identificarse con un nombre en particular o un ID. En el URI, puedes hacer referencia a esta sección con un # seguido del nombre de dicha sección. Por ejemplo https://platzi.com/home#routes.
Observarás que, al ingresar a este tipo de URI, serás dirigido directamente a esa sección dentro de la página. Es una forma de crear un “atajo” para el usuario cuando la página tiene mucho contenido.
Localhost o servidor local
La palabra localhost será parte de ti de ahora en adelante. La misma significa “servidor local” y hace referencia a tu propio computador. Cuando levantas un servidor con NodeJS, puedes ingresar desde un navegador con localhost:3000/ o con el puerto que hayas elegido.
Cualquier otra aplicación o programa que se encuentra ejecutándose en tu computador, también podrás acceder a él desde locahost:<puerto>/.
Peticiones HTTP
Ya sabes lo que es el protocolo HTTP, pero aún hay un concepto más que debes interiorizar.
Las solicitudes o peticiones que realices por medio de HTTP a un servidor puede ser de varios tipos, cada uno de ellos destinado a un propósito específico. Los diferentes tipos de solicitudes HTTP se conocen como “Verbos HTTP”. Veamos de qué tipos existen:
GET: El verbo GET se utiliza para la obtención de datos. Es el más utilizado. Siempre que ingresas a una página web, la solicitud se realiza por GET.
POST: Utilizarás POST para la creación de datos o registros. POST tiene la particularidad de que codifica la información para el envío de datos secretos.
PUT: PUT se usa para la actualización de datos, para indicarle al servidor de la actualización completa de un registro.
PATCH: PATCH es muy similar a PUT, con la diferencia de que suele implementar para actualizar un solo dato de un registro.
DELETE: Así como puedes obtener, crear y actualizar información, DELETE lo utilizarás para el borrado de datos.
No son todos, aún hay más tipos, pero estos son los más utilizados y que tienes que comenzar a conocer de momento.
Muchos de los verbos HTTP son intercambiable. O sea, siempre podrás obtener datos a través de PUT o POST, o borrar los mismos a través de GET. Las buenas prácticas de desarrollo de software, y los buenos programadores, respetan las “reglas” del protocolo y te aconsejo que tú también lo hagas.
Conclusión
Muchos conceptos, mucha información nueva para ti. Te aconsejo que vuelvas a ver esta clase en varias oportunidades para consolidar el conocimiento, ya que todos los conceptos vistos aquí, te acompañarán el resto de tu vida como desarrollador de software.
¿Notan que casi nunca utilizamos URLs que especifiquen un puerto? Esto es porque los navegadores automáticamente buscan el puerto 80 para páginas que usen HTTP y el puerto 443 para páginas que usen HTTPS.
entre los verbos más importantes estan:
GET: pedir o traer un recurso
POST: enviamos datos en segundo plano, pueden ser datos sensibles como un inicio de sesión
PUT: reemplaza representaciones actuales, es decir, las modifica
DELETE: elimina ese recurso
Te comento un poco acerca de los métodos HTTP: Lo definimos con la acción que vamos a realizar con un Recurso especifico y lo podemos clasificar en: GET: pedir o traer un recurso POST: enviamos datos en segundo plano, pueden ser datos sensibles como un inicio de sesión PUT: reemplaza representaciones actuales, es decir, las modifica DELETE: elimina ese recurso
Hay más pero estas son las principales o las más usadas que utilizaras en el desarrollo BACK-END
Notan que en las primeras clases del curso, habian muchos comentarios, aportes , etc y ahora somos pocos los que hemos llegado al final del curso, felicitaciones a todos!!!
El puerto es el número por medio del cual vamos a indicarle a la computadora, exactamente, a cuál de todos los programas que tiene ejecutándose nos queremos conectar.
El método POST se utiliza para enviar una entidad a un recurso en específico, causando a menudo un cambio en el estado o efectos secundarios en el servidor.
GET: Es solicitar informacion, del lado del cliente al servidor.
POST Es enviar nueva informacion desde el cliente hacia el servidor, creamos nuevos recursos como usuarios, comentarios, etc.
PUT: Es actualizar información o un recurso que ya exista.
DELETE: Para eliminar o borrar un recurso.
PATCH: Para actualizar parcialmente un recurso, la diferencia con put es que este actualiza todo el recurso,
mientras que patch se utiliza cuando queremos actualizar solo una partesita de un recurso.
HEADER: Permite consultar la existencia de un recurso.
OPTIONS: Lo utilizan los navegadores de manera nativa y permite que el navegador valide que si estoy haciendo una petición desde un dominio A, hacia un dominio B, el navegador va a decirle primero una peticion tipo options, solo si el dominio es diferente y lo hacen unicamente los navegadores, (Lo utilizan los navegadores de manera nativa).
A continuación tienes un listado de los verbos existentes en el protocolo estándar HTTP:
GET: Obtiene el recurso indicado. Es el método que se utiliza cuando se pide el contenido de una página web, por ejemplo.
HEAD: Similar a GET, pero no se obtiene el cuerpo de respuesta, únicamente los metadatos de la cabecera.
POST: añade datos al servidor. Siempre es un método de creación.
PUT: es una solicitud para almacenar la entidad suministrada en el URI indicado. Si la entidad no existe, se crea. Si la entidad existe, se actualiza.
DELETE: elimina el recurso indicado.
TRACE: devolverá la misma información que se ha enviado en la solicitud. Es una especie de eco. Sirve para comprobar si la solicitud se ha visto modificada por servidores intermedios.
OPTIONS: Devuelve los métodos HTTP soportados por el servidor para la URL especificada.
CONNECT: Convierte la solicitud en un tunel TCP/IP. Normalmente se usa para crear comunicaciones HTTPS a través de proxys HTTP sin encriptación.
PATCH; Aplica modificaciones parciales al recurso especificado.
Créditos a @ric.arellano92 !
Para evitar el error “mokepon.js:448 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘nombre’)” lo que hice fue agregar un if que evalué si el mokepon existe o no, esta validación también se aplica en la parte de pintar mokeponEnemigo:
Re subí la respuesta de @ric.arellano92 porque estuve rompiéndome la cabeza durante una semana y quiero que otros lo puedan solucionar, ya que desde las carpetas del curso da error. saludos!
Los verbos del HTTP, también conocidos como métodos del HTTP, son los siguientes:
.
GET: este método se utiliza para solicitar recursos (archivos, documentos, imágenes, etc.) del servidor web.
.
POST: este método se utiliza para enviar datos desde el cliente al servidor web, como información de formularios, comentarios, etc.
.
PUT: este método se utiliza para actualizar un recurso existente en el servidor web.
.
DELETE: este método se utiliza para eliminar un recurso existente en el servidor web.
.
HEAD: este método es similar al GET, pero solo solicita los encabezados del recurso sin solicitar el contenido.
.
OPTIONS: este método se utiliza para obtener información sobre las opciones de comunicación disponibles en el servidor web para un recurso específico.
.
TRACE: este método se utiliza para obtener una respuesta de prueba del servidor web que muestra cómo se ha procesado la solicitud.
.
CONNECT: este método se utiliza para establecer una conexión de red con un servidor web utilizando un proxy.
.
PATCH: este método se utiliza para actualizar parcialmente un recurso existente en el servidor web
Los verbos de https son los métodos de petición que indican la acción que se desea realizar para un recurso determinado en un servidor web⁴. Los verbos más comunes son GET, POST, PUT, PATCH y DELETE¹²³. Cada uno tiene una semántica diferente y unas reglas de uso. Por ejemplo, GET se usa para consultar un recurso sin causar efectos secundarios¹³, mientras que POST se usa para crear o modificar un recurso².
El verbo PUT se usa para actualizar o insertar un recurso en un servidor web1. Es un método idempotente, lo que significa que llamarlo una o más veces de forma sucesiva tiene el mismo efecto2. Por ejemplo, si quieres cambiar el nombre de un usuario en una base de datos, puedes usar PUT para enviar el nuevo nombre al servidor. Si lo haces varias veces con el mismo nombre, no habrá cambios adicionales2.
El verbo PATCH se usa para hacer modificaciones parciales en un recurso, o para enviar un conjunto de instrucciones en lugar del resultado final123. Por ejemplo, si quieres cambiar solo el apellido de un usuario en una base de datos, puedes usar PATCH para enviar solo el nuevo apellido al servidor. El verbo DELETE se usa para borrar un recurso en el servidor14. Por ejemplo, si quieres eliminar un usuario de una base de datos, puedes usar DELETE para enviar el identificador del usuario al servidor.
Aquí un resumen de los verbos más usados 🤖:
* **PUT**: Sube o actualiza un recurso en el servidor. Si el recurso no existe, este método puede crear uno nuevo.
* **DELETE**: Elimina un recurso del servidor.
* **HEAD**: Similar a GET, pero solo solicita el encabezado de la respuesta sin el cuerpo. Se utiliza para obtener información sobre el recurso sin descargarlo.
* **OPTIONS**: Solicita los métodos HTTP permitidos en un servidor para un recurso específico, proporcionando detalles sobre qué operaciones se pueden realizar.
* **PATCH**: Similar a PUT, pero se utiliza para aplicar modificaciones parciales a un recurso existente, en lugar de reemplazarlo por completo.
* **TRACE**: Devuelve la solicitud recibida por el servidor, principalmente con fines de diagnóstico. Muestra la ruta que sigue la solicitud al llegar al servidor.
* **CONNECT**: Utilizado para establecer un túnel de comunicación, generalmente a través de un proxy, para iniciar una conexión segura (como HTTPS).
algunos verbos HTTP
PUT
Se utiliza para reemplazar la información para un recurso. Para actualizar la descripción de un grid, se utilizaría este verbo. Esta llamada es idempotente.
DELETE
Se utiliza para suprimir un recurso identificado en la URL. Esta llamada es idempotente.
HEAD
Actualmente no se puede utilizar.
HTTP, en inglés significa "Hypertext Transfer Protocol". Protocolo de Transferencia de Hipertexto, Cada una de las siglas tiene el siguiente significado:
* **Hypertext:** Hace referencia a la estructura de documentos que contienen enlaces, llamados hipervínculos, que permiten navegar de un documento a otro.
* **Transfer:** Indica que se trata de la transferencia de datos, en este caso, de información entre un cliente (como un navegador web) y un servidor.
* **Protocol:** Se refiere a un conjunto de reglas y convenciones que definen cómo se comunican las computadoras en una red.
**Verbos HTTP más comunes**
**GET**: Solicita datos del servidor sin modificar nada en el servidor.
**POST**: Envía datos al servidor para ser procesados, generalmente utilizados en formularios web.
**PUT**: Actualiza un recurso en el servidor o crea uno nuevo si no existe.
**DELETE**: Elimina un recurso en el servidor.
GET : Hace una peticion al servidor extrayendo informacion de este, sin realizar cambios en la estructura del servidor, tiene esa cualidad llamada IDEMPOTENCIA, la cual significa que no importa cuantas veces se haga, el resultado sera el Mismo
POST : Este envia datos a el servidor, si lo modifica y podria verse como un adicion a la estructura, ejemplo Platzi podria agregar un nuevo curso con este metodo POST o cuando inicias sesion, se utiliza el metodo post para enviar los datos al servidor y luego recibir la respuesta de este
PUT : Se utiliza para sustituir un recurso en la base de datos.
PATCH :: Se utiliza para actualizar los recursos en la base de datos y a diferencia de PUT no los sustituye, este los modifica dandole la siguiente version
Los verbos que conozco son:
get = consulta un recurso
post = produce un nuevo recurso
put = indica que vamos a sustituir por completo un recurso
patch = actualiza algunos elementos del recurso mismo, sin sustituirlo por completo
delete = elimina registros
Ay, me hubiera encantando que el segmento con Diego hubiera así de detallado. Se que eran cosas más complejas pero en ese bloque del curso fue donde más me perdí. Han sido maravillosos estos videos con la profesora Diana.
Los métodos HTTP POST, GET, PUT y DELETE se utilizan comúnmente para realizar las operaciones CRUD. Cada método HTTP se corresponde con una de las operaciones CRUD de la siguiente manera:
.
POST (Crear): El método POST se utiliza para crear nuevos recursos. Cuando se realiza una solicitud POST, se envía una nueva entidad al servidor y el servidor la crea.
GET (Leer): El método GET se utiliza para leer recursos existentes. Cuando se realiza una solicitud GET, se obtiene una entidad existente del servidor.
PUT (Actualizar): El método PUT se utiliza para actualizar recursos existentes. Cuando se realiza una solicitud PUT, se envía una entidad existente al servidor y el servidor la actualiza con los nuevos datos.
DELETE (Eliminar): El método DELETE se utiliza para eliminar recursos existentes. Cuando se realiza una solicitud DELETE, se elimina una entidad existente del servidor.
.
En resumen, la relación entre CRUD y los métodos HTTP es la siguiente:
.
Create (Crear): POST
Read (Leer): GET
Update (Actualizar): PUT
Delete (Eliminar): DELETE
.
Es importante destacar que aunque estos métodos HTTP se utilizan comúnmente para implementar operaciones CRUD en una API o en una aplicación web, no están limitados a esta funcionalidad y pueden utilizarse para otras tareas.
Se utiliza para recuperar información desde un recurso. No se produce ningún efecto secundario cuando un cliente realiza esta llamada.
PUT
Se utiliza para reemplazar la información para un recurso. Para actualizar la descripción de un grid, se utilizaría este verbo. Esta llamada es idempotente.
POST
Se utiliza sobre todo para crear un recurso. En ciertas instancias, este verbo se utiliza para iniciar una operación. Cuando se utiliza en una operación de creación, un código que se suele devolver es el 201 y el encabezado de ubicación incluirá la URL para el recurso creado recientemente.
DELETE
Se utiliza para suprimir un recurso identificado en la URL. Esta llamada es idempotente.
¿Qué es URI?
Un identificador de recursos uniforme, se compone de la URL y de la URN. Sus partes son: esquema, dominio, puerto, ruta, cadena de búsqueda y nombre.
¿Qué es URL?
Es la localización de un recurso
¿Qué es URN?
Nombre del recurso, el título.
¿Qué es Puerto?
Identificadores a que programa queremos conectarnos dentro de la computadora. Ejemplo: el correo es 587.
Protocolo HTTP permite hacer peticiones y dar respuestas. Tenemos los verbos en HTTP:
Me parece interesante la forma en que pueden usar los puertos para tener acceso a un dominio de un sitio web. Crei que solo era agregar el puerto 8080, pero no sabia que habia mas. Pense que solo se agregaba por agregar, pero me acabo de dar cuenta que no es asi.
Aqui esta el reto de los HTTP que solicito la profe:
![](
GET: utilizado para obtener información de un recurso específico. Es el método más utilizado y es seguro, es decir, no modifica los recursos del servidor.
POST: utilizado para enviar información a un recurso específico. Es utilizado para crear un nuevo recurso.
PUT: utilizado para actualizar un recurso específico. Es similar al POST, pero se utiliza para actualizar un recurso existente.
DELETE: utilizado para eliminar un recurso específico.
HEAD: utilizado para obtener información de encabezado de un recurso específico. Es similar al GET, pero solo devuelve información de encabezado y no el cuerpo del recurso.
OPTIONS: utilizado para obtener información sobre las opciones de comunicación disponibles para un recurso específico.
CONNECT: utilizado para establecer un túnel
PATCH: utilizado para actualizar parcialmente un recurso específico. Es similar al PUT, pero solo se utiliza para actualizar partes específicas de un recurso en lugar de reemplazarlo por completo.
TRACE: utilizado para obtener una traza de la ruta que sigue una solicitud desde el cliente hasta el servidor.
MERGE: utilizado para combinar un recurso existente con un recurso enviado en la solicitud.
Estos fueron algunos que encontré con más relevancia:
Get => Solicitar un recurso
Post=> Crear un recurso
Delete=> Borrar un recurso
Put=> Actualizar o reemplazar un recurso
Patch=> Actualizar recurso (parcialmente)
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?