Contenido del curso
Flutter para desarrolladores React Native
Si desarrollas aplicaciones con React Native ya habrás notado que hacerlo con Flutter es muy similar pues utiliza el mismo estilo reactivo.
La principal diferencia es que mientras que React Native transpila (traduce) el código a Widgets Nativos para cada plataforma, Flutter compila todo directamente a Nativo controlando cada pixel de la pantalla para evitar problemas de rendimiento causados por el bridge de JavaScript.
Ahora que estás interesado en aprender Flutter voy a darte un breve recorrido entre lo que maneja React Native y lo que encontrarás en Flutter.
El punto de entrada de una aplicación en React Native está definido por ti a partir de una función
// JavaScript function startHere() { // Can be used as entry point }
Flutter maneja un punto de entrada ya definido que es la función main
// Dart main() { }
Más allá de esto, verás que la manera de funcionar de cada uno es muy similar. A continuación te presento cómo sería un Hola Mundo con React Native vs. Flutter:
// React Native import React from "react"; import { StyleSheet, Text, View } from "react-native"; export default class App extends React.Component { render() { return ( <View style={styles.container}> <Text>Hello world!</Text> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center" } }); // Flutter import 'package:flutter/material.dart'; void main() { runApp( Center( child: Text( 'Hello, world!', textDirection: TextDirection.ltr, ), ), ); }
Verás que la verbosidad entre códigos es más reducida en Flutter y esto es gracias al lenguaje de programación Dart y en general la mejora que se está proponiendo con este SDK.
✨ Flutter es menos verboso que React Native, esto hace que sea más sencillo comprender y mantener el código que se implementa.
Si es bellisimo.
La verdad que Flutter se ve mil veces más sencillo y útil que React Native. Soy de esos que siempre que programa algo necesita escribirlo 20 veces hasta conseguir hacerlo de la manera más sencilla posible jajaja 😂
yo estoy en esas tambien, llevo 1 año aprendiendo a programar y estoy desarollando un sitio en NodeJS, la verdad hay mucho codigo spagetti y se siente tan feo que veo la necesidad de volverlo a escribir.
x2 a eso, pero desarrollo en swift
Ese código de React Native se puede mejorar mas.
import React from "react"; import { Text, View } from "react-native"; export default () => ( <View style={{ flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center" }} > <Text>Hello world!</Text> </View> );
El entorno de desarrollo para ReactNative me pareció muy inestable, pesado y con muchos bugs 😦, hasta ahora con Flutter ha sido muy straight forward y sin complicaciones, ¡Genial!
Totalmente de acuerdo! me pasó lo mismo
Lo mismo digo, vengo de react native y me pareció muy inestable hasta la instalación es mucho más facil flutter
Dart i’m ur son!!! ❤️
Al parecer no se va a sufrir tanto si vienes de React
Ciertamente es más reducido, sin embargo tiene un aire de complejidad por su estructura de anidar componentes en forma de "funciones". Center(...)
Quizás por que estoy empezando, imagino que me acostumbraré dentro de poco. Nos vemos en un par de días que termine el curso.
flutter es un lenguaje que mas gente quiere aprender para poder desarrollar de forma rápida y eficiente
Muy emocionado por aprender Flutter! Vamos con todo!
Genial. Esto me hace sentir como cuando estaba aprendiendo CSS.
Este es mi primer curso y la primera vez que veo algo relacionado con la programación, espero aprender mucho, me intereso bastante el tema. :)
Dart no solo acorta código, sino también puede ser para IOS y Android en un solo código 😎
No he manejado react pero me fue mas sencillo entender como funciona react que flutter, no se en donde aplica todos los estilos que tiene react en flutter ES pero entenderlo con el paso del curso
En ReactNative sería.
import React from "react"; import { StyleSheet, Text, View } from "react-native"; export default () => ( <View style={styles.container}> <Text>Hello world!</Text> </View> ); const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center" } });
Una gran ventaja si ya se tiene conocimiento de como funciona y se estructuran los componentes en React No cambia demasiado la manera de declarar interfaces por componentes/widgets
Yo vengo de dos años sin programar, pero lo veo entendible. Llevará bastante tiempo y dedicación, pero tengo una idea y para llevarla a cabo debo manejar bastante bien el lenguaje!
Más compacto, más minimalista 💪🏻
Me gusta , muy simple el codigo y corto.
Va muy interesante todo, pero esas ultimas 4 lineas me recuerdan a LISP
Ahora que lo mencionas a mi me recuerda a los callback hell.
Flutter para quienes vienen del mundo c# y java se les va a hacer muy divertido! aprenderlo
