Git Product home page Git Product logo

todo-app's Introduction

to-do-sample

環境構築

# 今のディレクトリを確認
# プロジェクト直下であることを確認
$ basename `pwd`
todo-app

# docker上でこのプロジェクト用のmysqlを立てる
$ docker-compose up -d

## 起動するまで待機

mysqlにlogin

# dockerで立てたmysqlサーバーにログイン
$ mysql -udocker -h127.0.0.1 -P33306 -p
# passはdocker
Password: docker
/**** ログイン成功 ****/
## to_do というDBがあることを確認
mysql> SHOW DATABASES;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| to_do              |
+--------------------+

mysqlにサンプルデータを挿入

## to_do のDBを使用
mysql> USE `to_do_sample`
## テーブルが空なことを確認
mysql> SHOW TABLES;
+------------------------+
| Tables_in_to_do_sample |
+------------------------+
0 rows in set

## `to_do_category` テーブル作成
mysql> CREATE TABLE `to_do_category` (
         `id`         BIGINT(20)   unsigned     NOT NULL AUTO_INCREMENT,
         `name`       VARCHAR(255)              NOT NULL,
         `slug`       VARCHAR(64) CHARSET ascii NOT NULL,
         `color`      TINYINT UNSIGNED          NOT NULL,
         `updated_at` timestamp                 NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
         `created_at` timestamp                 NOT NULL DEFAULT CURRENT_TIMESTAMP,
         PRIMARY KEY (`id`)
       ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

## `to_do_category` テーブルが作られたことを確認

mysql> SHOW TABLES;
+------------------------+
| Tables_in_to_do        |
+------------------------+
| to_do_category         |
+------------------------+
1 row in set

## 'to_do_category'テーブルのサンプルデータ挿入
mysql> INSERT INTO to_do_category(name,slug,color) values('フロントエンド','front',1);
mysql> INSERT INTO to_do_category(name,slug,color) values('バックエンド','back',2);
mysql> INSERT INTO to_do_category(name,slug,color) values('インフラ','infra',3);

## データが入っているか確認
mysql> SELECT * FROM `to_do_category`;
+----+----------------+-------+----------------+---------------------+---------------------+
| id | name           | slug  | category_color | updated_at          | created_at          |
+----+----------------+-------+----------------+---------------------+---------------------+
| 1  | フロントエンド | front | 1              | 2020-01-31 17:29:38 | 2020-01-31 17:29:38 |
| 2  | バックエンド   | back  | 2              | 2020-01-31 17:29:38 | 2020-01-31 17:29:38 |
| 3  | インフラ       | infra | 3              | 2020-01-31 17:29:38 | 2020-01-31 17:29:38 |
+----+----------------+-------+----------------+---------------------+---------------------+

## 'to_do'テーブルを作成
mysql> CREATE TABLE `to_do` (
         `id`          BIGINT(20) unsigned NOT NULL AUTO_INCREMENT,
         `category_id` BIGINT(20) unsigned NOT NULL,
         `title`       VARCHAR(255)        NOT NULL,
         `body`        TEXT,
         `state`       TINYINT UNSIGNED    NOT NULL,
         `updated_at`  TIMESTAMP           NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
         `created_at`  TIMESTAMP           NOT NULL DEFAULT CURRENT_TIMESTAMP,
         PRIMARY KEY (`id`)
       ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

## 'to_do'テーブルが作られたことを確認
mysql> SHOW TABLES;
+------------------------+
| Tables_in_to_do_sample |
+------------------------+
| to_do                  |
| to_do_category         |
+------------------------+
2 rows in set

## 'to_do'テーブルのサンプルデータ挿入
mysql> INSERT INTO `to_do`(category_id,title,body,state) values(1, 'デザインをいい感じにする','ヘッダーのデザインをもっといい感じに',0);
mysql> INSERT INTO `to_do`(category_id,title,body,state) values(2, 'Controllerの修正','Controller名をもっといい感じに',1);
mysql> INSERT INTO `to_do`(category_id,title,body,state) values(3, '新しいDB環境の作成','タイトル通り',2);

## データが入っているか確認
mysql> SELECT * FROM to_do;
+----+-------------+--------------------------+--------------------------------------+---------------------+---------------------+
| id | category_id | title                    | body                                 | updated_at          | created_at          |
+----+-------------+--------------------------+--------------------------------------+---------------------+---------------------+
| 1  | 1           | デザインをいい感じにする | ヘッダーのデザインをもっといい感じに | 2020-02-21 17:53:22 | 2020-02-21 17:53:22 |
| 2  | 2           | Controllerの修正         | Controller名をもっといい感じに       | 2020-02-21 17:53:22 | 2020-02-21 17:53:22 |
| 3  | 3           | 新しいDB環境の作成       | タイトル通り                         | 2020-02-21 17:53:22 | 2020-02-21 17:53:22 |
+----+-------------+--------------------------+--------------------------------------+---------------------+---------------------+

/**** 完了 ****/

playframeworkを起動

$ sbt run   // サーバーが起動したらlocalhost:9000にアクセス

todo-app's People

Contributors

s10a137g avatar

Watchers

 avatar

todo-app's Issues

IdはLongではなく型付けする

Todoモデルの定義でcategoryIdがLongになっていますが、Category.Idにしましょう。

case class Todo(
  id:         Option[Id],
  categoryId: Long,
  title:      String,
  body:       String,
  state:      Status,
  updatedAt:  LocalDateTime = NOW,
  createdAt:  LocalDateTime = NOW
) extends EntityModel[Id]

LongではなくCategory.Id型にするメリットは、IxiaSの資料等見ていただき、わからなかったらご質問くださいmm

View Modelの設計

#1
に付随して、app/model配下のView Modelの設計をお願いします。
現状、ViewValueHomeをいろいろな箇所で使っていますが、
ViewValueCommonを継承して、各ページごとに定義をお願いします。

お時間あったらチャレンジしてほしいお題:カテゴリ削除時の要件

https://github.com/s10a137g/todo-app/blob/main/app/controllers/category/CategoryController.scala#L189

https://nextbeat-external.atlassian.net/wiki/spaces/DEVNEWEDU/pages/1267269682/4-2-2

Category削除時にそのCategoryに該当するTodoのデータも更新する
Categoryが削除された時に、該当しているTodoを削除するか、
”どのカテゴリにも紐づいていない” というデータになるようTodoを更新する

この要件を実装するところで、Todoが複数あるような場合にどのように対応するのか?
の部分の実装をしていただけると良さそう。

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.