Monday, October 10, 2022
HomeWordPress DevelopmentFlutter + Dart Frog - DEV Neighborhood πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Flutter + Dart Frog – DEV Neighborhood πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»


Requisitos:

  • Flutter 3.3.4
  • Dart 2.18.2
  • Dart Frog 0.1.2

Dart frog nos brinda esta oportunidad de volvernos Fullstack builders sin pasar por la complejidad de adquirir otro lenguaje si ya somos desarrolladores de Flutter. AsΓ­ que veamos como combinar estas dos tecnologΓ­as para crear un stack completo para la net.



Init proyect



Creamos una carpeta para nuestros archivos

$ mkdir dartfrog+flutter
$ cd dartfrog+flutter
Enter fullscreen mode

Exit fullscreen mode

Create folders



Creamos el frontend

# /dartfrog+flutter
$ flutter create frontend
Enter fullscreen mode

Exit fullscreen mode

create frontend



Creamos el backend

# /dartfrog+flutter
$ dart_frog create server
Enter fullscreen mode

Exit fullscreen mode

create backend



Abre la carpeta dartfrog+flutter en tu editor favorito



Creamos una carpeta public en nuestro servidor

create public folder



Modifiquemos el index.dart para que sirva nuestro html

serve index



Creemos una model net de Flutter

# /dartfrog+flutter/frontend
$ flutter construct net
Enter fullscreen mode

Exit fullscreen mode

Flutter build web



Movamos el construct a nuestra carpeta public en el servidor

# /dartfrog+flutter
$ mv .frontendbuildweb* .serverpublic
Enter fullscreen mode

Exit fullscreen mode

mv flutter build to server



Probemos nuestro proyecto



Corramos el servidor con dart_frog

# /dartfrog+flutter/server
$ dart_frog dev
Enter fullscreen mode

Exit fullscreen mode

dart frog in dev



Revisemos si todo funciona en la net

flutter app on dart frog



Y listo πŸš€

Te dejo el repositorio si quieres echarle un ojo.

Gracias a Dart frog los desarrolladores cellular con experiencia en Flutter pueden dar este paso a la net sin tener que aprender un nuevo lenguaje, minimizando la curva de aprendizaje. Y que opinas la prΓ³xima hacemos deploy de nuestra app?

y Comfortable Hacking πŸ§‘β€πŸ’»πŸŽ‰

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments