ハンズオンNode.jsを進める【第7章 データストレージ】

ps
  PID TTY           TIME CMD
16232 ttys000    0:02.02 -zsh -g --no_rcs
14460 ttys001    0:03.06 -zsh -g --no_rcs
98326 ttys001    0:00.92 npm run watch
98344 ttys001    0:06.45 webpack
98350 ttys003    0:00.80 -zsh -g --no_rcs

ps
  PID TTY           TIME CMD
14460 ttys001    0:03.11 -zsh -g --no_rcs
99248 ttys001    0:00.59 npm start
99261 ttys001    0:00.01 sh -c -- webpack --watch & nodemon dist/main.js
99262 ttys001    0:05.43 webpack
99263 ttys001    0:00.30 node /Users/yuuki_haga/repos/node/node-practice/chapter_7/node_modules/.bin/nodemon dist/main.js
99265 ttys001    0:00.20 /Users/yuuki_haga/.nodenv/versions/18.9.1/bin/node dist/main.js
98350 ttys003    0:00.83 -zsh -g --no_rcs

    "baseUrl": "./",
    // pathsオプションは、baseUrlで指定したディレクトリからの相対パスを、特定のエイリアスにマッピングするために使用します。
    // 上記の例では、~/*パターンにマッチするすべてのモジュールパスを、./src/ディレクトリ内にある対応するファイルに解決します。
    "paths": {
      "~/*": ["./src/*"]
    }

  output: {
    filename: "main.js",
    path: path.resolve(__dirname, "dist"),
    // これでバンドル結果がESモジュール形式のコードになる
    module: true,
    chunkFormat: "module",
  },

node
Welcome to Node.js v18.9.1.
Type ".help" for more information.
> .editor
// Entering editor mode (Ctrl+D to finish, Ctrl+C to cancel)
// Entering editor mode (Ctrl+D to finish, Ctrl+C to cancel)
class MyClass {
  method1() {
    console.log("method1")
  }
  method2() {
    this.method1()
  }
}
undefined
> const ins = new MyClass()
undefined
> ins.method1()
method1
undefined
> ins.method2()
method1
undefined
> const insMethod = ins.method1
undefined
> insMethod()
method1
undefined
> const insMethod2 = ins.method2
undefined
> insMethod2
[Function: method2]
> insMethod2()
Uncaught TypeError: Cannot read properties of undefined (reading 'method1')
    at method2 (REPL3:7:10)
> .editor
// Entering editor mode (Ctrl+D to finish, Ctrl+C to cancel)
function add(a, b) {
  return (Number(this) || 0) + a + b
}

undefined
> add(1, 2)
3
> add.bind()(1, 2)
3
> add.bind(1)(1, 2)
4
> add.bind(1, 2, 3)()
6
> add.length
2
> add.bind(1, 2).length
1
> insMethod2.bind(ins)()
method1
undefined
>

import { Todo, TodoStatus } from "~/models";

// goみたいに大文字で定義する必要なかったわ
export interface Store {
  // TypeScriptでPromiseの型を指定する場合はジェネリクスを伴いPromise<T>と書きます。
  // TにはPromiseが履行された(fulfilled)ときに返す値の型を指定します。
  all(): Promise<Todo[]>;
  findById(id: string): Promise<Todo | null>;
  whereByStatus(status: TodoStatus): Promise<Todo[]>;
  create(todo: Todo): Promise<Todo | null>;
  updateStatus(todo: Todo): Promise<Todo | null>;
  destroy(id: string): Promise<string | null>;
}

import { readdir, readFile, unlink, writeFile } from "fs/promises";
import { extname } from "path";
import { rootDir } from "~/constants";
import { Todo, TodoStatus } from "~/models";
import { Store } from "./store";

// インターフェースをクラスに実装するには、implementsキーワードを使う
// てかこのfileSysteってだいぶ実装がtodoに依存しているな。todo以外にも使えるようにしたい
export class FileSystem implements Store {
  async all() {
    const files = (await readdir(`${rootDir}/store/fileStore/todos`)).filter(
      (file) => extname(file) === ".json",
    );

    // Promise.all()の返すPromiseインスタンスは、引数の配列に含まれているPromiseインスタンスが全てfulfilledになった時にfulfilledになる。
    // 1つでもrejectedになると、その他のPromiseインスタンスの結果を待たずにrejectedになる。
    // fulfilledなPromiseインスタンスを返す時、その値は引数のPromiseインスタンスが解決された値を、引数で与えられた順番通り保持する配列になる。
    return Promise.all(
      files.map((file) =>
        readFile(`${rootDir}/store/fileStore/todos/${file}`, "utf8").then(
          (todo) => JSON.parse(todo) as Todo,
        ),
      ),
    );
  }

  async findById(id: string) {
    const todos = await this.all();
    return todos.find((todo) => todo.id === id);
  }

  async whereByStatus(status: TodoStatus) {
    const todos = await this.all();
    return todos.filter((todo) => todo.status === status);
  }

  async create(todo: Todo) {
    const newTodo = new Todo({
      id: crypto.randomUUID(),
      title: todo.title,
      status: TodoStatus.Progress,
    });

    await writeFile(`${rootDir}/store/fileStore/todos/${newTodo.id}.json`, JSON.stringify(newTodo));
    return newTodo;
  }

  async updateStatus(todo: Todo) {
    const fileName = `${rootDir}/store/fileStore/todos/${todo.id}.json`;
    return readFile(fileName, "utf8").then(
      (content) => {
        const newTodo = new Todo({
          ...JSON.parse(content),
          ...todo,
        });
        return writeFile(fileName, JSON.stringify(newTodo)).then(() => newTodo);
      },
      // ファイルやディレクトリが存在しない場合、エラーオブジェクトのcodeプロパティに"ENOENT"という文字列がセットされる
      (err) => (err.code === "ENOENT" ? null : Promise.reject(err)),
    );
  }

  async destroy(id: string) {
    return unlink(`${rootDir}/store/fileStore/todos/${id}.json`).then(
      () => id,
      (err) => (err.code === "ENOENT" ? null : Promise.reject(err)),
    );
  }
}

import { generateUUID } from "~/helpers";
import { Todo, TodoStatus } from "~/models";
import { initDBConnection } from "./db";
import { Store } from "./store";

export class TodoStore implements Store {
  async all() {
    const connection = await this.buildDBConnection();
    const [rows] = await connection.execute("SELECT * FROM `todos`");

    if (Array.isArray(rows)) {
      const newRows = rows as Todo[];
      // 空の配列に対してmapをやったら空の配列
      return newRows.map((row) => new Todo(row));
    } else {
      return [];
    }
  }

  async findById(id: string) {
    const connection = await this.buildDBConnection();
    const [rows] = await connection.execute("SELECT * FROM `todos` WHERE `id` = ?", [id]);

    if (Array.isArray(rows)) {
      const newRows = rows as Todo[];
      const todos = newRows.map((row) => new Todo(row));
      return todos.find((todo) => todo.id === id);
    } else {
      return null;
    }
  }

  async whereByStatus(status: TodoStatus) {
    const connection = await this.buildDBConnection();
    const [rows] = await connection.execute("SELECT * FROM `todos` WHERE status = ?", [status]);

    if (Array.isArray(rows)) {
      const newRows = rows as Todo[];
      // 空の配列に対してmapをやったら空の配列
      return newRows.map((row) => new Todo(row));
    } else {
      return [];
    }
  }

  async create(todo: Todo) {
    try {
      const connection = await this.buildDBConnection();
      const todoId = generateUUID();
      const newTodo = new Todo({ ...todo, id: todoId });
      const [rows] = await connection.execute(
        "INSERT INTO todos (id, title, status) VALUES (?, ?, ?)",
        [newTodo.id, newTodo.title, newTodo.status],
      );

      return newTodo;
    } catch (err) {
      return null;
    }
  }

  async updateStatus(todo: Todo) {
    try {
      const connection = await this.buildDBConnection();
      const [rows] = await connection.execute("UPDATE todos SET status = ? WHERE id = ?", [
        todo.status,
        todo.id,
      ]);
      return todo;
    } catch (err) {
      return null;
    }
  }

  async destroy(id: string) {
    try {
      const connection = await this.buildDBConnection();
      const [rows] = await connection.execute("DELETE FROM todos WHERE id = ?", [id]);
      return id;
    } catch (err) {
      console.error("エラーが出ました", err);
      return null;
    }
  }

  async buildDBConnection() {
    const connection = await initDBConnection();
    return connection;
  }
}

import express, { Request } from "express";
import { AppError, StatusErrorCode, StatusSuccessCode, Todo, TodoStatus } from "~/models";
import { TodoStore } from "~/store";

const store = new TodoStore();

export const router = express.Router();

router.route("/hello").get((req, res, next) => {
  res.status(StatusSuccessCode.Ok).send("World");
});

// 「/api/todos/」にマッチする場合
// クエリパラメータで絞り込めるようにした
router
  .route("/")
  // Todo一覧の取得
  .get((req, res, next) => {
    const { status } = req.query;

    if (status === TodoStatus.Completed || status === TodoStatus.Progress) {
      store
        .whereByStatus(status)
        .then((todos) => res.json(todos))
        .catch(next);
    } else {
      store
        .all()
        .then((todos) => res.json(todos))
        .catch(next);
    }
  })
  // Todoの新規登録
  .post((req: Request<unknown, unknown, { todo: { title: string } }>, res, next) => {
    const { title } = req.body.todo;

    if (!title || typeof title !== "string") {
      // Expressではミドルウェアでnextがエラー引数で呼び出されるか、同期処理がエラーを投げたとき(throw)に、そのエラーを捕虜してエラーハンドリングミドルウェアで処理する
      // 独自のエラーハンドリングミドルウェアを用意していないなら、デフォルトのエラーハンドリングミドルウェアでエラーハンドリングが行われる
      const err = new AppError({
        statusCode: StatusErrorCode.BadRequest,
        message: "title is required",
      });
      next(err);
    }

    const newTodo = new Todo({ title });
    store
      .create(newTodo)
      .then((todo) => res.status(StatusSuccessCode.Created).json(todo))
      .catch(next);
  });

router
  .route("/:id")
  // 指定したidでTodoを取得
  .get((req: Request<{ id: string }>, res, next) => {
    const { id } = req.params;
    store
      .findById(id)
      .then((todo) => res.status(StatusSuccessCode.Ok).json(todo))
      .catch(next);
  })
  // 指定したTodoを削除
  .delete((req: Request<{ id: string }>, res, next) => {
    const { id } = req.params;
    store
      .destroy(id)
      .then((id) => {
        if (id) {
          // res.endはボディを何も返さない時に使う
          res.status(StatusSuccessCode.NoContent).end();
        } else {
          next();
        }
      })
      .catch(next);
  });

router
  .route("/:id/status")
  // putはリソース自体を上書きする
  // putにボディは必要
  .put((req: Request<{ id: string }, unknown, { todo: { status: TodoStatus } }>, res, next) => {
    const { status } = req.body.todo;
    const { id } = req.params;
    store
      .updateStatus(new Todo({ id, status }))
      .then((todo) => res.status(StatusSuccessCode.Ok).json(todo))
      .catch(next);
  });