homefinance blog
Este artículo explica la “parte del servidor versus la parte del cliente” en el desarrollo de WordPress. Esta distinción y la forma en que la parte del servidor y la parte del cliente interactúan, es esencial no solo del desarrollo de WordPress, sino también de cualquier comprensión real de cómo funciona la web. Entonces, si desea saber qué hay en un sitio de WordPress, la parte del servidor y cuál es la parte del cliente, y qué significan estos términos en sí mismo, entonces coloque el cinturón. Y si alguna vez se ha preguntado “PHP es el lado del servidor o la parte del cliente?” (¡Siempre la parte del servidor!) O “JavaScript es la parte del servidor o la parte del cliente?” (¡Casi siempre del cliente! ¡Deja Nodejs!) Entonces esto también es para ti.
Envolví este artículo con un video de presentación general útil, puntos clave, una infografía detallada, una prueba e incluso un resumen (!). Esto se debe al hecho de que no es solo uno de nuestros artículos ordinarios: es un ejemplo de un capítulo en nuestro curso “Aprender el desarrollo de WordPress”, ahora en la tercera edición revisada y extendida. Si le gusta este artículo, asegúrese de ver en funcionamiento. Hay alrededor de 40 capítulos de donde vino. Estamos detrás de él como la mejor guía para el desarrollo de WordPress.
¿Quieres aprender seriamente el desarrollo de WordPress? Despierta y corre hoy
En funcionamiento está nuestro curso completo “Aprende el desarrollo de WordPress”. Ahora, en la tercera edición actualizada y extendida, ha ayudado a cientos de compradores felices a aprender el desarrollo de WordPress de una manera rápida, inteligente y completa.
“Creo que cualquiera está interesado en aprender el desarrollo de WordPress necesita este curso. Antes de comprar en funcionamiento, aprendí un código de WordPress, pero me faltaba la dirección. Ver los videos del curso era como muchas luces encendidas. Pasé de estar vagamente familiarizado con la forma en que los temas, las funciones y el propio WordPress trabajan en su control. Todo se hizo mucho más claro. Recomendar este curso con gran placer para todos los que quieren escuchar “. – Jason, desarrollador de WordPress
¡Da el siguiente paso en tu viaje de desarrollo de WordPress!
Despierta y corre ahora
https://youtu.be/vlp0ytpziqw
Recomendaciones clave:
WordPress vive en un servidor web y proporciona el contenido de un usuario de un cliente web (su navegador).
Los procesos que tienen lugar en el servidor se denominan “parte del servidor”, así como el entorno del servidor en sí.
Los procesos que aparecen en el cliente web (navegador) y el entorno general del usuario y el dispositivo de usuario se denominan “parte del cliente”.
Los elementos clave del servidor de WordPress incluyen: scripts PHP, que se ejecutan solo en los servidores y son el ingrediente principal del sitio de WordPress; y la base de datos de WordPress, que almacena todas las publicaciones de WordPress, datos de publicaciones y datos de usuario (entre otros) y que cambia los datos con scripts PHP del servidor a través de un lenguaje especial llamado SQL.
Los elementos clave de WordPress incluyen: marcado HTML, imágenes y otros medios y estilos CSS, que el servidor ofrece al cliente para reproducirse en una página web visible; así como JavaScript, que programa un comportamiento dinámico e interactivo en el navegador.
Si desea comprender el funcionamiento interno de WordPress, una de las cosas más importantes que tendrá que entender es la distinción entre los idiomas, los medios y los procesos en el servidor y en el cliente. Tal vez más que cualquier otro conocimiento, comprenda esta distinción Me ayudó a entender cómo WordPress hace su magia. Es la clave para comprender el “coraje” de cualquier sitio de WordPress, así como el papel único de los diferentes lenguajes técnicos utilizados en WordPress. También se incorpora profundamente en cualquier discusión sobre temas, complementos, bucle y otras estructuras en las que se construye WordPress. En otras palabras, simplemente no puede entender WordPress sin él. ¡Así que echemos un vistazo! La terminología clave presenta la relación entre el lado del servidor y la parte del cliente en un gran diagrama, que presentaremos en un minuto. Pero antes de eso, necesitaremos algunos fragmentos de terminología esencial:
Usuario: una persona que desea visualizar e interactuar con páginas web utilizando un dispositivo compatible con Internet, como una computadora o un teléfono inteligente.
Cliente: el navegador de Internet del usuario que se ejecuta en su dispositivo.
Servidor: la computadora, ubicada en cualquier parte del mundo, donde se aloja el sitio web deseado (almacenado).
Local: almacenado, que tiene lugar o pertenece al usuario del dispositivo de usuario.
A distancia: almacenado, que ocurre o se refiere al entorno del servidor.
Además, para una actualización, analizaremos el papel desempeñado por cada uno de los siguientes idiomas que constituyen el núcleo de WordPress:
HTML: Lo que leo los navegadores web para convertir el texto en páginas web completamente formateadas.
PHP: WordPress Spine; El lenguaje de programación principal del paquete de software de WordPress y casi todos los temas y complementos de WordPress.
JavaScript: un lenguaje multifuncional comúnmente utilizado para hacer que las páginas web sean más dinámicas e interactivas.
MySQL: El software que estructura las bases de datos de WordPress. La forma de hablar con una base de datos MySQL es a través de consultas SQL. Sin embargo, debido a que los desarrolladores de WordPress casi siempre pueden usar funciones de PHP prefabricadas incluidas en WordPress en lugar de escribir consultas directas, no tiene que saber que el MySQL profundo es un desarrollador competente de WordPress.
Bien, ahora para el gran diagrama:
Diagrama grande
No se preocupe, pasaremos el resto de esta publicación explicando cómo funciona el diagrama. También puede verlo a tamaño completo como en el lado del servidor y en el lado del cliente en recursos. Los pasos involucrados en la carga de una página de WordPress El diagrama muestra el flujo necesario para generar cualquier página en WordPress. Debido a que lo que hace WordPress es generar páginas web para los clientes (navegadores), comprender este flujo es el mismo para comprender que WordPress en sí. El flujo funciona de la siguiente manera:
1. Solicite HTTP del cliente al servidor que su navegador le pide al servidor que devuelva la página web que solicitó.
Al ingresar una URL en su navegador, le dice a su navegador qué sitio desea ver y qué página o publicación determinada en ese sitio. Su navegador (cliente) luego envía una solicitud, llamada solicitud HTTP, al servidor en el que se almacena el sitio, solicitando la página del servidor que solicitó. HTTP, para el protocolo de transferencia de hipertexto, es la forma principal en que las computadoras hablan en la web: es un tipo estandarizado de “apretón de manos” entre dos computadoras que les permite intercambiar información. No tiene que conocer los detalles aquí, pero los cubrimos más profundamente en trabajar con las API HTTP en WordPress .2. WordPress PHP Procesamiento inicial en el servidor Cuando el servidor recibe la solicitud HTTP de su cliente, realiza un procesamiento de PHP inicial para participar en su entorno interno.
El propósito fundamental del código PHP de WordPress es servir diferentes tipos de páginas web basadas en diferentes solicitudes HTTP. Cuando el servidor recibe la solicitud HTTP de su cliente, realiza un procesamiento de PHP inicial para participar en su propio entorno interno e interpretar la solicitud del cliente para comprender qué pide el cliente.
3. El interrogatorio de la base de datos de WordPress utiliza consultas SQL a MySQL para hacerse cargo del contenido de las publicaciones y otra información necesaria de la base de datos.
Para hacerse cargo de las publicaciones o publicaciones que forman la columna vertebral de cualquier página web de WordPress, WordPress debe decirle al servidor que haga un viaje en la base de datos de WordPress, donde se almacenan publicaciones, metadatos de publicación (como la fecha de publicación y publicación) y se almacenan) y Fecha de la información del enlace permanente. . Esta base de datos generalmente vive en el mismo servidor que el sitio de WordPress en sí, pero solo se puede acceder directamente a través de MySQL. (Por ejemplo, si usa un cliente FTP para ver los archivos de su sitio en su servidor, no encontrará la base de datos del sitio entre esos archivos). Usando la consulta de SQL, los scripts PHP de WordPress se apoderan de los datos de información básicos de MySQL que necesitan generar para generar La página web que ha solicitado el cliente, incluido el contenido de contenido (texto y marcado HTML), que será el contenido principal de la página. Más procesamiento de PHP WordPress Para generar una página HTML Este proceso debe usar PHP para procesar los datos de publicación tomados en marcado HTML Pure.
Después de viajar en la base de datos, WordPress sabe qué plantilla PHP usar y tiene contenido de publicación real que puede escribir en la página. Aquí viene el código PHP escrito en el tema y sus complementos. Este paso del proceso consiste en usar el tema, complementos y el resto del código PHP de WordPress para procesar los datos de publicación tomados en el marcado HTML Pure. Es el paso “principal”, la mayoría de los capítulos de este libro caen en él, porque es el paso el que involucra la mayor parte del tema y el código de complemento que escribe un desarrollador de WordPress.
¿Por qué se requiere este procesamiento? Porque su navegador no puede entender PHP, solo un servidor puede. En otras palabras, PHP elimina HTML para enviarlo de vuelta a un navegador, porque HTML es lo que un navegador puede entender. Responder HTTP del servidor al servidor de clientes Enviar un documento HTML limpio a su navegador usando HTTP.
Todo este tiempo (tal vez un segundo), usted y su navegador se han quedado allí, mientras el servidor escapó. Ahora, finalmente, después de hacer el viaje a la base de datos, tomó las publicaciones y alimentó esas publicaciones a través de los archivos PHP que componen el tema y los complementos del sitio: el servidor está listo para enviar un documento HTML limpio al navegador. Hace esto utilizando una respuesta HTTP: una pieza de comunicación que utiliza el mismo protocolo HTTP que su solicitud original, pero que contiene el código HTML que cumple con la solicitud.
6. Rideo del navegador y asumiendo los recursos adicionales ahora que el cliente (su navegador) ha recibido la respuesta HTTP que contiene el HTML que solicitó, puede comenzar a construir los resultados en una página web.
Para la mayoría de los sitios, el navegador notará que necesita recursos adicionales asociados con la página, como hojas de estilo CSS, archivos JavaScript, imágenes, archivos de sonido y fuentes web. Solicite estos recursos del servidor utilizando solicitudes HTTP adicionales y, por defecto, esperará recibirlos antes de pasar a la página. Una vez que el navegador ha recibido el código HTML y todos los recursos asociados que ha solicitado, finalmente terminé con el servidor. Si el servidor explotara ahora, usted y su navegador aún tendrían la página web y todo en él, al menos hasta que cierre la ventana. Ahora el navegador puede hacer su tarea principal: reproducir HTML y recursos relacionados en algo que parece una página web. Ahora el navegador puede hacer su tarea principal: reproducir HTML y recursos relacionados (imágenes, etc.) en algo que muestra a las personas como una página web. Cada página web, como lo interpreta su navegador, es una combinación simple de texto y recursos asociados, organizada visualmente de acuerdo con las diversas reglas dadas a HTML y CSS (y a veces JavaScript). Cuando su navegador ha terminado de reproducir todos los recursos que le enviaron, finalmente puede ver la página de WordPress que solicitó cuando inicialmente ingresó una dirección en la URL.7. Interactividad a través de scripts a nivel de cliente Su navegador puede generar efectos interactivos a través de scripts a nivel de cliente.
¡Pero a veces hay más! En algunos sitios, al hacer clic en un objeto, ocurre algo extremadamente interactivo: por ejemplo, al hacer clic en una pestaña de menú en un elemento “acordeón”, se pliega para mostrar todo el cuerpo de ese pedazo de acordeón. Y algunas páginas realmente saben lo que hace cuando interactúa con ellas: por ejemplo, cuando ingresa la contraseña dos veces para registrarse en algo, la página puede mostrar un mensaje de error siempre que las dos contraseñas no coincidan, justo antes de un clic “Enviar”. Nada de esto involucra el servidor, que aún podría ser un cráter fumar hasta donde sabemos. Por el contrario, estos efectos se gestionan con secuencias de comandos del lado del cliente: piezas de código que han sido enviadas a su cliente (navegador) por el servidor como parte de su respuesta HTTP, pero que se ejecutan en el cliente mismo. El lenguaje principal de script a nivel del cliente es JavaScript. (Algunos efectos secundarios simples del cliente, como cambiar el color de un botón cuando pasa con el mouse sobre él, se pueden administrar a través de CSS usando pseudo-sectores). Entonces, JavaScript es algo opuesto a PHP: el servidor no se molesta en él. Lo entiende, pero solo lo envía a su navegador, que lo ejecuta como parte del proceso de carga de la página que solicitó. En cuanto al flujo anterior, los pasos 2 a 5 están en el lado del servidor, y 1, 6 y 7 están en el lado del cliente. Veamos estos términos y debe entender por qué es el caso.
El lado del servidor PHP y MySQL siempre está en el lado del servidor.
Para los sitios de WordPress, el lado del servidor significa: “Ocurre durante el procesamiento interno, un servidor funciona mientras intenta servir una página a un cliente que lo solicitó”.Como regla general, PHP y MySQL siempre están en el lado del servidor: solo se ejecutan en un entorno de servidor.Un navegador web no los entiende.Es por eso que PHP no puede, por ejemplo, seguir al mouse.Cuando su navegador sigue la actividad del mouse, el servidor ya no está involucrado. “Servidor” y “back-end” como nota, las personas a menudo usan back-end como sinónimo de “servidor”: un back-end El desarrollador, por ejemplo, trabaja principalmente con idiomas como PHP (en lugar de idiomas como HTML, CSS o JQuey).”Back-end” se usa para significar otras cosas, pero esta es una de ellas.
La parte de los clientes HTML, CSS y JavaScript/Jquey está del lado del cliente.
La parte del cliente significa “Ocurre en su navegador, una vez que el servidor ha enviado los recursos necesarios”. Entonces, HTML, CSS y JavaScript/Jquey están en el cliente: están almacenados en el servidor (como todos los archivos), pero su navegador es el que hace cualquier cosa con ellos. Por lo tanto, los scripts del lado del cliente están bloqueados con lo que el servidor les dio: hasta que los scripts en el cliente puedan ejecutarse, el servidor ya ha completado su transferencia. Es por eso que, por ejemplo, generalmente no puede navegar en otra página en un sitio de WordPress sin experimentar un parpadeo de “recarga”: obtener el contenido de una nueva página requiere una nueva solicitud HTTP, un viaje de regreso al servidor y WordPress. La base de datos y una respuesta HTTP completamente nueva (seguida de muchas otras solicitudes HTTP y respuestas de recursos, como hojas de estilo CSS). Su navegador debe crear este nuevo conjunto de respuestas HTTP en una página. Sin embargo, notará que las diapositivas de la página del conmutador generalmente pasan sin problemas de una foto a otra. Esto se debe al hecho de que el servidor los envió a todos una vez como parte de la misma carga de página y se muestran y ocultan al cliente usando JavaScript. (Tres notas que se pueden ignorar en esta sección. En primer lugar, hay una solución para hacerse cargo del “parpadeo” de los datos adicionales del servidor y se llama AJAX. En segundo lugar, creando sitios web y aplicaciones web completas como una sola página, Usando marcos de JavaScript, se vuelve muy popular;
Una vez que se carga la página, puede navegar entre diferentes partes de ella al instante y “sin parpadear” usando JavaScript. Tercero, hay JavaScript a nivel de servidor: JavaScript que asume el papel de PHP, como lo hacen Node.js. Todos estos son temas bastante avanzados y no nos preocuparemos aquí). “Byle del cliente” y “front-end” como en el caso de “lado del servidor” y “back-end”, las personas a veces usan front-end como Sinónimo de “lado del cliente”. Por ejemplo, un “desarrollador front-end” generalmente funciona en idiomas como HTML, CSS y JavaScript/jquey y está muy preocupado por cómo aparecen las cosas e interactúan en el navegador del usuario (es decir, en el cliente web).
En conclusión … bueno, hay mucho sobre el lado del servidor y el lado del cliente, pero valió la pena el esfuerzo si comienza a comprender esta distinción crucial. WordPress tendrá cien veces más sentido para usted si lo comprende que si no.
Como nota final: no se preocupe si todo parece bastante técnico y confundido. Comenzará a tener una sensación mucho mejor a medida que se programe en WordPress, así como comprende mejor el aspecto de una ciudad que vive allí por un tiempo. Así que haz tu mejor esfuerzo para entender este capítulo, ¡pero no te detengas aquí!
Resumen Limerick Web es un tipo de ciencia extraña: ahora tenemos nuestros teléfonos como “clientes”, y a través del “servidor” referimos un automóvil remoto probablemente sea un tipo de Rhode Island.
¡El momento de la prueba!
El contenido de cada publicación de WordPress se almacena en:
Sistema de archivos de WordPress
Una plantilla de Php WordPress
Base de datos de WordPress
Un navegador no entiende:
Php
Javascript
Html
Un servidor no entiende:
Php
CSS
Consultas mysql
Los siguientes son todos los procesos en el lado del servidor, excepto: Generación de la solicitud HTTP
Procesamiento de PHP
Consultas de la base de datos de WordPress
Los siguientes son todos los procesos al nivel del cliente, excepto:
La ejecución del código JavaScript
Guardar cambios en el contenido de una publicación
Jugador de navegador
Respuestas y explicaciones
C. El contenido de WordPress está en la base de datos.
A. PHP se interpreta en los servidores; Los navegadores no hablan con ella.
B. Los servidores no hacen cosas que se vean bien para las personas, ese es el trabajo de un navegador.
A. Su navegador en su computadora crea solicitudes HTTP que envíe al servidor.
B. La comunicación con la base de datos tiene lugar solo en el lado del servidor.
Si le gustó este capítulo sobre la comprensión del servidor y el cliente en WordPress, le gustará nuestra guía completa para el desarrollo de WordPress: ¡Operación! A partir de la comprensión fundamental presentada aquí, tienen profundidad en los sistemas técnicos básicos de WordPress. Aprenderá mucho más rápido de lo que podría, claramente, lógicamente y sin desviaciones. Despierta y corre ahora
Imagen de crédito: Ian D. Keating
