Flutter: Consumiendo un API REST ( FutureBuilder ) [ Desde Cero ] - Parte 02
Вставка
- Опубліковано 19 жов 2024
- Segundar parte, en este vídeo usamos un FutureBuilder para representar la información que traemos de Internet.
Curso completo: tinyurl.com/y3...
Link a la parte 01: tinyurl.com/y5...
Mejor Hosting: n9.cl/hosting-...
Código fuente: github.com/Jos...
Página web: tinyurl.com/y5...
Facebook: tinyurl.com/yy...
![Flutter: Consumiendo un API REST ( Future / http ) [ Desde Cero ] - Parte 01](/img/n.gif)
Una vez mas te felicito, por lo calidad con la que explicas cada linea del código, como la repasas, realmente era justo lo que buscaba espero que me sirva ahora para seguir construyendo mi app. Ah y los memes, rompem con la seriedad y se hace mas entretenido. La duracion de cada video lo justo ni muy rapido nu muy corto,
los desafios o ejercicios que aplicas a cada final de etapa, lo mejor si siempre lo pones algo asi, algunas preguntas durante el tutorial es interesante, nos hace pensar.
Gracias nuevamente , llevaba mas de una semana viendo videos intentando y leyendo , pero sin entender nada solo videos que replicava el codigo de los ejemplos...
Sigas asi!! todavia no se como hay tan pocas visualizaciones....
Muchas gracias. Bueno, este es un canal nuevo. Aun no tengo ni siquiera mil suscriptores. 😅 pero poco a poco espero que se haga más grande esta comunidad.
Bro explicas muy bien muchas gracias!! seguiré viendo mas tus tutoriales saludos desde argentina
Hola Jose, estoy siguiendo tu curso que es muy bueno y entrenido para aprender Flutter y lo llevo bastante bien. El problema radica en que quedo desactualizado con las versiones nuevas de Flutter y algunas cosas no funcionan como deberian. Estoy tratando de levantar los datos de la API y en pantalla me figura Error. Estoy seguro que la llamada a la API esta siendo respondida porque en el video anterior con los prints si traia la info. Me sale este error: I/flutter (30083): type '_Map' is not a subtype of type 'Iterable'
. Agradeceria si me puedes orientar por que sale este error.
muchas gracias por este par de videos maravillosos, Dios le bendiga su conocimiento y le deseo muchos exitos!! ... llevaba varios dias estudiando esto y no habia podido avanzar en mi app, me ha quedado muy claro todo... Muchos exitos mi estimado 👏👏👏
Me alegra haber podido ayudarte. Gracias por ver los videos. 😁
Magnífico. Tienes mi like. He encontrado dificultades en la función que devuelve los widgets. Al recibir los datos de snapshot.data me pedía que declarara esa lista como nula, List? data . También al recorrer los datos con el for he tenido que hacer for (var gif in data!) , añadiendo a data la condición de si es no nulo. O algo, así, porque habrá que enterarse bien como se maneja eso de null safety... 😃
Primero que todo, te felicito por la forma en que explicas, hace dias entendi mas sobre el expanded con un video que sale en la misma pagina de flutter ya que algunas Cards o containers me salian con ese color amarillo por espacio, pero tu me dejaste mas claro con tu explicacion. Y claro con el tema de la API que no sabia como se consumia. quede bastante claro.. Grande Genio!! gracias por compartir tus conocimientos.. suscrito y su like buen hombre...
Cursos de Flutter y Angular. Muchas gracias por los cursos, muy claros.
Está muy bien explicado, eres muy bueno enseñando!! Espero haya mas videos
Hola, muchas gracias por el apoyo. Claro que seguiré subiendo más vídeos. Estoy comenzando a enseñar el uso de Firebase como backend y pronto comenzaremos a hacer aplicaciones completas usando Flutter.
me has salvado la presentación de mi proyecto!!! ya que no sabia como podría conectarlo con php. pero tu video y tus explicaciones pude entender y con ello solucionar mi problema!!! gracias!!!
Genio! Me quedo clarísimo. Por más tutoriales como este
Amigo, me gustan mucho tus videos, se me complica un poco con la version de Dart 2.0, que no permite variables nulas, y en tus videos si las colocas, te agradeceria un monton si enseñas a como corregir ese error, de resto EXCELENTE CURSO!
Maravilloso como cada video. Es un regalo cada lección.
Gracias Broo... me ha sido de mucha ayuda que pases Genial!!!
Muy buena clase, muchas gracias.
Muy bueno...!!! igual algunas cosas dan error. Seguramente es por algún tema de versión, que valida más errores. Pero igual lo pude corregir. Gracias por el tutorial. Esta buenísimo...!!!
Por ejemplo cuando el http pedía una url, no funcionaba mandando el string. Había que convertir primero a Uri. Con Uri.parse('ejemplo.api...')
Buenos videos amigo, me ayudaste a entender varios conceptos, agradecería si pudieras animarte a subir un tutorial dónde expliques como crear una api para enviar datos de una app Flutter a una base de datos 👍
El siguiente vídeo es sobre conectar Flutter con Firebase. Una base de datos no relacional que también es de Google..
Muchas gracias Eh aprendido un monton explicas muy bien Felicitaciones y sigue asi !!!
Genial, muy bien explicado
Me alegro de que te haya quedado claro. Trato de explicar cada parte, por eso querdan un poco largos los videos.
locoooo me dieron mas plazo para el proyecto lanzate otros dos videos bien mazados que me carreen esa en la U
los unicos videos que me han servido son los tuyos
Confirmo,está casi muriendo en esa materia
gracias por los videos, muy bien explicados
like a todo
Segundar parte, en este vídeo usamos un FutureBuilder para representar la información que traemos de Internet.
Curso completo: tinyurl.com/y322eobx
Link a la parte 01: tinyurl.com/y5uc569l
Mejor Hosting: n9.cl/hosting-correcto
Código fuente: github.com/JoseGaldamez/ListG...
Página web: tinyurl.com/y5gmvsc6
Facebook: tinyurl.com/yy568zlt
me gustaria ver videos con base de datos postgrest, y no se si tendran de marcadores electronicos
Muy claro... excelente video
Muchas gracias. Tengo que actualizar este video, con las versiones nuevas hay que hacer un paso adicional.
Por si acaso sabes si hay algún tutorial de cómo convertir diseños de adobe XD, figma, etc a código flutter? Para las vistas
Me encantó tu explicación
hola, saludos desde Venezuela, explicas muy bien, pero estuve tratando de hacerlo con una lista donde quiero que sea el tamaño total de la lista y al buscar que la lista me devuelva el length no lo hace
Toda la explicacion es excelente, solo queahora en el 2023, hay codigos que por alguna rezon hoy en dia no valen, lo bueno de esto es que te obliga a analizar y crear otras formas de llegar a lo mismo!
Si, justo estoy haciendo una lista de los vídeos que tengo que actualizar y uno de los más necesarios es este.
@ En algún momento sacarás la actualización de esos vídeos?
Actualmente dan muchos errores que hay que buscar la manera de como resolverlos o cambiar la sintaxis para que funcione
Bacanazo amigo, buen video
Como solucionan el error de ..
Gif(item["title"], item["images"]["downsized"]["url"]
)
"too many arguments", no lo entiendo, el constructor pide dos argumentos Gif.
Muchisimas gracias por este video, me sirvio demasiado.
Con mucho gusto. Me alegra que haya ayudado.
Hola José, la serie de videos son espectaculares. Lo he seguido, y funciona a la perfección. De echo lo he implementado en mi trabajo. El problema que tengo es que la api que resuelver el servidor cambia los datos varias veces al día. En consecuencia he intentado poner un Timer.Periodic con un Duration de 1 minuto, en el InitState y cargar nuevamente la información de la api. Pero la lista no se actualiza. Como se puede hacer para que se cargue cada cierto tiempo y se muestre con los nuevos datos???
La idea del Timer.periodic puede funcionar, pero no podría ir en el initState ya que esto hace que se ejecuta solo cuando el widget está activo. Quiza lo ideal sería crear un Provider donde se este ejecutando el proceso en segundo plano. Este paquete puede servirte: pub.dev/packages/provider si tienes alguna duda o no entiendes como usarlo quizá haga un vídeo de su uso en un futuro próximo.
@ José, la llamada a la función getApi lo estoy haciendo desde un Provider. Vos decís que dentro de ese provider halla un Timer.Periodic?
@ Si tal cual, es necesario que se refresque los datos del servidor determinado tiempo. El mismo problema que Luis, tenemos muchos programadores en flutter. Los servidores en muchas empresas estan echos en PHP. Por lo tanto es necesario salir y volver a entrar para tener los datos actuales. Como tendría que ser ese Provider???
@@martaquiroga6631 Lo ideal en esta situación es montar un servicio de socket en el servidor para que la interacción sea transparente. Si usas el provider harías lo mismo, consultar constantemente el backend, harías cientos de peticiones al día. Si me tocara resolverlo a mi, haría un microservicio o un socket en el backend o directamente haría que el backend actualice una base en tiempo real como Firebase. Hacer tantas peticiones desde la aplicación puede funcionar, pero no sería eficiente.
Hola he seguido el video y todo correcto pero tengo una duda: Tu retornas un GridView.count i todo perfecto pero me gustaria hacerlo con un return ListView.builder() y me da error porque me pide que devuelva solo 1 widget y con tu funcion devuelvo una lista de widgets me podrias mostrar algun ejemplo de como lo puedo implementar para que me funcione con un ListView.builder()? GRACIAS
No estoy seguro debido al poco contexto, pero quiza involviendo el ListView en un container puedas solucionar, así devolverías un solo Widget, el container. Claro, tendrías que darle las medidas expecíficas por el tema del desbordamiento del screen, pero quiza eso solucione tu problema. Lo has probado?
Gracias por tus tutos. A mi me gustaría a mandar datos e imagenes a una base de datos desde una app flutter...
Haz una petición post a la api con lo que necesitas enviar, la librería http de dart te sirve
Excelente video, muchos exitos.
contexto: tengo un listview builder que carga 5 containers estos tiene inkwell en ontab quiero que al hacer click cada container me lleve a una pagina distinta, lo Intenté con esta linea de codigo MaterialPageRoute( builder: (context) => _pagina[index].paginaUno, me sale un error que dice que debe ir un widget no una string, cual seria la solucion? ayudame plis
Hola. Podrías hacer un sistema de rutas como el que muestro en este video:
ua-cam.com/video/mN5Co64gsT0/v-deo.html solo debes poner un array con el nombre de la ruta a la que quieres ir y dentro de la lista llamar a dicho nombre.
Navigator.pushName(context, _paginas[i])
Algo así. Espero te sirva.
gracias por el video una consulta especifica a un api rest estoy utilizando provider pero quiero utilizar un future builder, pero al llamarlo me trae los datos pero hace como 3 consultas asi que me retorna 3 veces los datos alguna sugerencia?
Puede ser que el Widget se redibuja por alguna razón y tú tienes el llamado dentro del cuerpo del Widget. Cada que se redibuja hace un llamado nuevo. Revisa eso o trata de extraer la función en un método separado.
voy en el minuto 8:32, al momento de mostrar informacion con el return en vez de hola me muestra error y en consola me muestra lo siguiente
Expected a value of type 'String', but got one of type 'Null'
que podria ser de antemano gracias por su ayuda
Sigue viendo el video. Ahí se explica. Por un momento el FutureBuilder no supo que hacer. Ahí muestro la solución.
@a mí me muestra el error en la pantalla dice que es un valor de tipo 'iterable, pero es de tipo Null
Excelente video!!
Excelente video, explicación impecable. quisiera saber como puedo obtener el código fuente para descargar lo, muchas gracias...
no entendí lo de for ( var gift in data) ... esa variable gif de donde sale ? y el data contiene la data del json?
perdon soy basico en esto pero eso no me quedo claro. mil gracias y muy buenos videos!!
La variable gif se está declarando en el momento que se declara el for. Lo que hace es que cada vez que el for se ejecute, gif tomara el valor del índice en data. Por ejemplo: si en esta tenemos 3 elementos, el for se ejecutará 3 veces. La primera vez gif tendrá el valor del primero, la segunda vez el valor del segundo y la tercera el valor del tercero.
Gracias, me ayudo mucho
Me alegra saber eso. 👍🏽
Buen video bro , saludos
Muchas gracias. 👍🏼👍🏼
@ Tengo un canal de programacion tambien hechale un ojo bro ua-cam.com/users/AnderCode
Genial. Veo que tienes 71 vídeos. Excelente... ya se donde buscar cuando tenga dudas con algo de PHP.
buen video, espero sigas creando mas videos sobre estos temas, solo tengo un pequeño problema que me muestra solo un contenido y no varios como esta en el video, espero me puedan ayudar, gracias
Hola me podrias enviar tu codigo funcionando para revisarlo? Porque yo no lo estoy pudiendo hacer andar, muchas gracias
Sos el mejor explicandooo!! tendras algun ejemplo para poner la data en una tabla?
como puedo quitar el subrallado azul me aparece en todas las lineas de codigo?
Suelen ser sugerencias del editor de código. No dará error pero es bueno seguir las sugerencias. Si pones el cursor sobre las líneas marcadas te dirá qué hay que hacer. Suele ser cositas como declarar el Widget como constante o usar un sizedbok en lugar de un container.
Buen tutorial, gracias! Qué opinas de Xamarin? Merece la pena aprender?
Hola Juanjo. Xamarin lo pondría en la misma categoría que Ionic, tienen el mismo rendimiento. Definitivamente merece la pena aprenderlo, aunque el rendimiento sea un poco menor que Flutter o React Native. Pero si vale la pena aprenderlo, hace unos años Ionic me dio de comer, no tiene el mejor rendimiento, pero funciona. Y muchos clientes no les interesa la tecnología, solo les interesa tener su app en Android y iOS.
@ Gracias! En realidad mi interés por Xamarin es por no tener que salir del entorno de c# en VS.
Me gusta Flutter, al menos como tú lo explicas, pero no sé cómo será la curva de aprendizaje comparada con Xamarin.
@@juanjop.feliciano7298 Si ya vienes del entorno de C# lo ideal es que aprendas Xamamin, no creo que tardes tanto si ya conoces bien. Cuando lo aprendas notarás que ha ciertas cosas que no podrás hacer, luego (cuando ya sepas Xamarin) si consideras que vale la pena aprender algo más profesional, puedes aprender Flutter o React Native.
muy bien explicado
datos.add(item["nombre"]);
En esa linea me manda un error: type 'String' is not a subtype of type 'getFromBack' getFromBack es el constructor
Estimado si no tengo un data de varios campos?
quiero enviar valores desde el celular hacia la api del computador
tengo un problema con el snapshot en la listView. Alguien sabe como podria resolverlo?
Cuéntanos el problema para ver si podemos ayudarte.
Si quieren que _listadoGifs pueda ser nulo inicialmente, pueden declararla como una variable nullable agregando un ? después del tipo. Por ejemplo:
Future? _listadoGifs;
Excelente video, cuando viene la parte 3?
quien sabe como se arregla el problema de que en visual las imagenes de internet con network si se visualizan, pero en el apk en celular no cargan
Joder que buenos videos
Hola, cuando intento correr la aplicacion en el minuto 8:56 me sale el cartel rojo con letras amarillas en el emulador,,que dice " type 'Future' is not a subtype of type 'FutureGifs>>,
Me podran dar una mano asi puedo seguir, esta muy bueno el curso pero me clave ahi. Mil gracias
Hola Rodrigo, lo solucionaste? Tengo el mismo problema ):
Lo solucione. Copio la solucion por si alguien mas tiene el mismo problema.
return ListView(
children: [
..._listGifs(snapshot.data),
],
);
//luego la funcion de listGifs
List _listGifs(data) {
List gifs = [];
for (var item in data) {
gifs.add(
Text(item.name),
);
}
return gifs;
}
@@JC-df6eq gracias me sirvió
@@JC-df6eq que significan los 3 puntos del inicio en ..._listGifs?
@@jonnathanSpinosa hola. Si mal no recuerdo Los ... Es pq había más información pero no era de relevancia para la solución
He seguido el curso de flutter y he aprendido bastante, pero en la parte de _listGifs(snapshot.data) me da un error, el cual es
The argument type 'Object' can't be assigned to the parameter type 'List'.
Lo soluciones colocando el signo de exclamación ! asi _listGifs(snapshot.data!), soy nuevo en flutter, segun lo que lei es para evitar enviar una variable nula, pero si alguien tiene una mejor explicacion por favor que nos la comparta
igual me encuentro con el mismo error ya que en versiones nuevas flutter cambia su sintaxis en mi caso tengo flutter 3.0.1
@@sonjeux intenté solucionarlo agregandole el ! pero no funcionó, seguiré trabajando en ello
Es porque en la nueva versión tienes que especificar que tipo de dato toma, ejemplo: _listGifs(snapshot.data as List), espero lo hayan solucionado
@sonjeux muchas gracias, solucione el error del _listGifs(snapshot.data) con el signo !@@sonjeux
Master una app con un sistema de autenticacion con tokens please , saludos desde Bolivia =)
yo también necesito esa información, por si acaso sabes donde conseguirla?
@@sebasmorales5701 No por eso te pedia =(
Y si quiero llamar más de una API en una misma pantalla como puedo hacer?
Simplemente haces un llamado después de otro y guardar el resultado en diferentes variables.
@ tiene algún código en el que lo implementes? Es que simplemente no me doy cuenta como hacerlo y ni eh encontrado documentación al respecto. Gracias!
Buen video 👍👍
Muchas gracias por tu apoyo. 👍🏽
Suscriptor 1000
💥🎈🎉🎊🎈🎊🎉🎊🎈🎊🎉🎈 Jaja. Muchas gracias. Y bienvenido al canal... en mi próximo vídeo ¿puedo mostrar tu comentario? Me das permiso. 😁
@ Claro. Y sigue subiendo videos.
exelente broth
ESTE VIDEO ES GOD CABRON
11:15 children: _listGifs(snapshot.data), me marca error. Tuve que List _listGifs(data) {
List _listGifs(data) {
List gifs = []; ...
Dejalo como data nomas y funciona.
Uso Flutter 2.2.3
para que me salga en las ultimas lineas le puse esto
List _listGifs(data) {
List gifs = [];
for (var gif in data) {
gifs.add(Card(child: Column(
children: [
Expanded(child: Image.network(gif.url, fit: BoxFit.fill,)),
],
)));
}
return gifs;
}
}
@@andresignaciojara2504 yo la 2.5.3
messirve
no pude replicar m sale full errores : (
caapo
En la parte que pide el url del api, me salía que pidió un tipo Uri, lo convertí y funcionó
final Uri url = Uri.parse(url');
final response = await http.get(url);
me sale esto en la parte de
children: _listGifs(snapshot.data)
The argument type 'Object?' can't be assigned to the parameter type 'List'.
ahi quede
@@anonymushadow282 x2 me quedi alli y me sale el mismo error
@@angelajanlidcarrascoflores5501 no lo pude solucionar, directamente pase al siguiente video y de ves en cuando lo reviso a ver si logro solucionarlo pero nada
@@anonymushadow282 te cuento que se me soluciono: body: FutureBuilder(
future: _process,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView(
children: _listproces(snapshot.data),
);
} else if (snapshot.hasError) {
return Text('error');
}
return Center(
child: CircularProgressIndicator(),
);
}));
}
espero y te funcione.
@@angelajanlidcarrascoflores5501 graciaaas