DEV Community

Cover image for Dart - instalación y configuración en Ubuntu
Oscar Pincho
Oscar Pincho

Posted on

Dart - instalación y configuración en Ubuntu

Logo de Dart

Recomiendo ver antes - instalacion de Homebrew y asdf en ubuntu ( es corto son 5 comandos)

📘 Documentación Oficial

⭐ Frameworks Populares(curva de aprendizaje baja → alta):

  • Shelf — Simple para APIs.
  • Dart Frog — A fast, minimalistic backend framework for Dart
  • Angel — Estilo Express, más completo.
  • Serverpod — Más grande, orientado a microservicios, .

Nota: No olvidemos que lo mas importante que tiene hoy Dart es Flutter, aunque casi que necesitat su propio apartado


🛠️ Instalación de Dart en Ubuntu

Por APT (via repositorio oficial)

sudo apt update
sudo apt install apt-transport-https

sudo sh -c 'wget -qO- https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -'
sudo sh -c 'wget -qO /etc/apt/sources.list.d/dart_stable.list https://storage.googleapis.com/dart-archive/channels/stable/release/latest/linux_packages/dart_stable.list'

sudo apt update
sudo apt install dart
Enter fullscreen mode Exit fullscreen mode

🍺 Instalación con Homebrew

brew install dart
Enter fullscreen mode Exit fullscreen mode

📦 Gestor de paquetes: pub (integrado en Dart)

dart pub add <paquete>
dart pub get
Enter fullscreen mode Exit fullscreen mode

🟩 ASDF para Dart

Dependencias del sistema

sudo apt update
sudo apt install curl git unzip
Enter fullscreen mode Exit fullscreen mode

Instalar plugin + versión

asdf plugin add dart https://github.com/patoconnor43/asdf-dart.git

asdf list-all dart
asdf install dart 3.4.0
asdf global dart 3.4.0
Enter fullscreen mode Exit fullscreen mode

Ejemplo .tool-versions

dart 3.4.0
Enter fullscreen mode Exit fullscreen mode

📝▶️ Crear y ejecutar un archivo Dart

Crear archivo: touch hola.dart

Código de hola.dart

void main() {
  print('Hola Mundo desde Dart!');
}
Enter fullscreen mode Exit fullscreen mode

💻 Ejecutar Localmente:

dart run hola.dart
Enter fullscreen mode Exit fullscreen mode

quieres saber mas?


🟦 Ejemplos básico en Dart

NOTA: ambos codigos son compatibles con Dart 3.9

🗂️🌐 Servidor Web de archivos estaticos.

Que Hace:

  1. Definir el nombre del parámetro de consulta (query parameter)
  2. Obtener el valor del parámetro de consulta de la URL.
    • htmlEscape sanitiza el texto recivido quitando los caracteres especiales como < y > en entidades HTML.
  3. Se dibuja la variable recivida en el query parameter dentro de la etiqueta

📝 Crear archivo: touch server.dart

📦 Contenido de server.dart

import 'dart:convert';
import 'dart:io';

void main() async {
  final server = await HttpServer.bind(InternetAddress.loopbackIPv4, 9000);
  print('Servidor corriendo en http://localhost:9000');

  await for (HttpRequest request in server) {
    final params = request.uri.queryParameters;
    final username = params['username'] ?? 'invitado';

    final escaped = htmlEscape.convert(username);

    final htmlContent = """
      <!DOCTYPE html>
      <html lang="es">
      <head>
          <meta charset="UTF-8">
          <title>Hola</title>
      </head>
      <body style="text-align:center">
          <img src="https://dev.to/oscarpincho/mejora-ubuntu-con-homebrew-y-asdf-gestor-de-versiones-multiples-4nka" />
          <h1>Hola, $escaped</h1>
      </body>
      </html>
    """;

    request.response.headers.contentType = ContentType.html;
    request.response.write(htmlContent);
    await request.response.close();
  }
}
Enter fullscreen mode Exit fullscreen mode

▶️ Correr el proyecto / levantar el servidor

dart run server.dart
Enter fullscreen mode Exit fullscreen mode

👉 visitar:
http://localhost:9000/?username=Homero

🔗 Para probar el sanitizado de url:
http://localhost:9000/?username=<h1>--Homer--</h1>


⚙️🧩 Json API Rest

Que Hace:

  1. Lee los datos desde un archivo data.json
  2. expones 1 endpoint con esos datos
  • Una Lista de personajes en /characters
  • y los datos de un personaje por id /characters/:id

Ejemplo de archivo: data.json

[
  {
    "id": 1,
    "age": 39,
    "name": "Homer Tompson",
    "portrait_path": "https://cdn.thesimpsonsapi.com/500/character/1.webp"
  },
  {
    "id": 2,
    "age": 39,
    "name": "Marge Simpson",
    "portrait_path": "https://cdn.thesimpsonsapi.com/500/character/2.webp"
  }
]
Enter fullscreen mode Exit fullscreen mode

📝 Crear archivo: touch api.dart

📦 Contenido de api.dart

import 'dart:convert';
import 'dart:io';

void main() async {
  final server = await HttpServer.bind(InternetAddress.loopbackIPv4, 9001);
  print("Servidor JSON en http://localhost:9001");

  await for (HttpRequest request in server) {
    final path = request.uri.path;

    final characters = await loadCharacters();

    if (request.method == 'GET' && path == '/characters') {
      _sendJson(request, characters);
      continue;
    }

    if (request.method == 'GET' && path.startsWith('/characters/')) {
      final idStr = path.split('/').last;
      final id = int.tryParse(idStr);

      if (id == null) {
        _sendJson(request, {"error": "ID inválido"}, status: 400);
        continue;
      }

      final character = findById(characters, id);

      if (character == null) {
        _sendJson(request, {"error": "Personaje no encontrado"}, status: 404);
      } else {
        _sendJson(request, character);
      }
      continue;
    }

    _sendJson(request, {
      "error": "Ruta no encontrada",
      "url_lista": "http://localhost:9001/characters",
      "url_personaje": "http://localhost:9001/characters/1"
    }, status: 404);
  }
}

Future<List<Map<String, Object?>>> loadCharacters() async {
  final file = File('data.json');
  final content = await file.readAsString();
  final List<dynamic> jsonData = jsonDecode(content);

  return jsonData.cast<Map<String, Object?>>();
}

Map<String, Object?>? findById(List<Map<String, Object?>> list, int id) {
  for (final item in list) {
    if (item["id"] == id) return item;
  }
  return null;
}

void _sendJson(HttpRequest request, Object data, {int status = 200}) {
  request.response.statusCode = status;
  request.response.headers.contentType = ContentType.json;
  request.response.write(jsonEncode(data));
  request.response.close();
}
Enter fullscreen mode Exit fullscreen mode

▶️ Correr el proyecto / levantar el servidor

dart run api.dart
Enter fullscreen mode Exit fullscreen mode

👉 Visitar:
http://localhost:9001/characters

Para probar un personaje por ID:
http://localhost:9001/characters/1


Top comments (0)