본문 바로가기

JavaScript

TS, 기본적인 CRUD

728x90

TS, 기본적인 CRUD


인터페이스를 이용한 데이터 모델링

 

📄 src/items/item.interface.ts

// BaseItem -> 아이템을 수정, 등록할 때 사용
export interface BaseItem {
    name: string;
    price: number;
    description: string;
    image: string;
}

// Item -> 특정한 값을 검색하거나 삭제할때 사용
export interface Item extends BaseItem {
    id: number;
}

 

📄 src/items/items.interface.ts

import { Item } from "./item.interface";

// 아이템들을 합치기 위한 인터페이스 생성
export interface Items {
    [key: number]: Item;
}


//   1: { id: 1, name: "item1", price: 100, description: "This is item1", image: "item1.jpg" },
//   2: { id: 2, name: "item2", price: 200, description: "This is item2", image: "item2.jpg" },
//   3: { id: 3, name: "item3", price: 300, description: "This is item3", image: "item3.jpg" },

key 값은 넘버가 여러개 들어가고 값은 Item을 받는다고 생각하면 됨.

 

item.interface 로 부터 Item을 가져오고 Items 인터페이스 생성 후 내보냄!


📄 서비스 구현

/**
 * Data Model Interfaces
 */
import { BaseItem, Item } from "./item.interface";
import { Items } from "./items.interface";

/**
 * In-Memory Store
 */

let items: Items = {
    1: {
      id: 1,
      name: "Burger",
      price: 599,
      description: "Tasty",
      image: "https://cdn.auth0.com/blog/whatabyte/burger-sm.png",
    },
    2: {
      id: 2,
      name: "Pizza",
      price: 299,
      description: "Cheesy",
      image: "https://cdn.auth0.com/blog/whatabyte/pizza-sm.png",
    },
    3: {
      id: 3,
      name: "Tea",
      price: 199,
      description: "Informative",
      image: "https://cdn.auth0.com/blog/whatabyte/tea-sm.png",
    },
  };


/**
 * Service Methods
 */

export const findAll = async (): Promise<Item[]> => Object.values(items);

export const find = async (id: number): Promise<Item> => items[id];

export const create = async (newItem: BaseItem): Promise<Item> => {
  const id = new Date().valueOf();

  items[id] = {
    id,
    ...newItem,
  };

  return items[id];
};

export const update = async (
  id: number,
  itemUpdate: BaseItem
): Promise<Item | null> => {
  const item = await find(id);

  if (!item) {
    return null;
  }

  items[id] = { id, ...itemUpdate };

  return items[id];
};

export const remove = async (id: number): Promise<null | void> => {
  const item = await find(id);

  if (!item) {
    return null;
  }

  delete items[id];
};

📄 route, controller

/**
 * Required External Modules and Interfaces
 */
import express, { Request, Response } from "express";
import * as ItemService from "./items.service";
import { BaseItem, Item } from "./item.interface";

/**
 * Router Definition
 */
export const itemsRouter = express.Router();

/**
 * Controller Definitions
 */

// GET items

itemsRouter.get("/", async (req: Request, res: Response) => {
    try {
      const items: Item[] = await ItemService.findAll();
  
      res.status(200).send(items);
    } catch (e) {
      res.status(500).send(e.message);
    }
  });
  
  // GET items/:id
  
  itemsRouter.get("/:id", async (req: Request, res: Response) => {
    try {
        const id: number = parseInt(req.params.id, 10);
      const item: Item = await ItemService.find(id);
  
      if (item) {
        return res.status(200).send(item);
      }
  
      res.status(404).send("item not found");
    } catch (e) {
      res.status(500).send(e.message);
    }
  });
  
  // POST items
  
  itemsRouter.post("/", async (req: Request, res: Response) => {
    try {
      const item: BaseItem = req.body;
  
      const newItem: Item = await ItemService.create(item);
  
      res.status(201).json(newItem);
    } catch (e) {
      res.status(500).send(e.message);
    }
  });
  
  // PUT items/:id
  
  itemsRouter.put("/:id", async (req: Request, res: Response) => {
    try {
      const id: number = parseInt(req.params.id, 10);
      const itemUpdate: Item = req.body;
  
      const existingItem: Item = await ItemService.find(id);
  
      if (existingItem) {
        const updatedItem = await ItemService.update(id, itemUpdate);
        return res.status(200).json(updatedItem);
      }
  
      const newItem = await ItemService.create(itemUpdate);
  
      res.status(201).json(newItem);
    } catch (e) {
      res.status(500).send(e.message);
    }
  });
  
  // DELETE items/:id
  
  itemsRouter.delete("/:id", async (req: Request, res: Response) => {
    try {
      const id: number = parseInt(req.params.id, 10);
      const result: void | null = await ItemService.remove(id);
  
      if (result === null) {
        return res.status(404).send("item not found");
      }
      res.sendStatus(204);
    } catch (e) {
      res.status(500).send(e.message);
    }
  });

tea


📌 tea 가격 수정

put
tea 가격 수정