# 강의 제목 : 누적다운로드 120만+ 1인 개발자와 함께하는 앱 개발 입문 Online
# 강의 목표 : 기초부터 운영까지 앱 개발의 전체 프로세스를 이해한다.
내 이름으로 된 앱을 최대 10개까지 만들어 출시할 수 있다.
앱 개발자로 성장할 수 있는 초석을 다진다.
반응 얻는 앱의 특징과 노하우를 알아간다.
향후 강의 없이도 나만의 앱을 개발할수 있는 실력을 가진다.
# 강의 요약 : 프로그램 설치부터 기본 문법, 광고 다는 법, 클론코딩을 진행하며 필수 지식을 학습한다.
총 10개의 다른 주제로 실제 사용화 가능한 수준의 앱을 만들어본다.
나의 앱을 세상에 선보이기 위한 개발자 등록 및 배포를 진행한다.
강사님의 리뷰/클레임 대응사례 등 앱 성공 포인트를 참고해 1인 개발자로서의 입지를 다진다.
# 강의 목차 : Flutter 실전 앱 제작
- 앱 기능 및 디자인 설계 및 초기 구조 만들기
- TODO 화면 만들기
- TODO 화면 만들기
- TODO 화면 만들기
- TODO 기록 화면 만들기 (내부 DB 저장, 수정, 삭제) (11일차)
- TODO 기록 화면 만들기 (이전 할일 기록 리스트, 카테고리 별 리스트)
# 강의 화면 :
# 강의 내용 : Flutter 실전 앱 제작 (TODO 기록 화면 만들기 (내부 DB 저장, 수정, 삭제))
1. 데이터베이스
- 앱 사용에 필요한 데이터를 저장하고 관리할 수 있는 기능
- 테이블 : 데이터를 저장하는 표(구조)
- Column(데이터 카테고리) 예) title, color, memo 등
- Row(데이터) 예) 책읽기, 빨강 등
2. 패키지(Packages)
- 다른 개발자, 플러터 공식 개발팀에 의해 개발된 코드로 직접 개발 없이 기능을 재사용할 수 있도록 제공
가. pub.dev(https://pub.dev)플러터 패키지 모음 사이트
나. 사용방법 : pubspec.yaml 파일 내에 사용하는 패키지 이름과 버전을 명시
# pubspec.yaml (sqflite 작성하기 -> pub get 실행)
version: 1.0.0+1
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.0
sqflite: ^1.3.2+4
# database.dart
import 'package:path/path.dart';
import 'package:sqflite/sqflite.dart';
import 'package:todo/data/todo.dart';
class DatabaseHelper {
static final _databaseName = "todo.db";
static final _databaseVersion = 1;
static final todoTable = "todo";
DatabaseHelper._privateConstructor();
static final DatabaseHelper instance = DatabaseHelper._privateConstructor();
static Database _database;
Future<Database> get database async {
if(_database != null) return _database;
_database = await _initDatabase();
return _database;
}
_initDatabase() async {
var databasePath = await getDatabasesPath();
String path = join(databasePath, _databaseName);
return await openDatabase(path, version: _databaseVersion, onCreate: _onCreate,
onUpgrade: _onUpgrade);
}
Future _onCreate(Database db, int version) async {
await db.execute('''
CREATE TABLE IF NOT EXISTS $todoTable (
id INTEGER PRIMARY KEY AUTOINCREMENT,
date INTEGER DEFAULT 0,
done INTEGER DEFAULT 0,
title String,
memo String,
color INTEGER,
category String
)
''');
}
Future _onUpgrade(Database db, int oldVersion, int newVersion) async {}
// 투두 입력, 수정, 불러오기
Future<int> insertTodo(Todo todo) async {
Database db = await instance.database;
if(todo.id == null){
// 새로 추가
Map<String, dynamic> row = {
"title": todo.title,
"date": todo.date,
"done": todo.done,
"memo": todo.memo,
"color": todo.color,
"category": todo.category
};
return await db.insert(todoTable, row);
}else{
Map<String, dynamic> row = {
"title": todo.title,
"date": todo.date,
"done": todo.done,
"memo": todo.memo,
"color": todo.color,
"category": todo.category
};
return await db.update(todoTable, row, where: "id = ?", whereArgs: [todo.id]);
}
}
Future<List<Todo>> getAllTodo() async {
Database db = await instance.database;
List<Todo> todos = [];
var queries = await db.query(todoTable);
print(queries);
for(var q in queries){
todos.add(Todo(
id: q["id"],
title: q["title"],
date: q["date"],
done: q["done"],
memo: q["memo"],
category: q["category"],
color: q["color"],
));
}
return todos;
}
Future<List<Todo>> getTodoByDate(int date) async {
Database db = await instance.database;
List<Todo> todos = [];
var queries = await db.query(todoTable, where: "date = ?", whereArgs: [date]);
for(var q in queries){
todos.add(Todo(
id: q["id"],
title: q["title"],
date: q["date"],
done: q["done"],
memo: q["memo"],
category: q["category"],
color: q["color"],
));
}
return todos;
}
}
# todo.dart
class Todo {
String title;
String memo;
String category;
int color;
int done;
int date;
int id;
Todo({this.title, this.memo, this.category, this.color, this.done, this.date, this.id});
}
# 교육 소감
오늘은 todo list 기록화면을 만들었고, 이전 날짜에 저장된 todolist 를 어떻게 진행됐는지 확인이 되어야 하는 부분을 구현하였다. 이 부분을 구현하기 위해서 database를 이해하고 실제로 앱 내부의 저장소를 이해해야 한다. 앱 내의 database를 사용하기 위해서 package 기능을 사용해야 하는데, PubSpec.yml 에 사용하고자 하는 DB 라이브러리를 추가 해야한다. flutter 의 내부 DB는 Sqflite 라는 DB를 사용해야하는데, PubSpec.yml 에 버전과 함께 적어주면 자동으로 설치를 해준다. 또한 database 를 생성하는 database.dart 를 사용하여 실제로 DB 에 insert 하고 select 하는 클래스를 만들어줘야 한다. 이 databse.dart 앞으로 모든 앱의 DB 이용에 사용되기 때문에 충분히 익혀두는게 좋을것 같다. 클래스 명은 DatabaseHelper 를 만들고, 그 안에 변수들과 인스턴스 등을 작성해야 실제 앱 내의 DB를 사용할 수 있다. 또한 기존 database 가 있을 경우 기존 DB를 사용해야 하며, DB 가 없을 경우 초기화 해준다. 이러한 DB 설정 및 코드 작성은 다음시간에 작성할 todo 라던지, 이전 기록을 조회하는 용도로 사용하니 충분히 DB 설정 하는 부분을 익혀두는 것이 좋다.
# 본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.
'코딩 알로하 :: two > 하이브리드앱' 카테고리의 다른 글
패스트캠퍼스 챌린지 13일차 (0) | 2021.11.13 |
---|---|
패스트캠퍼스 챌린지 12일차 (0) | 2021.11.12 |
패스트캠퍼스 챌린지 10일차 (0) | 2021.11.11 |
패스트캠퍼스 챌린지 9일차 (0) | 2021.11.09 |
패스트캠퍼스 챌린지 8일차 (0) | 2021.11.08 |
댓글