[2026] TypeScript 실전 프로젝트 | REST API 서버 만들기
![[2026] TypeScript 실전 프로젝트 | REST API 서버 만들기](/og/s/typescript-series-08-project.webp)
이 글의 핵심
mkdir typescript-api cd typescript-api.
들어가며
이 글에서는 TypeScript로 요청·응답 형태가 컴파일 타임에 맞는 REST API 서버를 한 바퀴 구성해 봅니다. Express와 타입 정의를 연결하는 흐름을 따라가시면 됩니다.
JavaScript에서 TypeScript로의 전환
“런타임 에러는 프로덕션에서 터진다”는 말이 있습니다. JavaScript로 개발하던 시절, 이 말을 뼈저리게 체감했습니다. 테스트는 다 통과했는데 배포 후 사용자가 이상한 데이터를 입력하면 앱이 터지는 거죠. 특히 팀 프로젝트에서 다른 사람이 작성한 함수의 반환 타입을 잘못 이해해서 버그가 발생하는 일이 잦았습니다. TypeScript를 도입한 후 가장 먼저 느낀 건 안심이었습니다. IDE가 자동완성을 정확히 해주고, 타입이 맞지 않으면 빨간 줄로 미리 알려줍니다. 리팩토링할 때도 “이 함수를 바꾸면 어디가 깨질까?” 걱정할 필요가 없어졌죠. 물론 처음엔 타입 정의 작성이 번거로웠지만, 몇 달 후 그 타입 정의 덕분에 버그를 미리 잡는 경험을 하고 나니 돌아갈 수 없었습니다.
1. 프로젝트 설정
초기화
아래 코드는 bash를 사용한 구현 예제입니다. 코드를 직접 실행해보면서 동작을 확인해보세요.
mkdir typescript-api
cd typescript-api
npm init -y
npm install express
npm install --save-dev typescript @types/node @types/express ts-node nodemontsconfig.json
다음은 json를 활용한 상세한 구현 코드입니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
{
"compilerOptions": {
"target": "ES2020",
"module": "commonjs",
"lib": [ES2020],
"outDir": "./dist",
"rootDir": "./src",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true
},
"include": [src/**/*],
"exclude": ["node_modules", "dist"]
}package.json 스크립트
아래 코드는 json를 사용한 구현 예제입니다. 코드를 직접 실행해보면서 동작을 확인해보세요.
{
"scripts": {
"dev": "nodemon --exec ts-node src/index.ts",
"build": "tsc",
"start": "node dist/index.js"
}
}2. 타입 정의
src/types/user.ts
아래 코드는 typescript를 사용한 구현 예제입니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
export interface User {
id: string;
name: string;
email: string;
age: number;
createdAt: Date;
}
export type CreateUserDto = Omit<User, "id" | "createdAt">;
export type UpdateUserDto = Partial<CreateUserDto>;
export type UserResponse = Omit<User, "createdAt"> & {
createdAt: string;
};src/types/api.ts
아래 코드는 typescript를 사용한 구현 예제입니다. 에러 처리를 통해 안정성을 확보합니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
export interface ApiResponse<T> {
success: boolean;
data?: T;
error?: string;
}
export interface PaginatedResponse<T> {
items: T[];
total: number;
page: number;
pageSize: number;
}3. 데이터베이스 (메모리)
src/database/users.ts
다음은 typescript를 활용한 상세한 구현 코드입니다. 필요한 모듈을 import하고, 클래스를 정의하여 데이터와 기능을 캡슐화하며, 조건문으로 분기 처리를 수행합니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
import { User } from "../types/user";
class UserDatabase {
private users: Map<string, User> = new Map();
private currentId = 1;
create(data: Omit<User, "id" | "createdAt">): User {
const user: User = {
id: `U${String(this.currentId++).padStart(3, "0")}`,
...data,
createdAt: new Date()
};
this.users.set(user.id, user);
return user;
}
findAll(): User[] {
return Array.from(this.users.values());
}
findById(id: string): User | undefined {
return this.users.get(id);
}
update(id: string, data: Partial<User>): User | undefined {
const user = this.users.get(id);
if (!user) return undefined;
const updated = { ...user, ...data };
this.users.set(id, updated);
return updated;
}
delete(id: string): boolean {
return this.users.delete(id);
}
}
export const userDb = new UserDatabase();일상 비유로 이해하기: 메모리를 아파트 건물로 생각해보세요. 스택은 엘리베이터 같아서 빠르지만 공간이 제한적입니다. 힙은 창고처럼 넓지만 물건을 찾는 데 시간이 걸립니다. 포인터는 “3층 302호”처럼 주소를 가리키는 메모지라고 보면 됩니다.
4. 서비스 레이어
src/services/userService.ts
다음은 typescript를 활용한 상세한 구현 코드입니다. 필요한 모듈을 import하고, 비동기 처리를 통해 효율적으로 작업을 수행합니다, 에러 처리를 통해 안정성을 확보합니다, 조건문으로 분기 처리를 수행합니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
import { userDb } from "../database/users";
import { CreateUserDto, UpdateUserDto, User } from "../types/user";
export class UserService {
async createUser(data: CreateUserDto): Promise<User> {
this.validateEmail(data.email);
this.validateAge(data.age);
return userDb.create(data);
}
async getUsers(): Promise<User[]> {
return userDb.findAll();
}
async getUserById(id: string): Promise<User | undefined> {
return userDb.findById(id);
}
async updateUser(id: string, data: UpdateUserDto): Promise<User | undefined> {
if (data.email) {
this.validateEmail(data.email);
}
if (data.age !== undefined) {
this.validateAge(data.age);
}
return userDb.update(id, data);
}
async deleteUser(id: string): Promise<boolean> {
return userDb.delete(id);
}
private validateEmail(email: string): void {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailRegex.test(email)) {
throw new Error("올바른 이메일 형식이 아닙니다");
}
}
private validateAge(age: number): void {
if (age < 0 || age > 150) {
throw new Error("나이는 0-150 사이여야 합니다");
}
}
}
export const userService = new UserService();5. 컨트롤러
src/controllers/userController.ts
다음은 typescript를 활용한 상세한 구현 코드입니다. 필요한 모듈을 import하고, 비동기 처리를 통해 효율적으로 작업을 수행합니다, 에러 처리를 통해 안정성을 확보합니다, 반복문으로 데이터를 처리합니다, 조건문으로 분기 처리를 수행합니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
import { Request, Response } from "express";
import { userService } from "../services/userService";
import { ApiResponse } from "../types/api";
import { UserResponse } from "../types/user";
export class UserController {
async createUser(req: Request, res: Response): Promise<void> {
try {
const user = await userService.createUser(req.body);
const response: ApiResponse<UserResponse> = {
success: true,
data: {
...user,
createdAt: user.createdAt.toISOString()
}
};
res.status(201).json(response);
} catch (error) {
const response: ApiResponse<never> = {
success: false,
error: error instanceof Error ? error.message : "알 수 없는 에러"
};
res.status(400).json(response);
}
}
async getUsers(req: Request, res: Response): Promise<void> {
try {
const users = await userService.getUsers();
const response: ApiResponse<UserResponse[]> = {
success: true,
data: users.map(user => ({
...user,
createdAt: user.createdAt.toISOString()
}))
};
res.json(response);
} catch (error) {
const response: ApiResponse<never> = {
success: false,
error: error instanceof Error ? error.message : "알 수 없는 에러"
};
res.status(500).json(response);
}
}
async getUserById(req: Request, res: Response): Promise<void> {
try {
const user = await userService.getUserById(req.params.id);
if (!user) {
const response: ApiResponse<never> = {
success: false,
error: "사용자를 찾을 수 없습니다"
};
res.status(404).json(response);
return;
}
const response: ApiResponse<UserResponse> = {
success: true,
data: {
...user,
createdAt: user.createdAt.toISOString()
}
};
res.json(response);
} catch (error) {
const response: ApiResponse<never> = {
success: false,
error: error instanceof Error ? error.message : "알 수 없는 에러"
};
res.status(500).json(response);
}
}
async updateUser(req: Request, res: Response): Promise<void> {
try {
const user = await userService.updateUser(req.params.id, req.body);
if (!user) {
const response: ApiResponse<never> = {
success: false,
error: "사용자를 찾을 수 없습니다"
};
res.status(404).json(response);
return;
}
const response: ApiResponse<UserResponse> = {
success: true,
data: {
...user,
createdAt: user.createdAt.toISOString()
}
};
res.json(response);
} catch (error) {
const response: ApiResponse<never> = {
success: false,
error: error instanceof Error ? error.message : "알 수 없는 에러"
};
res.status(400).json(response);
}
}
async deleteUser(req: Request, res: Response): Promise<void> {
try {
const deleted = await userService.deleteUser(req.params.id);
if (!deleted) {
const response: ApiResponse<never> = {
success: false,
error: "사용자를 찾을 수 없습니다"
};
res.status(404).json(response);
return;
}
const response: ApiResponse<{ message: string }> = {
success: true,
data: { message: "사용자가 삭제되었습니다" }
};
res.json(response);
} catch (error) {
const response: ApiResponse<never> = {
success: false,
error: error instanceof Error ? error.message : "알 수 없는 에러"
};
res.status(500).json(response);
}
}
}
export const userController = new UserController();6. 라우터
src/routes/userRoutes.ts
아래 코드는 typescript를 사용한 구현 예제입니다. 필요한 모듈을 import하고. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
import { Router } from "express";
import { userController } from "../controllers/userController";
const router = Router();
router.post("/", (req, res) => userController.createUser(req, res));
router.get("/", (req, res) => userController.getUsers(req, res));
router.get("/:id", (req, res) => userController.getUserById(req, res));
router.put("/:id", (req, res) => userController.updateUser(req, res));
router.delete("/:id", (req, res) => userController.deleteUser(req, res));
export default router;7. 메인 서버
src/index.ts
다음은 typescript를 활용한 상세한 구현 코드입니다. 필요한 모듈을 import하고. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
import express from "express";
import userRoutes from "./routes/userRoutes";
const app = express();
const PORT = 3000;
app.use(express.json());
app.use("/api/users", userRoutes);
app.get("/", (req, res) => {
res.json({ message: "TypeScript API 서버" });
});
app.listen(PORT, () => {
console.log(`서버 실행 중: http://localhost:${PORT}`);
});8. 테스트
서버 실행
npm run devAPI 테스트
다음은 bash를 활용한 상세한 구현 코드입니다. 각 부분의 역할을 이해하면서 코드를 살펴보시기 바랍니다.
# 사용자 생성
curl -X POST http://localhost:3000/api/users \
-H "Content-Type: application/json" \
-d '{"name":"홍길동","email":"hong@test.com","age":25}'
# 사용자 목록
curl http://localhost:3000/api/users
# 사용자 조회
curl http://localhost:3000/api/users/U001
# 사용자 수정
curl -X PUT http://localhost:3000/api/users/U001 \
-H "Content-Type: application/json" \
-d '{"name":"김철수"}'
# 사용자 삭제
curl -X DELETE http://localhost:3000/api/users/U001정리
핵심 요약
- 타입 정의: interface, type alias
- 레이어 분리: Controller, Service, Database
- 타입 안전성: 컴파일 타임 에러 검출
- 에러 처리: try-catch, ApiResponse
- 프로덕션: tsc 컴파일 후 배포
다음 단계
- TypeScript + MongoDB
- TypeScript + Prisma
- TypeScript 테스트