앱 개발-flutter
1.[MVVM Flutter-app 제작] #0 MVVM 소개와 안드로이드 스튜디오 플러터 초기 세팅
해당 강의는 유데미 "Learn Flutter MVVM Architecture" 강의를 보고 제작하였습니다.MVVM 패턴은 MVC 패턴에서 Controller 를 빼고, Viewmodel 을 추가한 패턴이다.MVVM 패턴에서는 <mark style="backgro
2.[MVVM Flutter-app 제작] #01 Assets 추가하기, HardCoding 의미 / Splash Screen, Scaffold 의미와 활용
해당 게시글은 유데미 Learn Flutter MVVM Architecture 강의를 듣고 제작하였습니다.하나의 어플에는 많은 이미지들이 사용된다.예시로 배달의민족 화면을 보면 여러 그림과 아이콘들이 사용된 것을 확인할 수 있다. 이러한 이미지들을 관리하기 위해서 a
3.[MVVM Flutter-app 제작] #02 Screen 에 색상 넣기
해당 게시글은 유데미 Learn Flutter MVVM Architecture 강의를 보고 작성하였습니다. 이전에 스플래시스크린을 띄우는 실습을 진행하였다. 아래 화면이 너무 심심해서 그라데이션으로 배경을 넣어주려고 한다. 아래 파일 구조에서 리소스들을 정의했던 re
4.[MVVM Flutter-app 제작] #03 포스트맨 Postman이 무엇인가? / AppURL 정의 및 Model 생성 (Weather API Implementation)
강의를 듣다가 Postman을 사용하는 부분이 있어 이에 대해 정리하고자 쓴 글이다. Postman은 API 개발 및 테스트를 위한 협업 도구이다. 아래 사이트에서 이용할 수 있다. 가입을 하고 앱을 다운해놓으면 유용하게 사용할 수 있다. https://www
5.[MVVM Flutter-app 제작] #04 날짜 데이터 포맷용 헬퍼 함수 정의 (Weather API Implementation)
Model 폴더는 데이터를 관리하기 위한 폴더로 date_model.dart 에는 날씨 API 외부 시스템과 상호 작용하는 코드가 담겨있다.View 폴더는 사용자에게 보이는 화면을 위한 폴더로 splash_screen.dart 에는 스플래시 스크린 화면에 대한 코드가
6.[MVVM Flutter-app 제작] 기본 위젯 4가지 공부
플러터의 기본 위젯에는 글자위젯, 이미지위젯, 아이콘위젯, 박스위젯 기본 4가지 위젯이 있다. Text('텍스트') 과 같은 형태로 추가 가능하다. Icon(Icons.아이콘이름) 과 같은 형태로 추가 가능하다. 아이콘의 이름은 플러터 홈페이지에서 찾을 수 있다.Ima
7.[MVVM Flutter-app 제작] #05 데이터 레이어 에러 처리 코드 구현 (Weather API Implementation)
해당 게시글은 유데미 'Learn Flutter MVVM Architecture | Build Weather App' 강의를 보고 작성하였습니다. MVVM 구조에서 Data 폴더는 애플리케이션의 데이터 레이어를 담당한다. 이 폴더의 주요 역할은 다음과 같다.데이터 소
8.[MVVM Flutter-app 제작] #06 비동기 프로그래밍으로 json 데이터 불러오기 (Network layer) / Future, Async/Await
해당 게시글은 Udemy 'Learn Flutter MVVM Architecture | Build Weather App' 강의와 dart 공식 문서를 참고하였습니다.https://dart-ko.dev/codelabs/async-await다트 언어에서는 프로그램
9.[MVVM Flutter-app 제작] #07 Home Controller (View Model) 구현하기 / GetX 라이브러리
우선 현재까지의 오늘 실습 까지 완료 후 폴더를 보면 아래 사진과 같다. 지난 시간에는 View 폴더 내에는 스플래시 스크린 파일을 생성하고, Utilities 폴더에는 날씨(이름)와 이미지 매핑을 위한 imageMap 과 날짜 및 시간 스트링 포맷을 위한 헬퍼함수 작
10.[MVVM Flutter-app 제작] #08 DaysController(View Model) 구현하기 / GetX 라이브러리
지난 시간에는 HomeController 를 구현했었다. HomeController 는 전반적인 앱 데이터 관리, API 통신, 다양한 상태관리, 유틸리티 기능들을 담당하는 클래스였다. 오늘은 DayController 를 구현할 것이다. 이는 특정 날짜에 초점을 맞추고
11.[앱개발-flutter] 클래스 / dart 문법
클래스
12.[앱개발-flutter] getter 와 setter / dart 문법
Dart 언어에서 클래스의 private 속성에 안전하게 접근하고, 해당 속성을 조작할 수 있는 방법을 제공합니다. 이를 위해 getter와 setter 메소드를 사용할 수 있습니다. 이들은 특별한 종류의 메소드로, 객체의 속성을 읽거나 변경할 때 사용됩니다. gett
13.[앱개발-flutter] 상속 / dart문법
상속은 객체 지향 프로그래밍의 핵심 원칙 중 하나로, 코드 재사용성을 높이고, 관리를 용이하게 하며, 다형성을 가능하게 합니다. Dart에서 상속은 클래스가 다른 클래스의 속성과 메소드를 상속받을 수 있도록 해주어, 코드의 중복을 줄이고 유지보수를 간편하게 합니다.Da
14.[앱개발-flutter] Dart에서의 컬렉션: List, Map, Set
Dart는 다양한 타입의 컬렉션을 제공하여 데이터를 효율적으로 관리할 수 있게 합니다. 이 중 가장 널리 사용되는 컬렉션 타입은 List, Map, 그리고 Set입니다. 각 컬렉션은 특정한 사용 사례에 적합하도록 설계되었습니다.List는 순서가 있는 요소의 집합으로,
15.[앱개발-flutter] 함수형 프로그래밍 / dart 문법
함수형 프로그래밍은 "함수"를 일급 객체로 취급하는 프로그래밍 패러다임 중 하나입니다. 일급 객체란 변수에 할당할 수 있고, 다른 함수의 인자로 전달하거나 반환값으로 사용할 수 있는 객체를 의미합니다. Dart는 이러한 함수형 프로그래밍의 개념을 지원하여, 함수를 변수
16.[앱 개발-flutter] Null Safety / dart 문법
Dart와 같은 현대 프로그래밍 언어는 안정성과 개발 효율성을 높이기 위해 지속적으로 업데이트되고 있습니다. 특히, 앱 개발 시 흔히 발생할 수 있는 null 에러를 방지하기 위해 Dart는 null safety 기능을 도입했습니다. 이 기능은 개발자가 더 안전하게 코
17.[Flutter-앱개발] Flutter 구글 맵 사용을 위한 초기 설정 / Google map API 사용
우선 구글맵 사용을 위해 google_maps_fultter 패키지를 사용해야합니다.아래 링크를 가서 설치를 해봅시다. https://pub.dev/packages/google_maps_flutter/install터미널에 아래 명령어를 입력하면 자동으로 pub
18.[앱개발-flutter] Google Map 사용하기2 / + Provider
구글 지도 api 를 사용하는 ChangeNotifierProvider 사용하기 지난 시간에 Provider는 상태 관리를 위한 패키지라고 했다. 오늘은 Provider 중 ChangeNotifierProvider 을 사용할 건데 이는 ChangeNotifier
19.[Flutter] 플러터 시작하기
플러터는 빠르게 성장하고 있는 프레임워크이다. 플러터의 셀링 포인트는 코드를 한번 쓰고 동시에 여러개의 플랫폼에서 실행할수 있다는 점이다. 여기서 개발자가 두 개의 분리된 에코시스템을 배우고 동작시킬 필요를 제거하였다. 과거 어플 개발에서는 Android, iOS 각각
20.[Flutter] 플러터 유저 인터페이스 만들기 팁들
플러터에서 가장 베이직한 레이아웃은 Conatiner 위젯이다. 이 위젯은 박스를 제공하는데 이건 다른 위젯들을 포함할 수 있다. 컨테이너 위젯은 너비, 높이, 패딩, 데코레이션, 정렬과 같은 속성들을 정의한다.부모 위젯내에서 위젯 여러개를 수직으로 혹은 수평으로 정렬
21.[flutter] Data 와 서비스 다루기
이 장에서는 Flutter에서 데이터 및 서비스를 다루는 방법에 대해 배워볼 것이다. 지금까지는 정적인 사용자 인터페이스 구축에 집중해 왔지만, 실제 앱은 데이터를 동적으로 표시하고 업데이트할 수 있는 기능이 필요하다. Flutter는 비동기 프로그래밍, 네트워킹, 상
22.[Flutter] Navigation 과 User Flows
이번에는 화면 간의 원활한 네비게이션을 가능하게 하고 Flutter 앱에서 사용자 플로우를 생성하는 방법을 탐색해 볼 것이다. Flutter는 개발자들이 복잡한 다중 화면 경험을 쉽게 구축할 수 있도록 유연한 라우팅 시스템을 제공하고 있다.Flutter의 네비게이션 시
23.[flutter-basic] Grid view 만들기
플러터를 한다고는 하지만, 잦은 chatGPT 의 사용으로 기본을 모르고 막 개발을 하는 것 같아서 basic 한 View 들을 만드면서 기본적인 위젯 및 함수들을 공부하려고 한다.오늘 배울 것은 Grid View 이다.우선 전체 코드는 다음과 같다. 설명은 코드 아래
24.[flutter-basic] custom font 추가하기
참고 사이트 : https://docs.flutter.dev/cookbook/design/fontsCustom 폰트 추가를 위해 우선 원하는 폰트를 다운한다. ttf 파일이 다운되어 있다고 가정하고 코드를 짤 것이다.fonts 폴더를 생성하여 해당 폴더 내부에
25.[flutter-basic] Tab-bar
오늘은 탭 바를 만들어서 탭 별로 각 탭을 누르면 다른 화면이 보이게 하려고 한다. 우선 코드부터 보자main 함수에서 runApp(MaterialApp()) 으로 루트위젯을 MaterialApp 으로 설정ㅎ나다. home 속성에는 앱이 실행될 때 보여질 첫 화면의 위
26.[flutter-basic] TextField 구현 / dispose, TextEditingController
오늘은 TextField 에 사용자가 text 를 입력하고 버튼을 누르면 해당 텍스트의 내용으로 dialog 를 띄우는 스크린 구현을 해볼 것이다. 지난 시간까지는 Stateless 로 구현을 했었는데 이번엔 Stateful 로 구현을 할 것이다.( 텍스트 입력하면 그
27.[Flutter] 디자인 패턴 -MVVM 정리
MVVM MVC -> MVP -> MVVM 으로 발전해나감 MVC 는 모델이 있고 컨트롤러가 받아서 view 에서 참조한다. 모델은 entity 라고 생각하기. 모델을 View 에서 참조. 모델의 변화는 있을 수 있다. 그러면 모델 하나 수정하면 View 에서 해당
28.[Flutter] DI / get_it 정리하기
안드로이드에서는 보통 Dagger를 통해 의존성을 주입한다. Flutter 에서는 어떤 방식을 사용할까? 물론 외부라이브러리를 쓰지 않고, 직접 ViewModel 클래스안에서 fianl 로 Repository 를 선언하고 생성자에서 이를 받는 방식으로 Repositor
29.[Flutter] 키워드 정리
Flutter 프로젝트를 만들다가 키워드에 혼동이 와서 정리 겸 작성한 게시글이다.다음의 블로그를 참고하였다.https://www.funwithflutter.dev/flutter-dart-when-to-use-var-final-const-static/우선 간단