Capítulo 30 – Planteamiento de la app en Flutter – Curso Flutter y Laravel Tienda Delivery

Curso Flutter y Laravel Tienda Delivery

Capitulo 30 ➜ Planteamiento de la app en Flutter

Planteamiento de la app en Flutter | Curso Flutter y Laravel Tienda

Diseño del flujo de navegación e interacción de la app en Flutter, con un editor de imágenes que nos permita bosquejar las pantallas

Planteamiento de la app en Flutter | Curso Flutter y Laravel Tienda Delivery

En esta sección vamos a definir el flujo de navegación e interacción del proyecto que desarrollaremos usando el SDK de Flutter

Pantalla inicial
Pantalla Login
Pantalla Registro
Pantalla Productos
Pantalla Carrito

Utilizaremos un editor de imágenes para bosquejar la estructura de cada pantalla

Planteamiento de la app en Flutter | Curso Flutter y Laravel Tienda Delivery

En esta sección vamos a definir el flujo de navegación e interacción del proyecto que desarrollaremos usando el SDK de Flutter

Pantalla inicial
- Basicamente debe mostrar el logo que será una imagen en formato PNG
- Adjuntamos en la parte inferior un botón con una interacción donde un click lanzará a la siguiente pantalla de Login si es que no existe login.
- El fondo será de color Amber
- Mostrar un gráfico lateral izquierdo con un texto vertical
Pantalla Login
- Fondo de color Amber
- Campo para ingresar un email
- Un segundo campo para ingresar el password
- Un tercer widget para incrustar un boton para ejecutar el login con la API rest con Laravel
Pantalla Registro
- Fondo de color Amber
- Un campo para ingresar el nombre
- Un segundo campo para ingresar email
- Más un tercer campo para ingresar el password
- Finalmente incrustar un botón para procesar el registro de un nuevo usuario con al API Rest
Pantalla Productos
- Mostrar los productos clasificados por categorías, subcategorías
- Por cada producto se mostrará datos como una foto, nombre, precio y un botón para agregar al carrito de compra dicho producto.
Pantalla Carrito
- Lista de los productos que han sido elegidos para su pedido con datos como: la foto, el nombre, el precio, la cantidad y el precio final.
- Agregaremos interactividad como el botón incrementar y decrementar, además de un botón de procesar pedido.

Utilizaremos un editor de imágenes para bosquejar la estructura de cada pantalla

2187 visitas

« Capítulo 29 – Recibir pedidos en Laravel

Capítulo 31 – Creación del Proyecto Flutter »

{ Curso Flutter y Laravel Tienda Delivery }

Compartir link con tus amigos

Descarga el código del proyecto

Descarga el código fuente del proyecto adquiriendo el curso completo

Comprar

Indice

Planteamiento y herramientas

1 Introducción 2 Planteamiento 3 Herramientas y programas 4 Base de datos

BackEnd Administración

5 Instalación de Laravel 6 Módulo Usuarios 7 Módulo Categorías 8 Módulo Subcategorías 9 Módulo Productos 10 Módulo Pedidos 11 Módulo Detalle 12 Carrusel de imágenes 13 Blog para SEO 14 Roles de usuario

FrontEnd página web

15 Diseño de la portada 16 Menú de navegación dinámico 17 Carrusel de imágenes dinámico 18 Productos en la Portada 19 Arquitectura de urls en Laravel 20 Mostrar categorías y subcategorías 21 Mostrar Producto 22 Blog en Laravel 23 Integrar el Carrito de Compra 24 Procesar el Pedido 25 Historial del Pedido

Servicios web API Rest

26 Integrar Json Web Tokens 27 Autenticación con JWT 28 Enviar Productos en JSON 29 Recibir pedidos en Laravel

Desarrollo del aplicativo

30 Planteamiento de la app en Flutter 31 Creación del Proyecto Flutter 32 Estructura de Archivos 33 Implementación del Servicio Web (API) 34 Modelos Categoria, Subcategoria y Producto 35 Creación de la Base de Datos Sqflite 36 Métodos para gestionar la DB DbHelper 37 Modelo Carrito 38 Métodos para la gestión del Carrito 39 Implementación de la Pantalla Inicio 40 Implementación de la Pantalla Login 41 Implementación de la Pantalla Registro 42 Uso de la API para sincronizar la BD 43 Implementación Pantalla Categoria con Sqflite 44 Implementación de la pantalla Productos 45 Implementación Pantalla Producto 46 Logout de la App Delivery 47 Integrar ChangeNotifierProvider 48 Integrar Notificaciones en la AppBar 49 Botón Agregar al Carrito 50 Resumen Carrito de Compra 51 Envío del Pedido Delivery 52 Confirmación del Pedido Delivery

Bonus

53 SEO Onpage en Laravel 54 Maquetación FrontEnd 55 Diseño en Flutter