Construyendo tu primera aplicación de Ionic y Vue

Luego de la noticia, en la que se lanza la Beta del lanzamiento de Ionic Vue, ahora toca el primer tutorial: “Creando tu primera aplicación Ionic para Ionic Vue.

Lo guía va, a través de los fundamentos del desarrollo de aplicaciones Ionic mediante la creación de una aplicación real paso a paso.

Después de completar el tutorial, transformarás la aplicación de inicio Tabs en una galería de fotos interactiva que se ejecuta en la web, iOS y Android, todo desde una misma base de código:

¿Qué vamos a construir?

La aplicación Photo Gallery incluye la capacidad de tomar fotos con la cámara de su dispositivo, mostrarlas en una cuadrícula y almacenarlas permanentemente en el dispositivo.

Los puntos más destacados del tutorial, incluyen:

  • Una base de código basada en Vue que se ejecuta en la web, iOS y Android utilizando componentes de Ionic Framework UI.
  • Implementado como una aplicación móvil nativa de iOS y Android usando Capacitor, el tiempo de ejecución oficial de la aplicación nativa de Ionic.
  • Funcionalidad de galería de fotos impulsada por las API de cámara de condensador, sistema de archivos y almacenamiento.

Va a ser Vue-tiful

Lo que más me gusta de este tutorial es la cobertura de los conceptos de Vue 3, como la API de composición, las referencias reactivas y los ganchos del ciclo de vida, así como las características modernas de JavaScript como la desestructuración, el operador de descanso / propagación y ESModules.

Por ejemplo, para guardar las fotos en un almacenamiento permanente, se usa la función de reloj Vue 3 para ver la matriz de fotos.

Siempre que se modifica la matriz (en este caso, capturando o borrando fotos), cachePhotos se activa la función. No solo podemos reutilizar el código, sino que también garantiza que los datos de las fotos siempre se guarden, incluso si el usuario de la aplicación cierra o cambia a una aplicación diferente:


// Use the Capacitor Storage API to cache photos
const cachePhotos = () => {
Storage.set({
key: "photos",
value: JSON.stringify(photos.value)
});
}

// Anytime the photos array is modified, cache photo data
watch(photos, cachePhotos);

Entonces, en resumen: Si estás buscando un tutorial totalmente práctico para iniciarte con Vue e Ionic, este es el tutorial perfecto.

Fuente: Blog oficial de Ionic

Relacionado

21 Nuevos Cursos Gratuitos: Python, Google Cloud, CSS y Más (25 de Febrero 2021)

Como de costumbre, vamos con los cursos gratis, tenemos 3 cursos en español: Computación, Google Cloud y aplicaciones web; y 18 cursos gratuitos en inglés: Python, Flask, Ionic, PHP, Android, Github, CSS, Flexbox, Illustrator, Photoshop, Scrum y minado de Sugar. Recuerda, que puedes si quieres, puedes acceder a las Mejores Ofertas de Udemy ¡Alé, aprendamos gratis un ratico! Cursos en Español Computación ? Curso Gratuito de ¡SEGUIR LEYENDO!

25 Mejores aplicaciones Java jamás programadas

La historia de Java comenzó en 1991, en un momento en que Sun Microsystems buscaba extender su liderazgo en el mercado de estaciones de trabajo informáticas al floreciente mercado de la electrónica personal. Poco se sabía, de que el lenguaje de programación que Sun estaba a punto de crear democratizaría la informática, inspiraría a una comunidad mundial y se convertiría en la plataforma para un ecosistema ¡SEGUIR LEYENDO!

Adobe lanza Photoshop Camera, una aplicación gratuita con toneladas de elaborados filtros faciales

Adobe está lanzando hoy una nueva aplicación llamada Photoshop Camera que está llena de un montón de filtros muy elaborados que pueden cambiar tu rostro y el mundo que te rodea. Algunos de los filtros son realmente impresionantes: varios identifican el cielo detrás de usted y lo reemplazan con nubes perfectas o una luna mágica; otro te pone dentro de un mundo negro y espeluznante de ¡SEGUIR LEYENDO!

¿Cuáles son las mejores alternativas para PhoneGap después de su cierre?

PhoneGap fue uno de los frameworks de código abierto más populares y utilizados para el desarrollo de aplicaciones web y móviles. Los desarrolladores usaban PhoneGap para crear aplicaciones de alto rendimiento. En algún momento, incluso, Phonegap alcanzo a ser la mejor herramienta para el desarrollo de aplicaciones multiplataforma. PhoneGap Build se lanzó hace mucho tiempo y fue un servicio utilizado para crear código fuente para iOS, ¡SEGUIR LEYENDO!

¿Cómo crear tu primera aplicación en Android?

Aprender a crear una aplicación para Android no es fácil. Si deseas crear una app para Android desde cero, debes desarrollar una comprensión del código. Introducirse en el mundo de la programación en profundidad puede hacer que el proceso de desarrollo de la aplicación requiera más tiempo del deseado. La buena noticia es que hay muchos recursos disponibles en línea que te pueden ayudar a ello, ¡SEGUIR LEYENDO!

Signal y Citizen, las aplicaciones más populares entre las protestas de Estados Unidos y medio mundo

A través del análisis del número de descargas de las aplicaciones como Signal y Citizen se puede analizar y conocer como se están organizando los manifestantes a lo largo de EE.UU. y el resto del mundo. A medida que las protestas contra la brutalidad policial se han extendido por todo Estados Unidos, las descargas de aplicaciones de los estadounidenses han cambiado. La lista de las aplicaciones ¡SEGUIR LEYENDO!

Aprender a programar en Android con Google, desde principiantes hasta avanzado

El equipo de capacitación de desarrolladores de Google publicó recientemente una versión actualizada del curso Fundamentos de desarrollo para Android como una serie continua de tutoriales a través de Google Codelabs. Codelabs hizo su debut como sitio de tutoriales en Google I/O en 2015, y se ha disparado en popularidad como una de las mejores plataformas del mundo para aprender y estudiar absolutamente todo sobre Android. ¡SEGUIR LEYENDO!

Deja un comentario

Salir de la versión móvil