Flutter로 앱 만들 때 제일 먼저 할 것

악어·2024년 9월 10일
1

Flutter 개발

목록 보기
6/8
post-thumbnail

제목은 거창하게 썼지만,
다음에 Flutter로 앱 만들 때
안 까먹으려고 만든 초기 Check List다.
바로 가자!



1. Android Manifest

앱 이름이나 본인이 원하는 컴포넌트 등의 설정부터 확인



2. build.gradle

app단위 gradle 파일부터 체크하자.
sdk 버전이 보통 flutter 환경변수로 되어있는데,
이래저래 바꾸기 귀찮아서 그냥 직접 쓰는 경우가 많다.



3. info.plist

ios 설정이다. 일단 앱네임은 바꾸고 그 외에는
xCode로 들어가 설정을 만지는걸 추천한다.
호환시킬 iphone 버전이나 iphone외 지원할 기기,
권한 등을 정의 해야한다.



4. pubspec.yaml

4-1. flutter 버전

이제 드디어 flutter 설정 시작이다.
제일 먼저 해줄 것은 위처럼 flutter 버전을 확인하고
가능하면 최신 버전을 써주는 것이다.


4-2. 리소스 설정

먼저 assets 폴더를 만들어 리소스를 관리해준다.
사용할 폰트도 설정하고 넣어준다.
내 경우 api key등을 관리할 dot_env package를 쓰는데,
이를 사용하기 위해 .env파일도 설정에 추가해준 모습이다.


4-3. dev_dependencies

개발 편의 패키지를 설치하는 곳이다.
flutter lints는 단축키로 코드 포매팅을 도와주고,
build_runner는 freezed와 같은 패키지를 쓸 때
자동으로 코드를 작성해준다.(entity 만들때 좋다)

pub.dev에서 원하는 패키지의 install로 가보면
dev_dependencies에 추가할 패키지인지
일반 dependencies에 추가할 패키지인지 알 수 있다.


4-4. (중요) dependencies

사용할 패키지를 정의하는 곳이다.
개발 하다가 필요할때마다 추가해도 좋지만
거의 무조건 사용하게 되는 패키지들은
그냥 바로 넣어도 될 것 같다.


4-4-1. dev

개발 편의를 위한 패키지이다.
MVC, MVVM, MVI등 어떤 디자인 패턴에서도
'모델'을 정의해 관리하는건 중요하다.
이 모델관리를 편하게 해주는 게 freezed다.

dotenv의 경우 위에서 언급한 것처럼 api key 등
중요한 정보들을 환경변수로 관리하게 도와준다.


4-4-2. state management

상태관리 툴이 필요하다.
getx, riverpod, bloc정도 사용할텐데,
작은 규모 프로젝트라면 그냥 플러터가 추천하는
riverpod를 쓰는걸로 하자.


4-4-3. api

소셜로그인, 카톡으로 연결, 구글 뭐시기, 애플 뭐시기 등
항상 쓰게되는 대기업 api들이 있다.
앱 요구사항에 맞게 관련 api부터 끌어다놓자.

내 이번 프로젝트에서는 firebase로 서버를 대체하는데,
때문에 관련 패키지를 많이 끌어다 쓴다.


4-4-4. native

대표적인 네이티브 기능인 '알림', '권한', '기본앱과의 연결'을
도와주는 대표 패키지들이다.
앱 요구사항에 맞게 몇몇 패키지가 더 필요할 수 있으나
위 세가지는 거의 무조건 쓰게되는것 같다.


4-4-5. base

'앱'이라고 부를만한 서비스라면 거의
대부분 필요한 패키지이다.
다만, 빨간 점으로 표시한 패키지는
개인적으로 추천하는 정도로, 없어도 무방하다.

go_router: 앱의 화면이동,
dio: 네트워크 통신(http를 써도 된다),
hive: 로컬 데이터 저장(shared_preferences를 써도 된다),
cached_network_image: 링크로 된 이미지를 불러올 때 쓰인다.

inappwebview: 웹뷰 스크린 표시
pull_to_refresh: 아래로 당겨서 페이지 새로고침
photo_view: zoom이 가능한 이미지 뷰, 갤러리 제공
shimmer: 로딩 중 shimmer 효과 적용된 view 제공



5. 앱 아이콘 변경

미리 해두고 시작하면 좋다.
이건 여기서 자세하게 다루기보다는
잘 정리된 선배님들 포스팅을 보는게 좋아보인다.

https://zzingonglog.tistory.com/42





여기까지 설정이 끝났다면,
flutter pub get 명령어나
android studio의 우상단 pub get 버튼으로
패키지를 일괄 설치해주자.

운좋으면 한번에 설치될 것이고,
대개의 경우 버전이나 호환문제가 생길 것이다.
(이 버그를 미리 찾아내려고 처음에 많은 패키지를
한번에 추가한 것이다)

이 버그를 잡고 lib/main.dart로 가
행복 코딩을 시작하면 된다.

profile
냅다 회사부터 세워버린 개발자

0개의 댓글

관련 채용 정보