Aprendiendo Flutter

B

Buenas a todos.

El caso es que Flutter me llama la atencion por el tema de ser multiplataforma y sencillito. El caso es que quizá no es tan sencillito como te lo plantean en los vídeos de YouTube.

Estoy siguiente tutoriales para aprender y algún curso, pero el asunto es que en TODOS los tutoriales te muestran como hacer la UI... Pero a ver, yo soy principiante y se poco, pero si hacen una app de ejemplo que no es más que un mockup de una app... Como se supone que voy a aprender a digamos... Integrar realmente el login de usuarios o el almacenamiento de datos con el resto de la app? Hay videos dedicados solo a esta parte pero no he visto aún ninguno que haga una app completa (como sea) para coger nociones de como estructurar cosas.

No se... Haciendo la UI y viendo los widgets todo es sencillito, entiendo todo a la perfeccion y puedo replicarlo, pero no quiero eso, quiero hacer una app que funcione, no un bonito marco que se mueve.

Ayuda?

kidandcat

Quieres arquitecturar una app completa, decidiendo como estructurar tu app, manejar entrada y salida de datos, conectividad con el servidor, etc etc.
Enhorabuena, eso es el trabajo que no hace un junior porque hace falta experiencia, en un tutorial no te lo van a enseñar, lo aprendes a base de prueba y error, o en cursos sobre temas específicos.

Dicho todo esto, te recomiendo GetX para ir tirando que es muy sencillo https://github.com/jonataslaw/getx

1 respuesta
squ4r3

Hasta donde yo sé, Flutter es una librería de frontend. La lógica de qué hace el botón cuando lo pulsas es una pieza independiente de la UI.

Normalmente los tutoriales suelen centrarse en el backend o en el frontend y luego conectas una pieza con otra.

Mi consejo si estás aprendiendo es que no utilices librerías, yo lo que hice fue hacer botones en html plano y fui mirando cómo hacer que algo escrito en un formulario pasase a un backend, de ahí a una base de datos, etc... Creo que es una forma mejor de entender la base y cómo está todo relacionado, y ya una vez tengas eso claro pasar a utilizar librerías

Nunca vas a encontrar un tutorial que utilice exactamente el mismo stack de tecnología que utilizas tú. Siempre hay detallitos (como el sistema de login, colas...) que serán diferentes a lo que veas en un tutorial.

1 respuesta
B

#2 #3 Sisi eso lo sé... Solo quería desahogarme porque siendo autodidacta por mucho que mire front y luego tutos de backend no se como casar unos con otros... No se como hacer que funcione la verdad.

Tampoco se si merece la pena para pasar el rato que siga con ello porque me está generando más dolores de cabeza que gratificación

3 respuestas
squ4r3

#4 yo he estado en esa misma situación, creo que lo importante es que encuentres un proyecto que se adapte a tus habilidades.

No sé si te interesa hacer una aplicación web o una aplicación móvil, pero yo uno de los primeros tutoriales que seguí con los que pude hacer una aplicación de cero fue el megatutorial de Miguel Grinberg.

Te lleva paso por paso creando un backend, un frontend y conectándolo todo con una base de datos. Utilicé eso como base y a partir de ahí fui construyendo mi primera aplicación.

Una vez hecho eso me resultó ya mucho más fácil ponerme luego por mi cuenta y aprender a hacer una API con Express, usar react como frontend... etc.

Al principio son muchos dolores de cabeza y problemas que parece que no tienen solución, cosas que petan y no sabes por qué... si eso te pasa te recomiendo darle unos días de descanso, y volver a ello pasado unos días. Pero es una parte del proceso de la que se sale, no desesperes!

1 1 respuesta
Sk8eR

#4 aprende flutter, tendras trabajo bastante rápido como JR, mirate una arquitectura BLOC y haz un curso de Udemy que resuelva tus dudas

1 respuesta
kidandcat

#4 Centrate en una de las dos cosas y ve aprendiendo, la otra puedes suplirla con soluciones existentes, por ejemplo para el backend:

https://appwrite.io/docs/getting-started-for-flutter

https://firebase.flutter.dev/docs/overview/

1 respuesta
B

#5 Gracias por el consejo. Python se me escapa un poco de lo que busco hacer, que vienen a ser mas bien apps y algun jueguito quiza. Todo como Hobby. Eso si, me ha servido la opinion y el consejo.

#6 No me interesa tanto buscar trabajo, ya tengo, es mas bien por hacer algo funcional en mis ratos libres, aunque me lleve tiempo.

#7 Había mirado Firebase, pero no se bien si con algun curso de firebase ya me valdria para conectar el frontend (la UI de los tutus de youtube) y hacer que la app funcione, por ejemplo hacer que mi novia se pueda loguear en una app. Me interesan cosas sencillas como Login (lo mas basico), quiza guardar información que hayan seleccionado como favorita y poco mas. Se me escapa alguna cosa primordial que yo no vea por novato?.

Otra duda que os hago a todos... Bueno, dos, veis factible aprender de manera autodidacta desarrollo de apps con este framework y...de donde se pueden sacar imagenes, vectores o cositas de diseño gratis o "gratis" para trastear (no pienso publicar ninguna app, pero es por ir dejando monas las que pueda ir aprendiendo hacer).

1 respuesta
squ4r3

#8

Yo veo totalmente factible aprender por tu cuenta, pero creo que hay que ir por partes. Si lo que quieres es una aplicación nativa de móvil (que se instale en Android o iOS) y que tenga autenticación, estás intentando subir del escalón 1 al 10 de golpe.

Aunque para ti eso pueda parecer algo sencillo, en realidad supone muchos problemas: ¿Qué es una sesión? ¿Desde dónde autentificas? ¿Cómo mantienes la sesión abierta? ¿Cómo te aseguras de que las sesiones no se crucen? ¿Cómo muestras datos según esté un usuario logeado y no otro?

Aunque Firebase facilite muchísimo todas estas cuestiones, personalmente yo creo que para implementarlo es necesario comprender antes de forma más sencilla cómo puede funcionar una aplicación.

Si hablamos de web, yo los pasos que seguiría son:

  • Hacer una página HTML, enlazar varias páginas html

  • Añadir Javascript en esas páginas HTML, poder capturar información de un formulario cuando el usuario meta datos, por ejemplo.

  • Primeros pasos en NodeJS, es decir, ese mismo javascript pero ejecutado en un servidor, no en el navegador del usuario.

  • Hacer una API sencillita en Express (NodeJS)

  • Conectar esa API a una BBDD. NeDB o Sqlite es lo más sencillito, lo puedes guardar en un archivo pelado sin tener que armar mucha historia.

  • Conectar esa base de datos a la API y desde la API enviar información al cliente (la página HTML)

  • Guardar datos que el usuario escriba en la página HTML en la base de datos, vía llamada a la API

con eso acabarías controlando cómo Crear, Leer, Actualizar y Borrar datos, lo que se conoce como CRUD por sus siglas en inglés, que son las operaciones básicas sobre datos almacenados.

Con ese conocimiento ya puedes atacar Firebase entendiendo mejor qué papel juega en el entorno, cómo quieres que se conecte, qué datos le vas a pedir.

Aunque suene a rollo, yo creo que meterse de primeras en temas como Firebase o Flutter es demasiado follón, porque asumen cierto conocimiento por parte del usuario, tanto en documentación como en operatividad, que si no tienes, probablemente acabes pegándote 15 horas con un tutorial básico y sintiéndote un gilipollas porque estás haciendo algo mal. Y no es porque no valgas, es porque necesitas primero "bajar" más al origen de cómo funciona todo para poder luego entender cómo funcionan los frameworks.

Ya te digo, todo esto desde mi experiencia personal, que por lo que comentas creo que ha sido bastante parecida a la mía. Yo intenté hacer varias apps y todas las dejé a medias atascado en diferentes puntos porque no lograba entender conceptos básicos que en la documentación se dan por supuestos.

1 respuesta
B

#9 Si, en efecto se me escapan muchos pasos.

La cosa es que quiero hacer una app util para mi y para mi novia (ej: conteo de calorias o algo asi para la dieta que seguimos). SE, como un hecho, que puedo hacer la UI, ya he hecho varios ejemplos y entiendo perfectamente para que hace cada cosa el que haga el tuto, lo que no sabria es hacerla yo de cero claro, aunque creo que es normal.
Lo que pasa es que despues del tuto me quedo con cara de bobo al ver que tengo dos, tres bonitas pantallas, que a lo sumo puedo pasar de una a otra, pero no se como interaccionar mas alla.
Ej: Puedo crear una app de conteo de calorias, bonita, que tenga su splash screen con info al inicio, su home page donde hay info de las calorias (AQUI no tengo ni la idea de como hacer que despues de seleccionar X alimento sume al conteo diario, eso ya entraria en cosa de mates creo), y luego otras paginas con imagenes por tipos de alimento con listas de los diferentes alimentos y sus macros. Hasta aqui llego.

Otra posibilidad es...Es viable hacer una app sin necesidad de Login? Algo mas estilo wiki? No se si es util o no la verdad

2 respuestas
B

#10 lo que comentas me parece que ya hay apps creadas, bueno, que no hay creado hoy en día

Puedes descargarte alguna que te guste y veas todas las funcionalidades que tenga, luego crear una versión muy simplificada con tus retoques

Aunque pienso lo mismo que @squ4r3, estás intentando hacer un salto muy grande

1 respuesta
squ4r3

#10 Pues creo que, teniendo claro lo que quieres conseguir, puedes empezar a dividir problemas.

  • App web de conteo de calorías.

Define tu objetivo final y cómo te gustaría que funcionase, si supieras hacer todo. Por ejemplo: El usuario se logea, se le muestra una pantalla tipo dashboard con su evolución a lo largo del tiempo, un botón grande arriba para guardar los datos del día. Al hacer click en ese botón, le sale un buscador para que escribas alimentos, según vas escribiendo se autocompleta con los alimentos que tengas en la base de datos. Que haya una opción para añadir alimentos nuevos si es que el alimento no se encuentra en la BBDD. (De nuevo, me lo estoy inventando un poco en función de los datos que has comentado).

De ahí puedes empezar a extraer "piezas" y considerar cada una de esas piezas como algo nuevo que aprender. Una vez tengas todas las piezas, ya te encargarás de juntarlas. Yo me lo tomo como un puzzle. Es más fácil averiguar cómo funciona una pieza que 200 piezas a la vez. Yo me frustro mucho.

Has comentado que la interfaz la tienes controlada. Genial, pues eso de momento ignóralo, porque ya lo tienes. Otras piezas que puedes aprender

  • Login
  • Buscador
  • Mostrar datos que vivan en una base de datos (los alimentos)
  • Añadir datos a una base de datos

El login y el buscador es lo más jodido, en mi opinión. Te queda mostrar datos que vivan en una base de datos y añadirlos en función de lo que el usuario rellene.
¿Cómo se puede reducir más todavía este problema? Si en lugar de pensar en guardarlos en una base de datos, primero aprendes cómo manipular esos datos desde el cliente. En la propia web.

Ahí entra en juego lo que te comentaba de aprender un poco de javascript. Puedes reducir tu problema a una versión mucho más sencilla: Imagina que en una página HTML tienes una tabla con una lista de alimentos y quieres que el usuario, en un formulario, añada un alimento a esa lista cuando le de a un botón de guardar. Y que quieres sumar las calorías de todos los alimentos, por ejemplo, mostrándolo también en el html.

Pues habiendo reducido los elementos a: javascript, html, formulario y procesar datos, a buscar: p.ej. https://www.infoworld.com/article/2077176/using-javascript-and-forms.html (no estoy diciendo que el tutorial ese sea bueno, he hecho click literalmente en el primer link que he visto).

Cuando hayas visto cómo funciona eso, como puedes hacer que javascript haga cosas cuando el usuario envíe datos en un formulario, puedes ir volviendo a la versión original de tu problema, y acercándote más a su solución. Ahora en vez de mostrarlo solo en la web, hay que guardarlo. Pues antes de meterte con bases de datos, guárdalo en un objeto en memoria que tenga todos los alimentos. Así aprendes cómo están construidos los objetos en javascript, como pushear un nuevo elemento a un array, etc...

Todo esto asumiendo que lo que quieres es realmente hacer una app de cero para entender cómo funciona. Si no, si lo que te interesa es directamente tu resultado, creo que lo que quieres se puede conseguir bastante fácilmente con una "smart spreadsheet" que están muy de moda ahora, como airtable o incluso un Notion.

1 respuesta
B

#11 Ya, si no es tanto por usarlas sino por aprender a hacer algo, por tener hobbies y tal. Me gusta la idea de "imitar" o tratar de duplicar una app similiar a lo que yo quiera, pero exactamente como dice @squ4r3 me estoy saltando pasos.

El tema es que no se bien como debería aprender lo que necesito. Algun consejo que este relacionado con apps moviles? Me llaman mas que las paginas web por alguna razón. #12 Debería centrarme mejor en web primero? No se si le veo tanta utilidad por eso de llevar el movil siempre en el bolsillo.

1 respuesta
PiradoIV

#13 Si te interesa el desarrollo de apps móviles, tira por ahí. Cualquier cosa que aprendas seguramente lo vas a poder aplicar luego a desarrollo web, por ejemplo.

Piensa en apps más pequeñas y quítate de encima lo que se meta en tu camino. Si el login, un backend o una base de datos se meten en tu camino para aprender a crear cosas con Flutter... no las hagas. Empieza con apps que no necesiten nada de eso. Piensa en las apps que vienen con el propio sistema operativo de tu móvil... incluso la app de "Reloj" de iOS es interesante para replicarla.

Siempre que pruebo un entorno de programación nuevo, me lanzo a hacer estas pequeñas tareas, que van aumentando la complejidad gradualmente:
https://eugenkiss.github.io/7guis/tasks/

1 2 respuestas
DaLmAu

#14 tiene buena pinta esas task pero nadie las hizo en vanila JS, me parece raro

1 respuesta
PiradoIV

#15 Estarán instalando dependencias de NPM todavía 😏

B

#14 muchas gracias por los ánimos.

Mi hoja de ruta pasa por lo siguiente:

  • Hola Mundo yo sólito, que sea algo chulo, no imprimirlo por pantalla y ya.

  • Una pokedex clásica con los 151 pokemon con los que crecí... Lo mismo, pa aprender, ni usuarios ni nada

  • Task Manager (o hacer una app de notas que puedas crear, modificar y borrar, o bien hacer una app de pomodoros...).

Seguir aprendiendo.

1