Empezando a programar apps multi-dispositivo con Flutter

Empezando a programar apps multi-dispositivo con Flutter

Para programar una app, lo habitual es hacer diferentes desarrollos, por un lado para Android (Google), para IOS (Apple) además de las aplicaciones web. Las apps de desarrollan de manera distinta para uno otro.

Los equipos de programadores están especializados en alguno de estos sistemas, además de la programación backend.

Hay tecnologías que permiten programar una app y tener un resultado multidispositivo, para así no tener que programar la misma aplicación varias veces. Los principales players son React Native, Cordova y Flutter

Aquí vamos a hacer una pequeña introducción a Flutter y a explicar en qué se diferencia del resto.

¿Por qué elegir Flutter para desarrollar una app?

Flutter es un SDK, basado en el lenguaje Dart que forma parte del ecosistema Google para desarrolladores.

Se puede decir que Google abarca el ciclo completo de desarrollo:

Las tecnologías Dart-Flutter es una pieza más en este ciclo que permite desarrollar una única aplicación y tenerla disponible tanto en teléfonos móviles, web, smartwatches y televisores con un único desarrollo, el cual produce un código completamente nativo de la maquina en la que deseemos ejecutarlo.

Empezar con Dart

Dart es el lenguaje de programación que usa la tecnología de Flutter. Para empezar con el, podemos meternos en la pagina web de dartpad y escribir el hola mundo:

void main()  {
    print('Hello world!');
}

Empezar con Flutter

Vamos a ver como instalar Flutter por primera vez en Windows y visualizar una app de demostración compilada en web con Google Chrome

Descargar el SDK

En este enlace se puede obtener la versión mas estable reciente de Flutter. Es necesario tener instalado Google Chrome.

Después de descomprimir la carpeta flutter, por ejemplo en C:\src\, para luego entrar en el directorio C:\src\flutter\bin con la consola CMD de windows y poner Flutter en modo beta, esto es porque el desarrollo de apps web aun no a alcanzado la versión estable:

 $ cd c:\src
 $ flutter\bin\flutter channel beta
 $ flutter\bin\flutter config --enable-web

Ahora tenemos que crear una app de ejemplo para poder verla en el explorador:

 $ flutter\bin\flutter create myapp
 $ cd myapp

y por último la ejecutamos para poder verla:

 $ ..\flutter\bin\flutter  run -d chrome

y el resultado:

flutter_Demo.PNG

Esta es la página oficial con todos los detalles de la instalación.

Los detalles de las construcciones de apps web están aquí