일반적인 수준의 사람들

다트 외에 다른 객체 지향 언어를 다루어서, 어느 정도 언어에 대한 지식이 있는 사람들. 즉, 변수, 연산자, 함수 등 언어의 기본적인 개념에 대한 지식이 있는 사람들을 뜻합니다.

자신이 재귀함수를 사용해서 피보나치 수열을 구할 수 있다. 하시는 분은 아래 커리큘럼을 따라주시면 감사하겠습니다.

먼저 1주차, 2주차에 다트 언어에 대해서 다루고, 3주차부터 6주차까지 플러터와 플러터 자체적으로 지원해주는 상태 관리 방법에 대해서 다룹니다. 또, 7주차는 외부 라이브러리를 사용하는 방법에 대해서 다룹니다.

다트 언어를 사용할 때에는 https://dartpad.dev/ 를 사용하고, 플러터를 본격적으로 들어갈 때 부터는 자신의 컴퓨터에 플러터 개발 환경을 구축해야 합니다.

1주차

1. 데이터 타입
2. 변수와 연산자
3. 반복문 및 조건문
4. 배열(리스트)와 맵
5. 함수와 클래스, 클래스의 상속

2주차

1. 인터페이스 (abstract class)
2. 확장 (Extension)
3. 제너릭
4. 콜백 및 고차함수

3주차

1. 플러터 개발환경 구축
   • 참고: https://docs.flutter.dev/get-started/install
2. 시작 프로젝트 뜯어보기
3. 위젯이란?

4주차

1. 자주 쓰는 위젯 알아보기
   • SafeArea, Scaffold, Container, ListView, Padding, TextButton, Text, TextField, Column, Row, Image, Icon, IconButton, CircularProgressIndicator, SizedBox, Stack, AppBar, ButtomNavigationBar, Divider, PageView, ListTile
2. 자주 쓰지는 않지만 알아야 하는 위젯 알아보기
   • MaterialApp, SingleChildScrollView, AspectRatio

→ 참고: https://www.youtube.com/playlist?list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG

5주차

1. 페이지 간 이동 방법, 다른 페이지 만드는 방법 알아보기 (Navigator)
2. 페이지 간에 데이터 넘겨주는 방법 알아보기
3. 외부의 리소스 가져오는 방법 알아보기 (보통 이미지나 글꼴, pubspec.yaml의 assets에 등록.)
4. 간단한 영화(나 그 외 어떤 것이든) 정보 조회 앱 만들어보기.
   • 데이터는 모두 더미로 생성
   • 첫 페이지에서는 여러 영화의 이미지, 제목, 설명 등을 간단하게 보여주는 리스트.
   • 해당 영화를 클릭하면 영화의 세부정보 (이미지, 제목, 설명 외에도 개봉, 감독, 배우, 총 길이 등)

6주차

1. 플러터의 상태란? (StatelessWidget vs StatefulWidget)
2. 플러터에서는 어떻게 상태 관리를 하는가 (setState())
3. 간단한 카운터 앱 만들기
   • 중간에 크게 숫자가 나오고, 그 아래에 - 버튼과 + 버튼이 있음.
   • 숫자의 초기값은 0이며, 해당 값은 $0\le N\le 100$의 값을 가질 수 있음.
   • 해당 값을 넘어가게 하는 명령은 무시.
   • • 버튼을 누르면 숫자 범위를 벗어나지 않는 선 안에서 1 감소.
   • • 버튼을 누르면 숫자 범위를 벗어나지 않는 선 안에서 1 증가.
   • 버튼을 눌렀을 때, 숫자의 변화는 화면에 반영되어야 함.

7주차

1. 외부 라이브러리를 현재 프로젝트에 등록하는 방법 알아보기
2. 외부 라이브러리의 공식 문서를 읽고, 라이브러리 사용하는 방법 알아보기
3. 비동기가 무엇인지 알아보기 (Future)
4. shared_preference
   • 로컬에 데이터를 저장하는 라이브러리
5. http
   • HTTP 요청을 보낼 수 있게 해주는 라이브러리
   • 응답을 받아서, 이를 쉽고 정확하게 사용할 수 있도록 가공하는 방법 알아보기 (객체 등으로 파싱)
     • 이 과정을 거치지 않으면, 해당 응답 JSON이나 XML에 들어있는 값의 타입을 확실히 알지 못하기 때문에, 이것이 비지니스 로직에 섞이게 되면 예상치 못한 에러를 발생시킬 수 있습니다.
6. 플러터에서 어떻게 비동기를 처리할지 알아보기.
   • 위의 가장 흔한 경우는, 서버에서 데이터를 받아와야 화면을 보여줄 수 있는 상황입니다.
   • 인스타그램을 생각해보면, 우리가 앱에 접속했을 때 그 수많은 이미지와 텍스트가 모두 로딩이 되어야 화면이 정상적으로 보여질 수 있을 것입니다. 따라서, 당장 유저에게 보일 화면에 필요한 모든 데이터를 불러오기 전까지 보여줄 화면을 어떻게 구성할지, 또 데이터를 불러왔을 때 어떻게 데이터를 레이아웃에 맞게, 효율적으로 보여줄지를 고민해보아야 합니다.
   • 일반적으로는 setState와 Future#then을 섞어서 많이 사용합니다.

8주차

1. 배운걸 종합해서 프로젝트 하나 하기!

심화일거에요?

사실 심화 하시는 분이 생길거라고 생각은 못 하고 있었어서, 잠시 기억에서 사라져 있었는데 벌써 저 8주차 분량을 끝내셨다니 멋집니다. 👍

위의 내용은 모두 인지하고 계시다 가정하고 커리큘럼을 진행할 예정입니다. 위의 커리큘럼은 어느 정도 플러터 맛보기의 경향이 강했다면, 아래의 내용은 좀 더 플러터라는 프레임워크를 더 깊이 이해하는 것이 주 목적입니다.

따라서 어느 정도 이론을 다룰 예정입니다. 또, 디테일한 배움을 위해 영어 자료가 상당량 들어갈 예정입니다.

사실 아래 내용은 상당히 난이도가 있는 주제들로 선정하였고, 이걸 한 번에 이해하신다면 정말.. 천상 개발자이신 겁니다. 이걸 모두 이해하고 개발하실 수 있다면 플러터로 취업도 가능하지 않을까요.

아무튼, 상태 관리를 끝장내겠다는 마음으로 주제를 선정하고 자료를 모았으니, 아직은 이해가 조금 어렵다라도 정상입니다. 이해는 무슨 맛만 보셔도 정말 대단하신거라 생각해요. (사실 이 쯤되면 주차는 크게 상관이 없을지도 모르겠습니다.)

이번에도 화이팅!

1주차

1. BuildContext

   아마 플러터로 개발을 하시다보면 새로운 위젯을 만들때마다 BuildContext라는 클래스를 정말 많이 봤을텐데요. 어떤 함수/메서드/위젯에서는 이 클래스의 객체가 필요하다고는 하니 넣어주긴 했는데, 그래서 이게 대체 무슨 역할을 하는지는 모르실 거라 생각해요. 그래서 대체 뭐하는 건지, 어디에 쓸 건지는 살펴보고 넘어가는 게 좋을 거라 생각해서 넣어보았습니다.

   BuildContext?! | Decoding Flutter

   자막 퀄리티가 그렇게 좋지는 않을 거 같아서, 영어 자막으로 보시는 걸 추천드립니다.

   Synchronous BuildContexts | Decoding Flutter

   비동기 함수/메서드 내에서 BuildContext를 사용하는 것이 위험하며, 그렇다면 어떻게 해야할지를 제시합니다.

2. Key

3. 세 개의 트리

2주차

여기서부터는 상태 관리 라이브러리에 대해서 주로 다룰겁니다. 사실 플러터 외에도 유저에게 닿는 앱/웹을 만들 때는 상태 관리가 거의 제일 높은 난이도를 갖고 있기 때문에, 이에 관련된 라이브러리/패키지/패턴도 많이 나옵니다.

그 중 대표적인 몇 가지를 살펴볼 건데요. 먼저 첫번째로 가장 대표적이라고 할 수 있는 BLoC 패턴입니다.

• 카운터 앱을 BLoC 패턴으로 구현하는 글
• 좀 더 깊게 들어가는 글