"devDependencies": {
    "@types/express": "^5.0.0",
    "@types/node": "^22.7.8",
    "prettier": "^2.2.1",
    "tsc": "^2.0.3",
    "tsc-watch": "^4.2.9",
    "typescript": "^5.6.3"
  },
  "dependencies": {
    "express": "^5.0.1"
  }

type srcript 사용해서 types 도 같이 받아주기

{
  "compilerOptions": {
    "strict": true,
    "module": "commonjs",
    "declaration": true,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "ES5",
    "sourceMap": true,
    "outDir": "./dist",
    "baseUrl": "./src",
    "incremental": true
  },
  "include": ["src/**/*"]
}

tsconfig

기본사용법

const app: express.Express = express();
const port: number = 8000;

//* json meddleWear
app.use(express.json());

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "<http://localhost:3000>");
  res.setHeader("Access-Control-Allow-Headers", "Content-Type");
  next();
});

app.use((req, res, next) => {
  console.log("404 not found middleware");
  res.send({ error: "404 not found" });
});

app.listen(port, () => {
  console.log(`Example app listening at <http://localhost>:${port}`);
});

기볻적으로 위의 구조를 따라감, joson미들웨어는 json데이터 객체로 인식할 수 있게 도와줌

404 미들웨어는 위의 라우터에서 하나도 매칭안되었을때 리턴되기때문에 맨 하단에 넣어주기

header 넣어준건 cors에러 해결하기위함. content-Type은 prefilght - option 리퀘스트의 cors에러 해결

라우터

app.get("/", (req: express.Request, res: express.Response) => {
  res.send({ cats: Cat });
});

기본적인 라우터는 위와 같이 구성