본문 바로가기
  • 인공지능
  • 블록체인
  • 정보보안
코딩 알로하 :: two/하이브리드앱

패스트캠퍼스 챌린지 11일차

by nathan03 2021. 11. 11.
반응형

# 강의 제목 : 누적다운로드 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 설정 하는 부분을 익혀두는 것이 좋다. 


# 본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.

https://bit.ly/3FVdhDa

 

수강료 100% 환급 챌린지 | 패스트캠퍼스

딱 5일간 진행되는 환급챌린지로 수강료 100% 환급받으세요! 더 늦기전에 자기계발 막차 탑승!

fastcampus.co.kr

 

반응형

댓글