[flutter] Data 와 서비스 다루기

도톨이·2024년 4월 1일
0

앱 개발-flutter

목록 보기
21/29

이 장에서는 Flutter에서 데이터 및 서비스를 다루는 방법에 대해 배워볼 것이다. 지금까지는 정적인 사용자 인터페이스 구축에 집중해 왔지만, 실제 앱은 데이터를 동적으로 표시하고 업데이트할 수 있는 기능이 필요하다. Flutter는 비동기 프로그래밍, 네트워킹, 상태 관리를 위한 강력한 도구를 제공하여, 원격 서비스와 로컬 데이터 소스를 원활하게 통합할 수 있게 해준다.

비동기 프로그래밍

Flutter와 Dart에서 비동기 코드의 핵심은 Future와 Stream이다. Future는 HTTP 요청의 결과와 같이 어느 시점에 사용할 수 있을지도 모르는 잠재적인 값을 나타내는 반면, Stream은 시간이 지남에 따라 이벤트나 값의 비동기적인 시퀀스를 제공한다.

Networking

Flutter에서는 네트워크에서 데이터를 가져오기 위해 http 패키지를 제공한다. 이 패키지는 GET, POST, PUT, DELETE 요청을 하기 위한 간단한 API를 제공한다.

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

Futer<Album> fetchAlbum() async {
	final response = await.http.get('http://api.exmaple.com/album/1');
    
    if(response.statusCode==200){
    	return Album.fromJson(json.decode(response.body));
        ) else {
        	throw Exception('Failed to load album');
            }
            }
            

Local Data Sources

플러터는 path_provider 나 path 와 같은 패키지를 제공한다. 이건 로컬 파일로 작업하기 위한 특정 폴더에 접근토록 한다. 추가적으로 sqflite 플러그인은 SQLite 데이터베이스 인터페이스를 제공해준다. 이러한 툴들은 로컬 db 로 작업하는데 유용하다.

State Management

플러터에서 상태 변화를 다루려면 Riverpod 와 같은 provider 패키지 사용이 권장된다. 이건 Provider 패턴을 구현하는 것이다.

이러한 접근은 ChangeNotifiers 를 사용해서 데이터와 로직 유저인터페이스와 분리시킨다.

final albumProvider = StateNofitierProvider<AlbumNotifier, Album?>((ref) { return AlbumNotifier(ref.read);
});

class AlbumNotifier extends StateNotifier<Album?> {
	AlbumNotifier(this.read) : super(null);
    
    Future<void> fetchAlbum() async {
    	state = album;
        }
        }
            

이러한 기술들을 결합함으로써, 우리는 원격 서비스, 로컬 저장소, 그리고 동적 상태를 통합한 완전한 기능을 갖춘 앱을 구축할 수 있다. 그런 다음 위젯은 제공자로부터 선택하여 앨범이 변경될 때 재구성될 수 있다:

Consumer (
	builder: (context, watch, _) {
    	final album = watch(albumProvider);
        // Rebuild the widget when the album updates
        },
        );
            
profile
Computer Engineering

0개의 댓글

관련 채용 정보