Soy fanático de JavaScript y realmente me encanta trabajar con JavaScript, ya que es realmente poderoso y tiene una gran comunidad detrás.

Una de las cosas más demandadas que recientemente se hizo popular es el SPA, que significa Aplicación de una sola página. El nombre en realidad lo describe bastante bien.

En realidad, un SPA funciona de manera bastante sencilla y lo único que hace es que carga una sola página que normalmente es index.htmly el resto es manejado por JavaScript en el lado del cliente y no habrá enrutamiento del lado del servidor como Laravel o cualquier otro framework.

Seamos claros, esto es solo para el lado del cliente y aún necesitaría alguna aplicación para hacer cosas en el lado del servidor.

Antes de entrar veamos cómo funciona un SPA:

Esta es una de las mejores imágenes que encontré para describir cuán diferentes son los SPA y MPA. Por cierto, MPA significa, Aplicación de múltiples páginas que se encuentra exactamente frente al SPA en la imagen de arriba.

Entonces, para describir un SPA, es mas facil decir que realmente carga una sola página y el resto serán puras llamadas AJAX, que le proporcionarán el contenido y su navegador las procesará amablemente sin ningún esfuerzo seguramente.

Por otro lado, con MPA, que es el método más utilizado entre los sitios web y han sido creados miles de CMS como WordPress, Joomla o Drupal o …, su navegador le pedirá al servidor cada vez que envíe la página y así es como funciona. .

Cuál de estos es mejor? está más allá del alcance de este artículo?, estas preguntas no trataremos por ahora aqui.

Triste

Pero prometo que escribiré un artículo sobre la comparación de estos dos mas adelante.

Ahora que sabemos cómo funcionan las tecnología SPA, necesitamos algunos pasos adicionales para implementar uno.

Hay varias formas, de como hacer un servidor con Apache o NGINX o IIS si lo prefiere o usar Node.js nativo en un servidor, etc.

Cada uno de estos requerirá alguna configuración, pero el más común es Apache.

Lo que todos están acostumbrados a hacer es redirigir todo el tráfico al archivo index.htmly configurar el .htaccess como se muestra a continuación:

<ifModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule (.*) /index.html [QSA,L]
</ifModule>

¡Lo cual funciona perfectamente bien pero hay otro método sin configuración!

Solo cambia, cambia index.htmlel nombre de tu archivo por200.html

¿¿¿QUÉ???

Si asi es.

Entonces, ¿cómo funciona esto?

Tiene una explicación muy simple, ¿qué sucede cuando su servidor no encuentra la pagina html que solicitó un usuario? Busca un archivo llamado 404.htmlque es una redireccion para el código de error HTTP 404.

Ahora tu diras! ¿Como es una peticion Html exitosa para una solicitud HTTP?
Si dijiste 200 tienes toda la razón. Entonces, ¿puedes imaginar qué archivo sería el redirigido para un estado del codigo 200 de una solicitud HTTP? Por supuesto el 200.html.

Mediante este método, todas las direcciones, excepto los archivos reales, se redirigirán al 200.htmly el resto lo manejara el javascript del cliente.

Esto funciona en Vue.js, Nuxt.js y, por lo demás, aún no lo he probado, pero es muy poco probable que no funcione en React o Angular o en cualquier otra cosa, ya que este paso es prácticamente el mismo para todos. . Y esto también funcionaría con NGINX, supongo.

Comenta abajo y avísame si estoy equivocado o si tienes alguna otra sugerencia.

Deja un comentario

Tu dirección de correo electrónico no será publicada.

You May Also Like

Pruebas E2E (testing) que son?

El sueño de todo desarrollador es que la aplicación de software que…

Facebook no lanzara su billetera digital en el segundo pais mas poblado del mundo (india)

Cómo sabemos Facebook acaba de lanzar su moneda digital llamada libra y…

Mover el cursor en Windows 95 hacía que los programas se ejecuten más rápido

Luego de 24 años se resuelve qué mover el cursor en Windows 95 hacía que un programa que demora en realizarse media hora se resuelva en 15 minutos aproximadamente.

¿20 años de experiencia como desarrollador pero no eres tan bueno como se esperaba?

Si desea tener un trabajo simple, fácil, cómodo y seguro, ¡deje de…