Colin's Blog
[flutter] 플러터 프로바이더를 사용하여 음식점 정보 가져오기

이번에는 플러터 앱에서 프로바이더를 사용하여 음식점 정보를 가져오는 방법에 대해 알아보겠습니다.

프로바이더 설정

먼저, pubspec.yaml 파일에 provider 패키지를 추가합니다.

dependencies:
  flutter:
    sdk: flutter
  provider: ^5.0.3

그런 다음 터미널에서 flutter pub get 명령을 사용하여 패키지를 설치합니다.

프로바이더 모델 만들기

음식점 정보를 담는 모델을 만들어봅시다. Provider 패키지를 사용하여 음식점 정보를 제공하는 프로바이더를 만들 것입니다.

import 'package:flutter/foundation.dart';

class Restaurant {
  final String name;
  final String cuisine;

  Restaurant({
    required this.name,
    required this.cuisine,
  });
}

프로바이더 클래스 만들기

이제 프로바이더 클래스를 만들어 음식점 정보를 제공합니다.

import 'package:flutter/material.dart';
import 'restaurant.dart';

class RestaurantProvider with ChangeNotifier {
  Restaurant _restaurant = Restaurant(name: '맛있는 음식점', cuisine: '한식');

  Restaurant get restaurant => _restaurant;

  void updateRestaurant(Restaurant newRestaurant) {
    _restaurant = newRestaurant;
    notifyListeners();
  }
}

메인 앱에서 프로바이더 사용하기

이제 메인 앱에서 프로바이더를 사용하여 음식점 정보를 가져올 수 있습니다.

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'restaurant_provider.dart';

void main() {
  runApp(
    ChangeNotifierProvider(
      create: (context) => RestaurantProvider(),
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('음식점 정보'),
        ),
        body: Container(
          child: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  '음식점 이름: ${context.watch<RestaurantProvider>().restaurant.name}',
                ),
                Text(
                  '음식 종류: ${context.watch<RestaurantProvider>().restaurant.cuisine}',
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

이제 앱을 실행하면 프로바이더를 사용하여 음식점 정보를 가져와 화면에 표시할 수 있습니다.

프로바이더를 사용하여 데이터를 관리하면 상태 관리가 간편해지고, 코드가 깔끔해질 뿐만 아니라, 앱의 성능도 향상될 수 있습니다.

이렇게 프로바이더를 활용하여 음식점 정보를 가져오는 방법에 대해 알아보았습니다. 플러터 앱 개발 시 유용하게 활용할 수 있을 것입니다.

참고 문헌:

© 2018 Colin. All rights reserved.