Slide 1

Slide 1 text

Acercándonos a Dart Rafael Bermúdez @rafbermudez Fernando G. Pichel @fergpichel Madrid DUG http://www.meetup.com/madrid-dug

Slide 2

Slide 2 text

Madrid DUG Google Dart User Group ¿Qué es Dart? Es un lenguaje de programación desarrollado por Google en 2011 ❖ Desarrollo Web ❖ Open Source ❖ Compatible con JS Interpretado: Se ejecuta en su propia VM ❖ Estructurado ❖ Flexible ❖ Orientado a objetos

Slide 3

Slide 3 text

Madrid DUG Google Dart User Group ¿En qué destaca? ❖ Legible ❖ Estructurado ❖ Fácil de mantener ❖ Programación asíncrona ❖ Rápido ❖ Modern Browser Compatible ❖ Web Components Polymer.dart

Slide 4

Slide 4 text

Madrid DUG Google Dart User Group Polymer.dart Polymer es una implementación del estándar HTML Web Components, un estándar que quiere revolucionar la manera en la que se desarrollan aplicaciones web en los navegadores. https://www.dartlang.org/docs/tutorials/polymer-intro ❖ Polymer custom elements ❖ Diseñar HTML tags para encapsular estilos, estructura y comportamientos ❖ Crear bindings bidireccionales entre Dart objects y DOM nodes ❖ Uso de Web Standars emergentes: custom elements, HTML Imports, Shadow DOM ....

Slide 5

Slide 5 text

Madrid DUG Google Dart User Group Dart Virtual Machine Dartium: Chromium + Dart VM dart2js: compilación a Javascript Dart VM puede ejecutarse en dos modos: checked o production Por defecto arrancará en production. Se recomienda habilitar el modo checked para desarrollo y testing dart --checked test.dart

Slide 6

Slide 6 text

Madrid DUG Google Dart User Group Velocidad

Slide 7

Slide 7 text

Madrid DUG Google Dart User Group Velocidad

Slide 8

Slide 8 text

Madrid DUG Google Dart User Group Velocidad

Slide 9

Slide 9 text

Madrid DUG Google Dart User Group Velocidad

Slide 10

Slide 10 text

Madrid DUG Google Dart User Group Velocidad

Slide 11

Slide 11 text

Madrid DUG Google Dart User Group Librerías Gestor de paquetes Pub https://pub.dartlang.org/ Herramienta que nos permite añadir librerías. También incluye comandos para crear, desarrollar y desplegar Se ocupa de resolver dependencias automáticamente

Slide 12

Slide 12 text

Madrid DUG Google Dart User Group ¿Quién usa Dart? https://www.dartlang.org/community/who-uses-dart.html MANDRILL

Slide 13

Slide 13 text

Madrid DUG Google Dart User Group Tutoriales ❖ Avast, Ye Pirates: Write a Web App Creación de una web app usando Dart Editor. ❖ A Tour of the Dart Language ❖ The Dart Tutorials ➢ Varios tutoriales sobre instalación de paquetes, creación de DOM elements, Polymer Custom Elements, Forms ...

Slide 14

Slide 14 text

Lenguaje Dart Rafael Bermúdez @rafbermudez Fernando G. Pichel @fergpichel Madrid DUG http://www.meetup.com/madrid-dug

Slide 15

Slide 15 text

Madrid DUG Google Dart User Group ¿Por dónde empezar? ❖ Buena comunidad ❖ Buena bibliografía ❖ Documentación oficial ➢ https://www.dartlang.org/docs/ ➢ Especificaciones del lenguaje ■ https://www.dartlang.org/docs/spec/index.html

Slide 16

Slide 16 text

Madrid DUG Google Dart User Group Orientado a objetos ❖ Basado en clases ❖ Herencia Simple ❖ Lenguaje OO ➢ Todo es un objeto ➢ Tipos primitivos => Son objetos ➢ Object = root de la jerarquía de clases ➢ El tipo de ejecución de cada objeto es una instancia de la clase Type

Slide 17

Slide 17 text

Madrid DUG Google Dart User Group Concurrencia ❖ Single threaded ❖ Isolate ➢ Unidad de concurrencia ➢ Tiene su propia memoria y control de thread ➢ No hay estado compartido entre isolates ➢ Se comunican entre ellos mediante paso de mensajes

Slide 18

Slide 18 text

class Persona { // Variables de instancia. String nombre; // variable inicializa a null. String apellidos; // variable inicializa a null. num edad; // variable inicializa a null. num hijos = 0; // variable inicializa a 0. // Constructor. Persona() {} // Método que lanza un saludo de presentación void presenta() => print('Hola me llamo $nombre'); } Madrid DUG Google Dart User Group Clases

Slide 19

Slide 19 text

class Programador extends Persona implements DichoStarWars { String lenguajeFavorito = “Dart”; // Método que sobreescribe el saludo de presentación @override void presenta() => print('Hola mundo soy $nombre'); // Método que implementa el dichoStarWars de la interfaz void dichoStarWars() => print("que la fuerza te acompañe"); } Madrid DUG Google Dart User Group Herencia e Interfaces

Slide 20

Slide 20 text

Madrid DUG Google Dart User Group Ámbito (Contexto) ❖ Ámbito de una declaración ➢ Lexical scoping (o estático) ➢ Lexical scoping tiene preferencia sobre inheritance scope

Slide 21

Slide 21 text

Madrid DUG Google Dart User Group Privacidad ❖ 2 niveles de privacidad ➢ Público / Privado ❖ Por defecto siempre se utiliza el modo público ❖ Sintaxis del nivel privado ➢ Mejora la documentación del código String nickname; // público String _nombreReal; // privado

Slide 22

Slide 22 text

Madrid DUG Google Dart User Group Variables ❖ Estáticas (Lazy) o dinámicas ❖ Finales o mutables ➢ final => Se inicializa una vez ➢ const => ■ cte. en tiempo de ejecución ■ implicitamente finales

Slide 23

Slide 23 text

Madrid DUG Google Dart User Group Tipos de datos * Los tipos de datos primitivos también son objetos String bool num DateTime int Set double Map

Slide 24

Slide 24 text

Madrid DUG Google Dart User Group Operadores ❖ Tipos de operador Aritméticos Asignación Test de tipado De Bits Condicionales De igualdad y relacionales

Slide 25

Slide 25 text

❖ Operadores de test de tipado numerito as num; // Casting de tipos var IsNum = numerito is num; // Verdadero si el objeto es del tipo indicado var IsNotNum= numerito is! num; // Falso si el objeto es del tipo indicado Madrid DUG Google Dart User Group Operadores II

Slide 26

Slide 26 text

void saludaMeetup(String nombreMeetup) { print('Bienvenidos al meetup de ${nombreMeetup}'); } Madrid DUG Google Dart User Group Funciones

Slide 27

Slide 27 text

Madrid DUG Google Dart User Group Funciones II ❖ Parám. opcionales por posición void saludaMeetup (String nombreMeetup, [String siglas, num miembros]) {...} ❖ Parám. opcionales por nombre void saludaMeetup ({String nombreMeetup, String siglas, num miembros}) {...} ❖ Valores predeterminados void saludaMeetup ([String nombreMeetup = 'MadridDUG']) {...} ❖ Valores de retorno ➢ return x ➢ todas las funciones devuelven un valor de un tipo concreto.

Slide 28

Slide 28 text

Madrid DUG Google Dart User Group Looping ❖ Bucle for ❖ While y do while ❖ Switch ❖ *Control: break y continue ❖ Iterables lista.forEach((item){...}); for(item in lista) {...} *Se puede iterar a través de list, map y set

Slide 29

Slide 29 text

var resultado; try { // Intento descifrar una contraseña resultado = rompePassWord(password); } on Exception catch(e) { // Se produce un error al procesar el descifrado. resultado = 'No se ha resuelto !'; } finally { // Muestro la respuesta al usuario. print(resultado); } Madrid DUG Google Dart User Group Excepciones

Slide 30

Slide 30 text

Madrid DUG Google Dart User Group Excepciones II ❖ dart:core => Exception y Error para el manejo ❖ Permite crear tus propias excepciones ❖ Mecanismos de manejo ➢ throw ➢ on /catch ➢ finally ❖ Si no se captura, el isolate se termina

Slide 31

Slide 31 text

❖ Análisis estático => Dart analyzer ❖ Unit testing void main() { test('QuickSort', () => expect(quickSort([5, 4, 3, 2, 1]), orderedEquals([1, 2, 3, 4, 5])) ); * https://www.dartlang.org/docs/#testing Madrid DUG Google Dart User Group Testing

Slide 32

Slide 32 text

Madrid DUG Google Dart User Group Librerías ❖ Permiten crear código modular ❖ Compartibles y reutilizables ❖ Fichero librería library mylibraryname; ❖ Fichero que la utiliza import "path/to/mylibraryname.dart";

Slide 33

Slide 33 text

Madrid DUG Google Dart User Group Librerias II ❖ Algunas librerías interesantes dart:async dart:indexed_db dart:collection dart:io dart:convert dart:isolate dart:core dart:js dart:html dart:math

Slide 34

Slide 34 text

Bonus Rafael Bermúdez @rafbermudez Fernando G. Pichel @fergpichel Madrid DUG http://www.meetup.com/madrid-dug

Slide 35

Slide 35 text

❖ Compatible con HTML5 ❖ Simplifica la interacción ❖ Manejo estructurado del DOM ❖ Búsqueda de elementos ➢ querySelector() y querySelectorAll() ➢ devuelven colecciones de datos nativas de Dart ❖ Constructores para elementos del DOM ➢ new DivElement() Madrid DUG Google Dart User Group Dart y el DOM

Slide 36

Slide 36 text

import 'dart:html'; void main() { var text = document.querySelector('#sample_text_id'); text.text = 'Bienvenido a MadridDUG !'; text.lang = 'ES'; text.attributes.forEach((k, v) => print('$k: $v')); text.style.backgroundColor = '#f87c45'; } Madrid DUG Google Dart User Group Dart y el DOM II

Slide 37

Slide 37 text

Madrid DUG Google Dart User Group Future y Stream Apis ❖ Permite encapsular en una forma OO respuestas asíncronas de manera nativa ❖ Future Object, Promesa Object // Futuros void getResult() { var xhr = HttpRequest.getString('http://www.google.es') ..then((resp) => print(resp)) ..catchError((e) => print('Error!')); }

Slide 38

Slide 38 text

❖ Dispone de funcionalidades para la creación de la documentación ❖ Metaprogramación ❖ ...etc Madrid DUG Google Dart User Group Y ... ¡mucho más!

Slide 39

Slide 39 text

Madrid DUG Google Dart User Group Gracias! Madrid DUG http://www.meetup.com/madrid-dug Rafael Bermúdez @rafbermudez Fernando G. Pichel @fergpichel