Saltar al contenido

Ionic LAB [2021] | Aprende qué es y cómo se usa aquí

¡Eyyy hola que tal dev! Muy buenas. Bienvenid@ a la web, Aitor otra vez por aquí. Y en artículo de hoy vamos a ver algo que me habéis estado pidiendo bastante por Twitter.

Quizás te hayas preguntado alguna vez ¿cómo puedo desplegar mis apps en debug sobre el navegador? O mejor aún ¿cómo desarrollar más rápido en Ionic? Tranquilo, todos al principio nos lo preguntamos alguna vez. Y hoy vas a saber cuál es la solución.

Cómo sabrás, mi nombre es Aitor y soy desarrollador de apps desde hace más de 6 años. Y en este post te voy a explicar cómo puedes desplegar el Lab de ionic, para que sirve y con que fin lo podemos utilizar.

Pero antes de continuar, te dejo mi video donde explico todo esto por si eres unos de mis lectores que te gusta más ver que leer. Y, por cierto, si te mola el contenido, pues ya sabes lo que tienes que hacer. Suscribirte, cómo es normal ? Lo puedes hacer aquí.

 

 

¿Qué es el Ionic Lab?

Bien, para quien no conozca lo que es aún, y haya caido aquí buscando lo que es y cómo usarlo, simplemente decirte que es una manera de hacer Debug de una aplicación emulando los dispositivos físicos en le navegador.

Estoy seguro de que una imagen vale más que mil palabras.

Ionic lab, que es y cómo se usa

Aunque si quieres, colócate en el video sobre el minuto 3:50 y podrás verlo a tiempo real.

En este punto no hay mucho más que añadir. Básicamente te permite ver cómo quedará tu app, una vez terminada, encima de un dispositivo móvil real.

 

¿Cómo se usa?

Este paso es super sencillo de realizar. Basta con tirar la siguiente línea de consola que vamos a ver a continuación para que todo se ponga en marcha:

Nota: Tines que estar situado dentro del directorio de la app para que funcione. Si no, petará estrepitosamente, cómo es normal 😛

ionic server --lab

 

Es posible que durante el deploy se te pida que instales el Lab si no lo tienes instalado aún. Pues le das a que sí y listo.

Por otro lado, si estás usando la consola de VSC, o cualquier otra que no sea la del sistema, es posible que te pete con un error de los archivos .ps1. Para solucionarlo te dejo otro video por aquí donde lo arreglo en un pispas y te lo enseño:

 

 

Una vez haya terminado de instalarse y de configurarse se desplegará en el navegador y ya podrás acceder a este contenido tan interesante que pone el Framework a nuestra disposición.

En la parte superior derecha de la página, encontrarás también un selector para ir cambiando, poniendo y quitan skins y así poder quedarte solo con las que necesites.

 

Info adicional

Si te ha gustado el contenido que has visto aquí, o te ha ayudado, es importante que te suscribas al canal de YT aquí. Así estaré informado de que el contenido te gusta y tú también estarás al tanto de todo lo nuevo que voy subiendo a la web y al canal. Es win para ti, porque aprenderás muchas más cosas y win para mí por que estaré informado de que el contenido te gusta.

Pero, en el caso de que no te guste YT, aquí tienes El Circulo. Que básicamente es una comunidad que estoy montando alrededor de las apps en la que te enseñaré cómo hacerte un sueldo programando para móviles.

 

Sin mucho más que agregar, me despido ya. Y decirte que nos vemos en el siguiente artículo. Hasta entonces, que vaya bien ?