Contenido del curso

Aquí tienes un pequeño diario en el que podrás consultar todo lo que vamos haciendo en el curso profesional de Flutterflow.

Empezando por el principio

En los primeros videos del curso hemos repasado como está organizado Flutterflow y donde encontrar cada una de sus opciones.

Nos hemos adentrado en el Dashboard donde podremos gestionar todos nuestros proyectos de forma cómoda:

  • Organizar mediante el uso de etiquetas.
  • Crear y eliminar proyectos.
  • Duplicar proyectos existentes.

 

Tras conocer la puerta de entrada a Flutterflow, pasamos a ver nuestro lienzo en blanco. La zona de edición y donde realmente se hace la magia y empezamos a diseñar y darle vida a nuestros proyectos.

¡Mamá quiero ser artista!

Llega el momento de dejar fluir ese artista que llevamos dentro. Flutterflow nos lo pone muy fácil y nos da un montón de herramientas para que diseñemos las pantallas de nuestra aplicación como si de piezas de Lego se tratara.

Tras conocer lo que es un Widget, veremos como organizarlos de forma correcta en nuestro lienzo de pixeles. Descubriremos la importancia de las filas, columnas y containers además de lo útil que puede ser un Stack para ocasiones especiales.

Transformaremos un conjunto de Widgets en un único componente y aprenderemos a pasarle parámetros para poder reutilizarlo a nuestro antojo.

Conoceremos también los Theme Widgets y le daremos la bienvenida a las plantillas de componentes.

Para finalizar con esta introducción al diseño en Flutterflow, hemos replicado una pantalla de un sitio que nos servirá para buscar inspiración.

El alma de la fiesta

Que sería de una fiesta sin una buena animación.

Llega el momento de darle un poco de vida a todo lo que hemos creado en el módulo de introducción al diseño. 

Conocemos las animaciones que nos ofrece Flutterflow y como configurarlas según nuestras necesidades.

Veremos como configurar animaciones que se ejecuten al entrar en la página o que se disparen con algún evento.

Tras finalizar este módulo no habrá animación que se te resista para darle ese toque de distinción a tus aplicaciones.

Nuestro primer proyecto

Nos adentramos con nuestro primer proyecto en Flutterflow. Una aplicación de recetas que nos servirá para practicar todo lo aprendido hasta el momento en temas de diseño además de empezar con temas de navegación entre las pantallas de nuestra app.

La idea es crear la misma aplicación pero utilizando diferentes sistemas para el manejo de la información. 

En esta primera versión trabajaremos con datos de forma local gracias a los "Data Types" que nos ofrece Flutterflow para gestionar toda la información de las recetas.

Tras crear toda la UI, veremos como conectar los distintos campos con la información correspondiente. Aprenderemos a pasar parámetros entre páginas.

Crearemos nuestras primeras condiciones y veremos como filtrar el contenido.

Pasando a la Acción

Vamos a crear nuestras primeras acciones para gestionar la interactividad con nuestra aplicación.

Veremos como añadir condiciones a nuestras acciones para hacer cosas distintas dependiendo del estado de otros elementos.

Crearemos un popup para invitar al usuario a que nos deje una valoración en la tienda de aplicaciones y veremos como hacerlo para que aparezca en el mejor momento.

Crearemos un selector de categorías y veremos como filtrar el contenido según la categoría seleccionada.

Veremos también como añadir un sistema de gestión de recetas favoritas para facilitarle la vida al usuario de nuestra app.

El poder de las Celdas

Una vez finalizada nuestra primera aplicación con datos locales, llega el momento de probar con Google Sheets.

Creamos nuestro primer Custom Action para descargar todo el contenido de nuestra hoja de calculo online a nuestra aplicación en formato Json.

Vemos como trabajar con un archivo Json para leer la información correctamente y conecta todo en su sitio.

Crearemos las opciones de nuestro menú de forma dinámica para poder gestionarlas y modificarlas desde nuestra hoja de Google Sheets.

De esta manera obtenemos la facilidad de uso de un Google Sheets y toda la potencia de Flutterflow para mostrar la información de una forma maravilosa.

 

Dando el salto a Firebase

Vamos a por nuestra versión utilizando los servicios de Firebase.

La integración de Flutterflow con la base de datos de Google es una auténtica maravilla y veremos como conectar de forma super sencilla nuestra aplicación con Firebase.

Importaremos todas nuestras recetas utilizando la opción de importar CSV que nos ofrece Flutterflow.

Crearemos nuestra primera Backend Query para generar todo el contenido de nuestra app de forma dinámica al obtener toda la info de nuestra base de datos.

Y aprovechando que ya empezamos a trabajar de forma más profesional no te pierdas lo que haremos a continuación.

Gestionando todo lo gestionable

Vemos como crear un Backend para llevar el control absoluto de todas las recetas de nuestra base de datos de forma super cómoda.

Veremos como conectar 2 proyectos a una misma base de datos. Ahora nuestra aplicación y nuestro Backend web estarán unidos para siempre.

Desde el backend podremos ver todas las recetas existentes, editar recetas, eliminar las que no nos interesen o crear recetas nuevas mediante un formulario.

 

Dando el salto a Supabase

Hemos llegado a nuestra última propuesta de base de datos. Le toca el turno a Supabase.

Veremos como crear una cuenta, un proyecto, una tabla y como realizar la importación de datos.

A continuación modificamos todo el proyecto para recibir la información de Supabase y creamos de nuevo el backend para ver como crear, leer, modificar y eliminar datos de nuestra tabla de recetas.

Con esto damos por finalizada nuestra primera aplicación + Backend de recetas.

Arrancamos nuevo proyecto

Nuevo proyecto, nuevas ilusiones y nuevas oportunidades de aprender más cositas sobre Flutterflow.

Vamos a aprender a trabajar con APIs para aprovechar los datos que han recopilado otras personas y crear una aplicación de series y películas de lo más molona.

Ya tenemos una pequeña introducción sobre el funcionamiento de las apis y hemos aprendido a configurar el primer API Call para obtener datos.

También hemos empezado a mostrarlos en pantalla de forma básica antes de liarnos a crear un diseño chachi piruli.

Hasta aquí por el momento...

Este es un resumen muy resumido de todo lo que se ha enseñado en el curso profesional de Flutterflow.

Quiero que sepas que esto es solo el principio y que queda mucho más contenido y proyectos que iremos creando juntos.

El curso se actualiza con nuevos videos casi a diario para que no te de tiempo a aburrirte en este interesante mundo del nocode.

Si tienes cualquier duda me puedes mandar un mensajito por X (Twitter para los amigos) que es la red en la que estoy más activo >> Ir a mi perfil de X

Cerrar X