En este post, te enseñaremos cómo probar funciones en distintos dispositivos con BrowserSync, ya que el constante testeo es una parte importante en la creación y diseño de una página web. Este nos permite ver qué funciones están haciendo lo que deben y qué elementos funcionan, pero también nos dejan ver qué secciones sobran y qué elementos distraen.
¿Qué es BrowserSync?
Browsersync es un servidor local que nos permite probar nuestros sitios web en tiempo real. Con esta herramienta, basta con cargar cualquier cambio en nuestro código para verlo aplicado en el servidor que simula nuestra página web.
Esta herramienta, creada y lanzada por Google en 2007, hace mucho más que solo sincronizar los cambios que generamos con un sitio web. En realidad, podemos revisar nuestros ajustes en varios navegadores simultáneamente con el uso de sockets e, incluso, podemos probar funciones en distintos dispositivos con BrowserSync.
¿Cómo probar funciones en distintos dispositivos con Browsersync?
Antes de probar funciones en distintos dispositivos con Browsersync, debes abrir la herramienta desde tu software de programación. Desde Visual Studio Code, puedes hacerlo dando clic derecho en tu carpeta de archivos y eligiendo la opción “BrowserSync start”. Esto abrirá tu servidor local en el navegador que tengas abierto o en el que hayas definido como predeterminado. Para abrir el servidor de tu página web en otro navegador, basta con usar la misma URL del local host que ya has abierto. Esta URL normalmente se ve similar a: localhost:4600/.
Puedes realizar el mismo proceso con el número de navegadores y pestañas que quieras. Algo muy interesante que pasará cuando tengas abiertas tus múltiples pestañas es que, al navegar en una, estarás navegando en todas. Es decir, si haces scroll o clic en algún elemento desde una pestaña, todas las pestañas harán el mismo movimiento. Esto nos permite revisar secciones de nuestra página web simultáneamente. De este modo, BrowserSync nos permite revisar si las funciones o elementos son compatibles con todos los navegadores o si debemos realizar un cambio.
Pero entonces, ¿podemos probar funciones en distintos dispositivos con BrowserSync? ¡Claro que sí! BrowserSync nos permite acceder al servidor local desde nuestro propio móvil o cualquier otro dispositivo. Mientras que el dispositivo esté conectado al mismo wifi de nuestro software, podemos acceder a la IP del ordenador en el que estamos programando para ver la página web en el móvil y en el PC al mismo tiempo. Además, aunque sean dispositivos diferentes, puedes seguir navegando simultáneamente, mientras que los eventos sean del propio DOM.
¿Qué sigue?
Ahora que sabes cómo probar funciones en distintos dispositivos con BrowserSync, ¿te animas a seguir aprendiendo sobre desarrollo web? Para continuar con tu formación, te invitamos a nuestro Desarrollo Web Full Stack Bootcamp. Allí seguirás aprendiendo, entre muchas otras cosas, sobre herramientas para hacer tu día a día en programación más sencillo y crearás tu propia página web con ayuda de nuestros profesores. ¿A qué esperas para cumplir tu sueño de ser un desarrollador web? ¡No te lo pierdas y apúntate!
