스나이퍼팩토리 플러터

스나이퍼 팩토리 플러터 1일차에서는 기본적인 프로그래밍의 내용과 데이터타입에 대해 배우고, Dartpad를 사용해 변수 선언 등의 활동을 해 보았다. 아래는 학습한 내용들의 간단한 키워드들을 작성했다.

스나이퍼팩토리 플러터 1일차 2일차 과정에서는 플러터 개발을 위한 환경 설정과 기본적인 위젯들을 배우고 사용해 보았다. 아래는 학습한 내용들의 키워드이다.

3일차 과정에서는 본격적으로 위젯을 사용하여 레이아웃 구성을 시작했다. 가장 중요한 Column과 Row 위젯을 기본으로 사용하여 여러 UI를 만들 수 있다.

아래와 같이 5명의 연락처가 저장된 연락처 앱 UI를 작성이미지는 네트워크로 (CDN 방식으로) 삽입Text, ListTile, Icon, Column 등의 위젯 사용코드결과우선 ListTile 요소들이 안전 영역에 위치하도록 SafeArea 위젯을 사용했고 아래에 C

플러터를 사용해 아래와 같은 이미지의 결과가 나오게 UI를 그린다.(크게 상관은 없을 것 같긴 한데 ZEP의 PW 부분은 지움)코드결과전체 모든 요소들은 Column 위젯을 사용해 묶어 주었다.

4일차 과정에서는 좀 더 다양한 위젯을 학습했다. 주로 스크롤과 관련된 위젯들이다.학습한 내용다양한 원형 이미지 생성법 ListView 위젯SingleChildScrollView 위젯PageView 위젯로렘 입숨(Lorem Ipsum)

5일차 과정에서는 머티리얼 디자인에 대한 내용들을 다뤘고, 이와 관련된 위젯들을 학습했다.학습한 내용Material 디자인MaterialApp 위젯과 Scaffold 위젯AppBar 위젯BottomNavigationBar 위젯FloatingActionButton 위젯

6일차에서는 Custom Widget을 학습하고 실제로 존재하는 앱의 UI를 구현해 보았다.학습한 내용Custom 위젯스타벅스 앱 화면 따라 만들기플러터에서는 직접 Custom Widget을 생성하여 사용할 수 있다. 이러한 Custom Widget은 반복되는 코드를

스나이퍼팩토리 플러터 7일차 6일차와 마찬가지로 현재 서비스 중인 앱 중 하나의 UI를 구현해 보았다. > 학습한 내용 유튜브뮤직 앱 화면 따라 만들기

스나이퍼팩토리 플러터 8일차 8일차에는 Button 위젯들을 학습했고, 상태와 관련된 Stateless Widget, Stateful Widget에 대해 알아보았다. 이와 관련된 라이프 사이클도 찾아보았다.

음식을 누르면 주문 리스트에 담기는 키오스크앱을 만들어봅니다.음식이미지는 자유입니다.하단에 떠있는 버튼을 누르면 지금까지 주문된 주문 리스트를 초기화합니다.하단에 떠있는 버튼은 정중앙의 하단, 넓게 펴진 형태로 초기화하기 텍스트를 포함합니다.

플러터를 사용해 아래와 같은 이미지의 결과가 나오게 UI를 그린다.이미지, 텍스트, 아이콘 등의 내용은 임의로 변경하여 사용했다.코드결과같은 UI를 제작하는 것을 목표로 하여 없는 아이콘과 이미지는 임의로 비슷한 것으로 대체하였다.

9일차에는 페이지 간 이동, 컨트롤러 등 위젯들을 좀 더 다루는 내용을 학습했다.학습한 내용ControllerNavigatorRoute는 하나의 화면(페이지)이다.

스나이퍼팩토리 플러터 10일차 10일차는 조건문을 통해 원하는 상황에 맞는 위젯을 보여줄 수 있는 방법을 학습했다. > 학습한 내용 dart if문 Flutter에서 위젯에 조건문 사용방법 삼항 연산자 Checkbox와 Visibility 위젯

스나이퍼팩토리 플러터 11일차 어제는 조건문을 학습했는데, 오늘은 반복문을 학습했다. 그리고 List에서 사용할 수 있는 여러 멤버함수들과 사용 방식을 알아보았고, 위젯도 반복문을 사용해 코드를 간결하게 하는 방법을 살펴보았다.

12일차에서는 앞서 만들었던 앱 중 두 가지 앱을 업그레이드 할 것이다. 두 가지 앱을 각각 다른 블로깅으로 작성해서 part1과 part2로 나누었다. part1에서는 2주차 주간평가로 진행했던 키오스크 앱을 업그레이드 할 것이다.

part1에 이어서 part2에서도 기존에 만들었던 앱을 업그레이드 할 것이다. part2에서는 1주차 주간평가로 진행했던 연락처 앱을 업그레이드 할 것이다.\[Flutter] 스나이퍼팩토리 1주차 주간평가 : 연락처 앱 기반 작성

13일차에서는 Map 데이터타입을 학습하고 이와 관련된 코드를 작성해 보았다.학습한 내용Map단어 앱 제작12일차 마지막에 나왔던 내용인데 지금 정리해보고자 한다.앱을 사용할 때 리스트 스크롤에서 마지막 부분에 가면 자동으로 이전 과거 내용이 이어지는 스크롤이 있다.

주어진 데이터를 활용하여 퀴즈앱을 만듭니다. 앱 배경색은 다음의 색상들을 Gradient로 표시합니다.Colors.pinkAccentColors.blue퀴즈 위젯은 퀴즈 데이터 수 만큼 생성되며, 데이터에 퀴즈 데이터를 추가할 때 추가된 퀴즈도 위젯으로 되어 보여집니다

스나이퍼팩토리 플러터 14일차 14일차에서는 다른 사람의 코드를 가져다 쓸 수 있는 패키지들에 대해 학습했다. > 학습한 내용 3주차 주간 평가 퀴즈앱 만들기 학습 pub.dev 패키지 추가 내용 정리 Linting 린트(Lint) 또는 린터(Linter)는 소스

15일차에는 정말 중요햔 http 통신과 비동기 처리에 대해 학습했다.학습한 내용HTTP 통신http 패키지와 dio 패키지동기와 비동기Future, async, awaithttp 패키지와 dio 패키지는 모두 HTTP 통신을 지원하는 패키지이다. 아래 링크를 통해 각

15일차에서 FutureBuilder를 사용해 봤지만 16일차에서 자세한 내용을 학습했고, NullSafety와 예외처리를 학습했다.학습한 내용Null Safety예외 처리 (try-catch)FutureBuilderNull Safety에 대해서는 \[Flutter]

스나이퍼팩토리 플러터 17일차 17일차는 image_picker 패키지를 사용하여 앱을 만들어 보았다. > 학습한 내용 - Permission - image_picker - 포토네컷 제작하기 ### 추가 내용 정리 #### Permission

18일차에서는 스나이퍼 팩토리의 비밀듣는 고양이라는 백엔드 서버를 사용하여 비밀듣는 고양이 앱을 제작했다.학습한 내용비밀듣는 고양이 앱 제작비밀듣는 고양이 앱 제작Assignment제공되는 패키지 secrets_cat_sdk를 활용하여 다음의 기대 결과물을 따라 만드세

주어진 패키지를 활용하여 비밀공유 앱을 제작합니다.구현이 되어야 하는 기능은 다음과 같습니다.BottomSheetDrawerFAB밑으로 당겨서 새로고침 기능비밀 수 만큼 생성되는 커스텀 위젯(SecretCard) 생성이 때 사용된 의존성 패키지는 다음과 같습니다.커스텀

16일차 과제로 진행했던 강아지 사진 앱을 업그레이드 하고자 한다.16일차 과제 링크\[Flutter] 스나이퍼팩토리 16일차아래와 같은 6개의 기능을 추가하고자 한다.AppBar title을 누르면 GridView의 스크롤이 최상단으로 이동합니다. \- (단 애니메

19일차에서는 지금까지 사용하지 않았던 유용한 위젯과 패키지들에 대해 학습했다.학습한 내용Widget \- Stack \- Divider \- AnimatedOpacity \- AnimatedContainer \- AspectRatio

20일차에서는 로컬에 데이터를 저장하는 방법을 학습하고 이를 사용해 기존에 제작했던 키오스크 앱을 업그레이드 했다.학습한 내용shared_preferences키오스크 앱 업그레이드오늘은 패키지가 하나라서 링크 이외에 사용법도 간단히 정리하고자한다.shared_prefe

22일차에서는 클래스를 학습했고 이를 이용해 모델을 생성해 보았다.(21일차는 월말 평가로 포스팅이 없습니다.)학습한 내용Class (클래스)멤버 변수, 멤버 함수constructor (생성자)Getter와 Setter클래스는 하나의 객체를 생성할 수 있는 것으로 생성

23일차에서는 클래스의 연장으로 데이터를 매핑하는 방법과 부모 클래스의 메소드를 재정의하는 방법을 학습했다.학습한 내용데이터 매핑 (fromMap, toMap)메소드 재정의 (overrride)hashCodefromMap은 Map 데이터 구조를 초기화하는 생성자 메소드

Nature웹 클론클래스 연습Nature 웹 사이트의 휴대폰 화면을 클론하여 앱으로 제작하고자한다. 어떻게 클래스를 제작할 것인지 고민하고, 플러터로 구현해보자7개 이상의 News Article을 포함하시오.이 때 사용되는 뉴스 제목을 포함한 모든 데이터는 아래와 같다

네이버 이메일 화면을 클론 코딩해보자. 디자인은 약간 달라도 괜찮지만 명시된 기능은 구현을 해야한다.아래의 URL에서 데이터를 받아와서 사용한다.

24일차에는 데이터를 직렬화하는 Serialization에 대해 학습했다. 이번주는 클래스를 활용해 데이터를 처리하는 방식에 대해 학습할 예정이다.학습한 내용데이터 직렬화 (Serialization)Public API, Private APIfactory 생성자데이터 직

25일차에서는 데이터 Serialization을 연습하기 위해 두 가지 앱을 만들 것이다. 두 가지 앱을 각각 다른 포스팅으로 작성해서 part1과 part2로 나누었다. part1에서는 블로그 앱을 만들었다.학습한 내용part1: 블로그 앱 만들기part2: Todo

25일차에서는 데이터 Serialization을 연습하기 위해 두 가지 앱을 만들 것이다. 두 가지 앱을 각각 다른 포스팅으로 작성해서 part1과 part2로 나누었다. part2에서는 Todo 앱을 만들었다.학습한 내용part1: 블로그 앱 만들기part2: Tod

27일차에서는 Map 데이터 안에 또 Map이 있는 구조의 데이터를 Serialization 하는 방법에 대해 학습했다.(26일차는 3.1절로 포스팅이 없습니다.)학습한 내용프로필 앱 만들기일반적으로 다른 언어들에서는 인터페이스를 정의하기 위해 interface와 같은

28일차에서도 데이터 Serialization을 연습한다. 직렬화를 사용하여 딕셔너리 앱을 만들었다.학습한 내용딕셔너리 앱 만들기Mixin 이란 Dart의 공식 문서에 "여러 클래스 계층에서 클래스 코드를 재사용하는 방법입니다."라고 설명되어 있다.또한 extends를

자체 기획앱 제작추가 내용 정리공개된 API리스트 중 하나를 선택하여 직접 분석하고, 기획한 앱을 제작하고자 한다. 아래는 공개된 API의 리스트를 공유하는 Github 문서이다.

29일차에서는 상태관리기법과 GetX의 기본적인 사용 방법에 대해 학습했다.학습한 내용상태관리기법GetX Get.to(), Get.snackBar(), Get.width, Get.heightGetxController앱의 규모가 커지면 위젯안에 위젯이 많이 생기기 때문에

30일차에서는 29일차에 이어 GetX를 학습했다. GetX에서 데이터를 Observerble 하게 만들고, 이를 관찰하여 즉시 화면에 적용하도록 하는 방법을 학습했다.학습한 내용GetX - Rx, ObxGetX - init, ever,onceGetX에는 Observe

스나이퍼팩토리 플러터 31일차 31일차에서는 여러 키워드들과 새로운 페이지 이동 방법에 대해 학습했다. > 학습한 내용 const, final static, getter, setter GetX Pages - Get.toNamed

32일차에는 페이지 별로 컨트롤러를 생성하고, 바인딩하여 사용하는 방식을 학습했다. 이는 디자인패턴 중 MVC에 해당하며, 이를 사용해 로그인 기능을 포함한 앱을 제작해 보았다.학습한 내용페이지 별로 Controller 생성BindingMVC 패턴GetX AuthCon

33일차에서는 지금까지 배운 내용을 적용해 비밀듣는 고양이 앱을 MVC 패턴으로 만들어 보았다.학습한 내용비밀듣는 고양이 앱 제작(최종)앱을 생성할 때 모든 컨트롤러를 등록하고 사용할 필요는 없다. 해당 컨트롤러가 사용될 때 등록을 하고 사용하면 되는데 이를 Get.l

비밀듣는 고양이 로그인 정보 저장 기능 구현비밀듣는 고양이 비밀 업로드 시 내 이름 공개하기 기능 추가Singleton 디자인 패턴비밀듣는 고양이의 Dio를 Singleton으로 생성7주차 주간 평가에서는 Flutter 스나이퍼팩토리 33일차에서 만든 비밀듣는 고양이

34일차에는 Flutter에 Firebase를 연동하여 사용해 보았다. 학습한 내용BaaSFirebasecloud_firestore CRUDBaaS는 Backend as a Service의 약자로 백엔드 서비스를 대신 해주는 것을 의미한다.데이터를 안전한 하이브리드

35일차에는 Firebase에서 Authentication을 사용해 보았다.학습한 내용firebase_authauth의 uid를 사용해 추가 유저 정보 담기앱을 만들 때 사용자의 신원 정보를 사용하면 데이터를 클라우드에 안전하게 저장할 수 있다.

36일차에서는 이미지와 비디오 등의파일을 저장할 수 있는 firebase_storage를 학습했고, 유저 프로필 사진을 등록하는 법을 배웠다. 추가로 예전에 만들었던 앱을 리팩토링 했다.학습한 내용firebase_storage유저 프로필 사진 등록리팩토링

37일차부터 개인 다이어리 앱 제작에 들어간다. 이번 포스팅에서는 설계 단계를 진행한다.시장 조사문서화UI/UX 디자인서비스를 기획하기 위해서는 설계 단계를 거쳐야 한다. 우선 시장 조사를 통해 제작할 서비스를 파악해야 한다.개인 다이어리앱 제작을 위해 아래와 같은 고

38일차에는 Git과 Github에 대해 학습했고, 본격적으로 앱 개발을 시작한다.Git과 GithubVScode의 Source Control진행 사항Git은 파일의 히스토리를 관리해주는 시스템이고, Github은 클라우드 기반의 Git저장소 호스팅 서비스이다.간단하게

39일차에는 Android와 ios에서 앱을 출시하는 방법에 대해 학습했고, 전체적인 앱 개발을 마쳤다.앱 출시 방법스플래시 화면진행 사항진행 예정 사항flutter의 앱을 모두 만든 뒤 앱을 출시하는 방법은 Android와 ios가 다르다. 가장 좋은 방법은 플러터

40일차에서는 Flutter 웹 출시를 학습했고, 다이어리 앱의 코드를 수정했다. 또한 ppt를 제작하고, Readme를 작성했다.웹 출시 방법진행 사항플러터에서 flutter build web 명령어를 사용하면 dart2js를 통해 main.dart.js가 만들어 진