CommunityProgramación y desarrollogithub.com

flutter/flutter-handling-http-and-json

Ejecuta solicitudes HTTP y maneja la serialización JSON en una aplicación Flutter. Útil al integrar con APIs REST o analizar datos estructurados de fuentes externas.

¿Qué es flutter-handling-http-and-json?

Esta habilidad proporciona un conjunto de funciones y patrones para manejar solicitudes HTTP y serialización/deserialización JSON en aplicaciones Flutter. Es útil para desarrolladores que necesitan integrar sus aplicaciones con servicios web RESTful, consumir datos de APIs externas o enviar datos estructurados a un servidor. La habilidad se basa en el paquete `http` de Flutter y la biblioteca `dart:convert` para JSON, ofreciendo ejemplos prácticos de cómo realizar solicitudes GET, POST, PUT y DELETE, así como cómo convertir modelos Dart a JSON y viceversa. Está diseñada para ser utilizada con editores de código y asistentes de IA que soportan el formato de habilidades de Flutter, como IDEs basados en código o agentes de desarrollo. Al seguir los patrones definidos, los desarrolladores pueden asegurar un manejo consistente de errores, deserialización segura de tipos y una integración limpia con el ecosistema de Flutter.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/flutter/skills/tree/main/skills/flutter-handling-http-and-json

Installed? Explore more Programación y desarrollo skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace flutter-handling-http-and-json?

Ejecuta solicitudes HTTP y maneja la serialización JSON en una aplicación Flutter. Útil al integrar con APIs REST o analizar datos estructurados de fuentes externas.

Descripción

Esta habilidad proporciona funciones auxiliares para realizar solicitudes HTTP (GET, POST, PUT, DELETE) y convertir datos JSON a objetos Dart y viceversa. Incluye manejo de errores, encabezados personalizados y ejemplos de modelos de datos.

Instalación

Agrega la dependencia http a tu archivo pubspec.yaml:

dependencies:
  http: ^1.2.1

Uso

Realizar una solicitud GET

import 'package:http/http.dart' as http;
import 'dart:convert';

Future<Map<String, dynamic>> fetchData(String url) async {
  final response = await http.get(Uri.parse(url));

  if (response.statusCode == 200) {
    return jsonDecode(response.body);
  } else {
    throw Exception('Failed to load data: ${response.statusCode}');
  }
}

Publicar datos JSON (POST)

Future<http.Response> postData(String url, Map<String, dynamic> data) async {
  final response = await http.post(
    Uri.parse(url),
    headers: {
      'Content-Type': 'application/json',
    },
    body: jsonEncode(data),
  );
  return response;
}

Serialización de modelos

class User {
  final int id;
  final String name;
  final String email;

  User({required this.id, required this.name, required this.email});

  factory User.fromJson(Map<String, dynamic> json) {
    return User(
      id: json['id'],
      name: json['name'],
      email: json['email'],
    );
  }

  Map<String, dynamic> toJson() => {
    'id': id,
    'name': name,
    'email': email,
  };
}

// Ejemplo de uso
void main() async {
  final data = await fetchData('https://api.example.com/users/1');
  final user = User.fromJson(data);
  print('Usuario: ${user.name}');
}

Manejo de Errores

Siempre verifica el código de estado de la respuesta HTTP. Usa bloques try-catch para manejar excepciones de red:

try {
  final data = await fetchData('https://api.example.com/data');
} catch (e) {
  print('Error: $e');
}

Enlaces Relacionados

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

flutter/flutter-accessibility

Configure your Flutter app to support assistive technologies like Screen Readers

flutter/flutter-accessibility-audit

Triggers an accessibility scan through the widget_inspector and automatically adds Semantics widgets or missing labels to the source code.

flutter/flutter-adding-home-screen-widgets

Adds home screen widgets to a Flutter app for Android and iOS. Use when providing glanceable app information or quick actions on the device home screen.

flutter/flutter-add-integration-test

Configures Flutter Driver for app interaction and converts MCP actions into permanent integration tests. Use when adding integration testing to a project, exploring UI components via MCP, or automating user flows with the integration_test package.

flutter/flutter-add-widget-preview

Adds interactive widget previews to the project using the previews.dart system. Use when creating new UI components or updating existing screens to ensure consistent design and interactive testing.

flutter/flutter-add-widget-test

Implement a component-level test using `WidgetTester` to verify UI rendering and user interactions (tapping, scrolling, entering text). Use when validating that a specific widget displays correct data and responds to events as expected.

flutter/flutter-animating-apps

Implements animated effects, transitions, and motion in a Flutter app. Use when adding visual feedback, shared element transitions, or physics-based animations.

flutter/flutter-animation

Add animated effects to your Flutter app

flutter/flutter-apply-architecture-best-practices

Architects a Flutter application using the recommended layered approach (UI, Logic, Data). Use when structuring a new project or refactoring for scalability.

flutter/flutter-app-size

Measure and reduce the size of the Flutter app bundle, APK, or IPA

flutter/flutter-architecting-apps

Architects a Flutter application using the recommended layered approach (UI, Logic, Data). Use when structuring a new project or refactoring for scalability.

flutter/flutter-architecture

Use the Flutter team's recommended app architecture

flutter/flutter-building-forms

Builds Flutter forms with validation and user input handling. Use when creating login screens, data entry forms, or any multi-field user input.

flutter/flutter-building-layouts

Builds Flutter layouts using the constraint system and layout widgets. Use when creating or refining the UI structure of a Flutter application.

flutter/flutter-building-plugins

Builds Flutter plugins that provide native interop for other apps to use. Use when creating reusable packages that bridge Flutter with platform-specific functionality.

flutter/flutter-build-responsive-layout

Use `LayoutBuilder`, `MediaQuery`, or `Expanded/Flexible` to create a layout that adapts to different screen sizes. Use when you need the UI to look good on both mobile and tablet/desktop form factors.

flutter/flutter-caching

Cache data in a Flutter app

flutter/flutter-caching-data

Implements caching strategies for Flutter apps to improve performance and offline support. Use when retaining app data locally to reduce network requests or speed up startup.

flutter/flutter-concurrency

Execute long-running tasks in a background thread in Flutter

flutter/flutter-databases

Work with databases in a Flutter app

Skills relacionados