Side

코드 스플릿팅 을 하기위해서 패키지를 설치합니다. yarn add @loadable/component yarn add -D @types/loadable__componettypescript를 사용할시 두번째 줄도 설치 import LogIn from "@pages/LogIn"; 에서 다음과 loadable을 import 한뒤 @import loadable from "@loadable/component"; const LogIn = loadable(() => import("@pages/LogIn")); 으로 변경할 수 있습니다. css in javascript styled component 와 emotion 가장 유명한건 styled component지만 emotion이 설정이더 간단하여 emotion을 사용..

front 폴더 아래 hooks 라는 폴더를 생성하고 useInput.ts 파일을 생성합니다. customhook 은 반복되는 상태 관리 코드를 줄이려고 할때 사용합니다. mkdir hooks && touch useInput.tsuseInput.ts import React, { useCallback, useState } from "react"; const useInput = (initalData: any) => { const [value, setValue] = useState(initalData); const handler = useCallback((e) => { setValue(e.target.value); }, []); return [value, handler, setValue]; }; export ..

backend 시작하기 nest.js cli 를 사용하여 app을 만듭니다. $ nest g application nuber-eats-backend uber eats 를 clone coding 하기 위해서 nuber-eats 라고 프로젝트명을 설정했습니다. 그리고 git 저장소를 만들고 gitognore를 추가합니다. .gitignore nodemodule/ package-lock.json dist/그리고 이번 프로젝트에서는 REST를 사용하는 대신 GRAPHQL 을 사용할 예정입니다. $ npm i @nestjs/graphql graphql-tools graphql apollo-server-express 다음과 같이 설정합니다. app.moudles 은 main.ts 로 import 되는 유일한 mod..