Introducción a AngularDart

En este artículo, veremos los conceptos básicos del marco AngularDart y cómo podemos comenzar con él en modo en línea. Así que primero veamos qué es Dart.

Dart: Dart es un lenguaje de programación orientado a objetos que admite una variedad de paradigmas de programación como clases, polimorfismo, interfaces, herencia, colecciones y genéricos. Dart es desarrollado por Google y se utiliza para crear aplicaciones y servidores.

Si es un principiante y desea comenzar a implementar el código Dart en línea antes de descargar sus dependencias, le sugerimos que vaya a https://dartpad.dev/?id. Pero si desea sumergirse directamente en él e implementar código en su sistema, puede instalar Dart SDK desde su sitio web oficial https://dart.dev/tools/sdk/archive.

Código en dardo:

void main() {  
    var info = "article";  
    var publisher = "Geeks for Geeks";  
    print("This $info is published on $publisher");  
} 

Producción:

This article is published on Geeks for Geeks

En el código anterior:

• void: El void es un tipo de retorno que indica que la función no tiene un valor de retorno.
• main(): La función main() indica el inicio del programa y es fundamental para su ejecución.
• var: La instrucción var declara una variable y puede contener letras, dígitos o símbolos.
• print(): la función print() se usa para imprimir la salida en la consola.

Nota: podemos ver claramente que es bastante similar a la combinación de sintaxis de estilo C y JavaScript.

Nota: Para obtener más información sobre Dart y su configuración, consulte el tutorial de Geeks for Geeks Dart .

Ahora veamos qué es AngularDart.

AngularDart: AngularDart es un marco desarrollado por Google para crear aplicaciones web, aplicaciones de servidor o aplicaciones de una sola página mediante HTML, CSS y Dart. Es comúnmente conocido por su buena velocidad, ejecución y productividad. AngularJS es una herramienta famosa para crear aplicaciones web estructuradas y AngularDart es básicamente una implementación de Angular en Dart Language. La versión actual de AngularDart es 5.3.1 y se usa en muchas aplicaciones como Fiber, Google Play Console, etc.

Si ha trabajado con Flutter y Dart antes, entonces le encantará AngularDart.

Cómo ejecutar el código AngularDart en línea: si es un principiante y desea probar su código AngularDart en línea, siga estos pasos:

Paso 1: Abra DartPad

Paso 2: haga clic en Nuevo pad

Paso 3: cuando aparezca el cuadro de confirmación, haga clic en Aceptar

Paso 4: seleccione Dart y active el interruptor HTML y haga clic en Crear

Paso 5: ahora puede escribir el código Dart, HTML y CSS, y para ejecutar el código, haga clic en el botón Ejecutar .

A continuación se muestra la implementación del código AngularDart:

import 'dart:html';
  
void main() {
  var header = querySelector('#header');
  header.text = "Geeks for Geeks ";
}

<center>
  <h1 id="header"></h1>
  <h2>is best</h2>
</center>

body {
  display: flex;
  flex-direction: column;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(
    "https://pbs.twimg.com/profile_images/1304985167476523008/QNHrwL2q.jpg")
}
  
h1 {
  color: black;
  font-family: Arial, Helvetica, sans-serif;
}
  
h2 {
  color: black;
  font-family: Arial, Helvetica, sans-serif;
}

Producción:

En el código anterior:

1. Importamos ‘dart:html’ para la biblioteca requerida en el archivo Dart.
2. En el método principal, declaramos la variable como «encabezado» .
3. La variable recogió el valor usando querySelector.
4. Le asignamos a la variable de encabezado un texto para usar en HTML.
5. En el archivo HTML, llamamos al valor del encabezado usando id como parámetro.
6. En el archivo CSS, diseñamos los elementos según nuestras necesidades.

Nota: si desea descargar las dependencias en su sistema, consulte https://angulardart.dev/guide/setup Documentación.

Ahora, veamos la diferencia central entre AngularDart y sus herramientas similares.

AngularDart vs AngularJS

AngularDart vs Flutter:

Los pros y los contras de AngularDart:

Ventajas:

• El código fuente de Angular Dart está limpio
• Bendición para los desarrolladores de Dart.
• Muchas funciones que no eran compatibles con la versión TypeScript se pueden usar con la versión Dart.
• AngularDart no es solo un lenguaje de programación, sino también un conjunto de bibliotecas estables y herramientas sólidas.
• AngularDart es más rápido.

Contras:

• Los tutoriales de AngularDart son difíciles de encontrar.
• Comunidad menos activa de AngularDart.
• El paquete de componentes angulares no es compatible con Internet Explorer.
• Menos popular y no está tan actualizado como Angular Typescript.