Cómo crear un Proyecto en Flutter

Indudablemente Flutter se ha convertido en una de las herramientas favoritas para la creación de aplicaciones. En este artículo vamos a aprender cómo crear un proyecto y ejecutarlo en función del tipo de editor de código que prefiramos o incluso si preferimos crearlo desde la terminal. ¡Vamos a ello!

ANDROID STUDIO | INTELLIJ

Creando la app

Para empezar a crear un proyecto en flutter en el editor de código de Antroid Stuido o IntelliJ hay que seguir los siguientes pasos:

  1. Seleccionar la pestaña File > New Flutter Project
  2. Introducir el nombre de tu proyecto.
  3. Seleccionar la carpeta de destino de tu proyecto.
  4. Seleccionar Flutter application entre las opciones.
  5. Puedes escribir una descripción, de forma opcional, acerca de tu proyecto, algo especificativo que pueda definir tu proyecto.
  6. También puedes definir tu organización. Por defecto será com.example.
    • com ⇒ hace referencia a la terminación de tu dominio
    • example ⇒ hace referencia al nombre de tu organización
    • En el caso de que tu dominio sea flutteracademy.app este campo se rellenaría como app.flutteracademy haciendo referencia de esta forma a la organización.
  7. Seleccionar los lenguajes correspondientes. Asegurarse de que son Kotlin para Android y Swift para iOS.
  8. Seleccionamos las plataformas en las que queremos realizar nuestra aplicación. (Ej. Android e iOS)
  9. Hacer click en Finish.

Nota: Hay que asegurarse de que el Flutter SDK Path tiene la localización específica del SDK. Debes instalarlo en caso de que no lo hayas hecho ya.

Ejecutando la app

Hay que asegurarse de que hay un dispositivo conectado. En caso contrario hay que seleccionar uno.

Una vez seleccionado el dispositivo ejecutamos la aplicación con la barra de herramientas. Dando al botón que es un “play” en color verde.

¡Enhorabuena! ¡Ya tienes funcionando tu proyecto!

VISUAL STUDIO CODE

Creando la app

Para empezar a crear un proyecto en el editor de código de Antroid Stuido o IntelliJ hay que seguir los siguientes pasos:

1. Seleccionar la pestaña View > Command Palette

2. Seccionar Flutter: New Proyect

3. Seleccionar el tipo de proyecto. En este caso se trataría de una Application

4. Seleccionar la carpeta de destino de tu proyecto.

5. Introducir el nombre de tu proyecto. Puedes indicar que es myfirstapp.

6. Presionar Intro.

Ejecutando la app

Hay que asegurarse de que hay un dispositivo conectado. En caso contrario hay que seleccionar uno.

Para ello vamos a view > Command Palette y seleccionamos Flutter: Select Devices y seleccionamos o ejecutamos el dispositivo que necesitamos.

Una vez seleccionado el dispositivo podemos hacer uso de la barra de herramientas de VSCode siempre que estemos situados en el main.dart de nuestra aplicación. Tenemos varias opciones:

1. Usar la barra de herramientas para reproducir el código en la esquina superior derecha.

2. Reproducir el código a través de las opciones que se sitúan como ayuda encima del void main.

3. Aunque sin duda la opción mas recomendada es ejecutar un archivo de ejecución en la pestaña de run and debug de VSCode.

  • Seleccionamos la opción de create a launch.json file

  • Una vez ejecutado este archivo ya podremos reproducir la aplicación a través de esta nueva barra de herramientas

¡Enhorabuena! ¡Ya tienes funcionando tu proyecto!

TERMINAL

Creando la app

Para crear una app de Flutter hay que abrir una nueva terminal del ordenador y asegurarse que estamos situados en la ruta donde queremos que se vaya a crear nuestro proyecto.

Posteriormente hay que ejecutar el siguiente comando:

flutter create --org com.yourdomain your_app_name

com.yourdomain ⇒ sería el dominio de tu organización.

your_app_name ⇒ sería el nombre de tu aplicación.

Ejecutando la app

Para ejecutar la app debemos situarnos en la ruta de nuestro proyecto desde la terminal.

cd your_app_name

Una vez situado es la ruta debemos seleccionar un nuevo dispositivo. Para ello debes asegurarte de que tienes un dispositivo abierto puedes hacerlo con el comando:

flutter devices

flutter emulators

Una vez sepas el nombre del dispositivo que quieres ejecutar puedes ejecutar el comando:

flutter emulators --launch [nombre del dispositivo]

Una vez ejecutado el dispositivo podemos correr la aplicación

flutter run

¡Enhorabuena! ¡Ya tienes funcionando tu proyecto!

Did you like it? Share it!
Lastest posts