์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋์ ์ ์ ๋ถ์์ ์ฌ์ธต์ ์ผ๋ก ์์๋ณด์ธ์. ํ์ ์คํฌ๋ฆฝํธ(TypeScript)์ JSDoc ๊ฐ์ ๋๊ตฌ๊ฐ ์ด๋ป๊ฒ ๋ฒ๊ทธ๋ฅผ ์๋ฐฉํ๊ณ ๊ธ๋ก๋ฒ ํ ์ ๋ฐ์ ์ฝ๋ ํ์ง์ ๊ฐ์ ํ๋์ง ๋ฐฐ์๋๋ค.
์ ์ ๋ถ์์ ํ์ฉํ ์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋ ํ์ ์ฒดํน ๋ง์คํฐํ๊ธฐ: ๊ธ๋ก๋ฒ ๊ฐ๋ฐ์ ๊ฐ์ด๋
ํ๋ ์ํํธ์จ์ด ๊ฐ๋ฐ ์ธ๊ณ์์ ์๋ฐ์คํฌ๋ฆฝํธ๋ ์น์ ์ธ์ด๋ก์ ๊ตฐ๋ฆผํ๊ณ ์์ต๋๋ค. ๊ทธ ์ ์ฐ์ฑ๊ณผ ๋์ ์ธ ํน์ฑ์ ๊ฐ๋จํ ์น์ฌ์ดํธ๋ถํฐ ๋ณต์กํ ๊ธฐ์ ๊ท๋ชจ์ ์ ํ๋ฆฌ์ผ์ด์ ์ ์ด๋ฅด๊ธฐ๊น์ง ๋ชจ๋ ๊ฒ์ ํ์ ์ค์ด์ฃผ์์ต๋๋ค. ํ์ง๋ง ๋ฐ๋ก ์ด ์ ์ฐ์ฑ์ด ์๋ ์ ๊ฒ์ด ๋ ์๋ ์์ต๋๋ค. ํ๋ก์ ํธ ๊ท๋ชจ๊ฐ ์ปค์ง๊ณ ๋ถ์ฐ๋ ๊ตญ์ ํ์ ์ํด ์ ์ง๋ณด์๋๋ฉด์, ๋ด์ฅ๋ ํ์ ์์คํ ์ ๋ถ์ฌ๋ ๋ฐํ์ ์ค๋ฅ, ์ด๋ ค์ด ๋ฆฌํฉํ ๋ง, ๊ทธ๋ฆฌ๊ณ ํ๋ ๊ฐ๋ฐ์ ๊ฒฝํ์ผ๋ก ์ด์ด์ง ์ ์์ต๋๋ค.
๋ฐ๋ก ์ฌ๊ธฐ์ ์ ์ ๋ถ์์ด ์ญํ ์ ํฉ๋๋ค. ์ฝ๋๋ฅผ ์คํํ์ง ์๊ณ ๋ถ์ํจ์ผ๋ก์จ, ์ ์ ๋ถ์ ๋๊ตฌ๋ ์ ์ฌ์ ์ธ ๋ฌธ์ ์ ๋ค์ ํ๋ก๋์ ์ ๋๋ฌํ๊ธฐ ์ ์ ๊ด๋ฒ์ํ๊ฒ ์ก์๋ผ ์ ์์ต๋๋ค. ์ด ๊ฐ์ด๋๋ ๊ฐ์ฅ ์ํฅ๋ ฅ ์๋ ์ ์ ๋ถ์ ํํ ์ค ํ๋์ธ ๋ชจ๋ ํ์ ์ฒดํน์ ๋ํ ํฌ๊ด์ ์ธ ํ๊ตฌ๋ฅผ ์ ๊ณตํฉ๋๋ค. ์ฐ๋ฆฌ๋ ์ด๊ฒ์ด ์ ํ๋ ๊ฐ๋ฐ์ ํ์์ ์ธ์ง ์์๋ณด๊ณ , ์ฃผ์ ๋๊ตฌ๋ค์ ๋ถ์ํ๋ฉฐ, ์ฌ๋ฌ๋ถ์ด๋ ์ฌ๋ฌ๋ถ์ ํ์๋ค์ด ์ธ๊ณ ์ด๋์ ์๋ ํ๋ก์ ํธ์ ์ด๋ฅผ ๊ตฌํํ๊ธฐ ์ํ ์ค์ฉ์ ์ด๊ณ ์คํ ๊ฐ๋ฅํ ์กฐ์ธ์ ์ ๊ณตํ ๊ฒ์ ๋๋ค.
์ ์ ๋ถ์์ด๋ ๋ฌด์์ด๋ฉฐ ์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋์ ์ ์ค์ํ๊ฐ?
ํต์ฌ์ ์ผ๋ก, ์ ์ ๋ถ์์ ์์ค ์ฝ๋๋ฅผ ๊ฒ์ฌํ์ฌ ์ ์ฌ์ ์ธ ์ทจ์ฝ์ , ๋ฒ๊ทธ, ๊ทธ๋ฆฌ๊ณ ์ฝ๋ฉ ํ์ค๊ณผ์ ํธ์ฐจ๋ฅผ ์ฐพ์๋ด๋ ๊ณผ์ ์ด๋ฉฐ, ์ด ๋ชจ๋ ๊ฒ์ ํ๋ก๊ทธ๋จ์ ์คํํ์ง ์๊ณ ์ํํฉ๋๋ค. ์ด๊ฒ์ ์๋ํ๋๊ณ ๊ณ ๋๋ก ์ ๊ตํ ์ฝ๋ ๋ฆฌ๋ทฐ๋ผ๊ณ ์๊ฐํ๋ฉด ๋ฉ๋๋ค.
์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋์ ์ ์ฉ๋ ๋, ์ ์ ๋ถ์์ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ค๋ฅธ ๋ถ๋ถ๋ค ์ฌ์ด์ '๊ณ์ฝ'์ ์ด์ ์ ๋ง์ถฅ๋๋ค. ํ ๋ชจ๋์ ํจ์, ํด๋์ค ๋๋ ๋ณ์ ์งํฉ์ ๋ด๋ณด๋ด๊ณ (export), ๋ค๋ฅธ ๋ชจ๋๋ค์ ๊ทธ๊ฒ๋ค์ ๊ฐ์ ธ์์(import) ์ฌ์ฉํฉ๋๋ค. ํ์ ์ฒดํน ์์ด๋ ์ด ๊ณ์ฝ์ ๊ฐ์ ๊ณผ ๋ฌธ์์ ๊ธฐ๋ฐํฉ๋๋ค. ์๋ฅผ ๋ค์ด:
- ๋ชจ๋ A๋ `calculatePrice(quantity, pricePerItem)` ํจ์๋ฅผ ๋ด๋ณด๋ ๋๋ค.
- ๋ชจ๋ B๋ ์ด ํจ์๋ฅผ ๊ฐ์ ธ์ `calculatePrice('5', '10.50')`์ผ๋ก ํธ์ถํฉ๋๋ค.
๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ์์๋ ์ด๊ฒ์ด ์ซ์ ๊ณ์ฐ ๋์ ์๊ธฐ์น ์์ ๋ฌธ์์ด ์ฐ๊ฒฐ(`"510.50"`)์ ์ด๋ํ ์ ์์ต๋๋ค. ์ด๋ฐ ์ ํ์ ์ค๋ฅ๋ ํ๋ก๋์ ์์ ์ฌ๊ฐํ ๋ฒ๊ทธ๋ฅผ ์ผ์ผํฌ ๋๊น์ง ๋์ ๋์ง ์์ ์ ์์ต๋๋ค. ์ ์ ํ์ ์ฒดํน์ ์ด ์ค๋ฅ๋ฅผ ์ฝ๋ ์๋ํฐ์์ ์ก์๋ด์ด, ํด๋น ํจ์๊ฐ ๋ฌธ์์ด์ด ์๋ ์ซ์๋ฅผ ๊ธฐ๋ํ๋ค๋ ๊ฒ์ ๊ฐ์กฐ ํ์ํฉ๋๋ค.
๊ธ๋ก๋ฒ ํ์๊ฒ๋ ๊ทธ ์ด์ ์ด ๋์ฑ ์ปค์ง๋๋ค:
- ๋ฌธํ์ ์๊ฐ๋๋ฅผ ์ด์ํ ๋ช ํ์ฑ: ํ์ ์ ์ ํํ๊ณ ๋ชจํธํ์ง ์์ ๋ฌธ์ ์ญํ ์ ํฉ๋๋ค. ๋์ฟ์ ์๋ ๊ฐ๋ฐ์๋ ๋ฒ ๋ฅผ๋ฆฐ์ ์๋ ๋๋ฃ๊ฐ ์์ฑํ ํจ์์ ํ์ํ ๋ฐ์ดํฐ ๊ตฌ์กฐ๋ฅผ ํ์๋ ์ค๋ช ์์ด ์ฆ์ ์ดํดํ ์ ์์ต๋๋ค.
- ๋ ์์ ํ ๋ฆฌํฉํ ๋ง: ๋ชจ๋ ๋ด์์ ํจ์ ์๊ทธ๋์ฒ๋ ๊ฐ์ฒด ํํ๋ฅผ ๋ณ๊ฒฝํด์ผ ํ ๋, ์ ์ ํ์ ์ฒด์ปค๋ ์ฝ๋๋ฒ ์ด์ค์์ ์ ๋ฐ์ดํธ๊ฐ ํ์ํ ๋ชจ๋ ๊ณณ์ ์ฆ์ ๋ณด์ฌ์ค๋๋ค. ์ด๋ ํ์ด ๋ฌด์ธ๊ฐ๋ฅผ ๋ง๊ฐ๋จ๋ฆด ๋๋ ค์ ์์ด ์ฝ๋๋ฅผ ๊ฐ์ ํ ์ ์๋ค๋ ์์ ๊ฐ์ ์ค๋๋ค.
- ํฅ์๋ ์๋ํฐ ํด๋ง: ์ ์ ๋ถ์์ ์ง๋ฅํ ์ฝ๋ ์์ฑ(IntelliSense), ์ ์๋ก ์ด๋, ์ธ๋ผ์ธ ์ค๋ฅ ๋ณด๊ณ ์ ๊ฐ์ ๊ธฐ๋ฅ์ ๊ตฌ๋ํ์ฌ ๊ฐ๋ฐ์ ์์ฐ์ฑ์ ๊ทน์ ์ผ๋ก ํฅ์์ํต๋๋ค.
์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋์ ์งํ: ๊ฐ๋จํ ์์ฝ
๋ชจ๋ ํ์ ์ฒดํน์ ์ดํดํ๋ ค๋ฉด ๋ชจ๋ ์์คํ ์์ฒด๋ฅผ ์ดํดํ๋ ๊ฒ์ด ํ์์ ์ ๋๋ค. ์ญ์ฌ์ ์ผ๋ก ์๋ฐ์คํฌ๋ฆฝํธ์๋ ๋ค์ดํฐ๋ธ ๋ชจ๋ ์์คํ ์ด ์์๊ธฐ ๋๋ฌธ์ ๋ค์ํ ์ปค๋ฎค๋ํฐ ์ฃผ๋ ์๋ฃจ์ ์ด ๋ฑ์ฅํ์ต๋๋ค.
CommonJS (CJS)
Node.js์ ์ํด ๋์คํ๋ CommonJS๋ ๋ชจ๋์ ๊ฐ์ ธ์ค๊ธฐ ์ํด `require()`๋ฅผ ์ฌ์ฉํ๊ณ ๋ด๋ณด๋ด๊ธฐ ์ํด `module.exports`๋ฅผ ์ฌ์ฉํฉ๋๋ค. ์ด๊ฒ์ ๋๊ธฐ์์ด์ด์ ๋ชจ๋์ ํ๋์ฉ ๋ก๋ํ๋๋ฐ, ์ด๋ ๋ก์ปฌ ๋์คํฌ์์ ํ์ผ์ ์ฝ๋ ์๋ฒ์ฌ์ด๋ ํ๊ฒฝ์ ์ ๋ง์ต๋๋ค.
์์:
// utils.js
const PI = 3.14;
function circleArea(radius) {
return PI * radius * radius;
}
module.exports = { PI, circleArea };
// main.js
const { circleArea } = require('./utils.js');
console.log(circleArea(10));
ECMAScript Modules (ESM)
ESM์ ES2015(ES6)์์ ์๊ฐ๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ๊ณต์ ํ์คํ๋ ๋ชจ๋ ์์คํ ์ ๋๋ค. `import`์ `export` ํค์๋๋ฅผ ์ฌ์ฉํฉ๋๋ค. ESM์ ๋น๋๊ธฐ์์ด๋ฉฐ ๋ธ๋ผ์ฐ์ ์ Node.js์ ๊ฐ์ ์๋ฒ์ฌ์ด๋ ํ๊ฒฝ ๋ชจ๋์์ ์๋ํ๋๋ก ์ค๊ณ๋์์ต๋๋ค. ๋ํ ์ฌ์ฉ๋์ง ์๋ export๋ฅผ ์ต์ข ์ฝ๋ ๋ฒ๋ค์์ ์ ๊ฑฐํ์ฌ ํฌ๊ธฐ๋ฅผ ์ค์ด๋ ํ๋ก์ธ์ค์ธ 'ํธ๋ฆฌ ์์ดํน(tree-shaking)'๊ณผ ๊ฐ์ ์ ์ ๋ถ์์ ์ด์ ์ ํ์ฉํฉ๋๋ค.
์์:
// utils.js
export const PI = 3.14;
export function circleArea(radius) {
return PI * radius * radius;
}
// main.js
import { circleArea } from './utils.js';
console.log(circleArea(10));
ํ๋ ์๋ฐ์คํฌ๋ฆฝํธ ๊ฐ๋ฐ์ ์๋์ ์ผ๋ก ESM์ ์ ํธํ์ง๋ง, ๋ง์ ๊ธฐ์กด ํ๋ก์ ํธ์ Node.js ํจํค์ง๋ ์ฌ์ ํ CommonJS๋ฅผ ์ฌ์ฉํฉ๋๋ค. ๊ฒฌ๊ณ ํ ์ ์ ๋ถ์ ์ค์ ์ ์ด ๋์ ๋ชจ๋ ์ดํดํ๊ณ ์ฒ๋ฆฌํ ์ ์์ด์ผ ํฉ๋๋ค.
์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋ ํ์ ์ฒดํน์ ์ํ ํต์ฌ ์ ์ ๋ถ์ ๋๊ตฌ
๋ช ๊ฐ์ง ๊ฐ๋ ฅํ ๋๊ตฌ๋ค์ด ์๋ฐ์คํฌ๋ฆฝํธ ์ํ๊ณ์ ์ ์ ํ์ ์ฒดํน์ ์ด์ ์ ๊ฐ์ ธ๋ค์ค๋๋ค. ๊ฐ์ฅ ์ ๋ช ํ ๊ฒ๋ค์ ์ดํด๋ณด๊ฒ ์ต๋๋ค.
ํ์ ์คํฌ๋ฆฝํธ(TypeScript): ์ฌ์ค์์ ํ์ค
ํ์ ์คํฌ๋ฆฝํธ๋ ๋ง์ดํฌ๋ก์ํํธ๊ฐ ๊ฐ๋ฐํ ์คํ์์ค ์ธ์ด๋ก, ์ ์ ํ์ ์ ์๋ฅผ ์ถ๊ฐํ์ฌ ์๋ฐ์คํฌ๋ฆฝํธ ์์ ๊ตฌ์ถ๋ฉ๋๋ค. ์ด๊ฒ์ ์๋ฐ์คํฌ๋ฆฝํธ์ '์์ ์งํฉ(superset)'์ผ๋ก, ์ ํจํ ์๋ฐ์คํฌ๋ฆฝํธ ์ฝ๋๋ ๋ชจ๋ ์ ํจํ ํ์ ์คํฌ๋ฆฝํธ ์ฝ๋์ด๊ธฐ๋ ํฉ๋๋ค. ํ์ ์คํฌ๋ฆฝํธ ์ฝ๋๋ ๋ชจ๋ ๋ธ๋ผ์ฐ์ ๋ Node.js ํ๊ฒฝ์์ ์คํ๋ ์ ์๋ ์ผ๋ฐ ์๋ฐ์คํฌ๋ฆฝํธ๋ก ํธ๋์คํ์ผ(์ปดํ์ผ)๋ฉ๋๋ค.
์๋ ๋ฐฉ์: ๋ณ์, ํจ์ ๋งค๊ฐ๋ณ์, ๋ฐํ ๊ฐ์ ํ์ ์ ์ ์ํฉ๋๋ค. ๊ทธ๋ฌ๋ฉด ํ์ ์คํฌ๋ฆฝํธ ์ปดํ์ผ๋ฌ(TSC)๊ฐ ์ด ์ ์์ ๋ํด ์ฝ๋๋ฅผ ํ์ธํฉ๋๋ค.
๋ชจ๋ ํ์ดํ ์์:
// services/math.ts
export interface CalculationOptions {
precision?: number; // ์ ํ์ ์์ฑ
}
export function add(a: number, b: number, options?: CalculationOptions): number {
const result = a + b;
if (options?.precision) {
return parseFloat(result.toFixed(options.precision));
}
return result;
}
// main.ts
import { add } from './services/math';
const sum = add(5.123, 10.456, { precision: 2 }); // ์ ํํจ: sum์ 15.58
const invalidSum = add('5', '10'); // ์ค๋ฅ! ํ์
์คํฌ๋ฆฝํธ๊ฐ ์๋ํฐ์์ ์ด๋ฅผ ํ์ํฉ๋๋ค.
// 'string' ํ์
์ ์ธ์๋ 'number' ํ์
์ ๋งค๊ฐ๋ณ์์ ํ ๋นํ ์ ์์ต๋๋ค.
๋ชจ๋ ๊ตฌ์ฑ: ํ์ ์คํฌ๋ฆฝํธ์ ๋์์ `tsconfig.json` ํ์ผ์ ์ํด ์ ์ด๋ฉ๋๋ค. ๋ชจ๋์ ๋ํ ์ฃผ์ ์ค์ ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค:
"module": "esnext": ํ์ ์คํฌ๋ฆฝํธ์๊ฒ ์ต์ ECMAScript ๋ชจ๋ ๊ตฌ๋ฌธ์ ์ฌ์ฉํ๋๋ก ์ง์ํฉ๋๋ค. ๋ค๋ฅธ ์ต์ ์ผ๋ก๋ `"commonjs"`, `"amd"` ๋ฑ์ด ์์ต๋๋ค."moduleResolution": "node": ๊ฐ์ฅ ์ผ๋ฐ์ ์ธ ์ค์ ์ ๋๋ค. ์ปดํ์ผ๋ฌ์๊ฒ Node.js์ ํด์ ์๊ณ ๋ฆฌ์ฆ์ ๋ชจ๋ฐฉํ์ฌ ๋ชจ๋์ ์ฐพ๋ ๋ฐฉ๋ฒ์ ์๋ ค์ค๋๋ค(`node_modules` ํ์ธ ๋ฑ)."strict": true: ๋ง์ ์ผ๋ฐ์ ์ธ ์ค๋ฅ๋ฅผ ๋ฐฉ์งํ๋ ๊ด๋ฒ์ํ ์๊ฒฉํ ํ์ ์ฒดํน ๋์์ ํ์ฑํํ๋ ๋งค์ฐ ๊ถ์ฅ๋๋ ์ค์ ์ ๋๋ค.
JSDoc: ํธ๋์คํ์ผ ์์ด ํ์ ์์ ์ฑ ํ๋ณดํ๊ธฐ
์๋ก์ด ์ธ์ด๋ ๋น๋ ๋จ๊ณ๋ฅผ ์ฑํํ ์ค๋น๊ฐ ๋์ง ์์ ํ์ ์ํด, JSDoc์ ์๋ฐ์คํฌ๋ฆฝํธ ์ฃผ์ ๋ด์ ์ง์ ํ์ ์ด๋ ธํ ์ด์ ์ ์ถ๊ฐํ ์ ์๋ ๋ฐฉ๋ฒ์ ์ ๊ณตํฉ๋๋ค. Visual Studio Code์ ๊ฐ์ ์ต์ ์ฝ๋ ์๋ํฐ์ ํ์ ์คํฌ๋ฆฝํธ ์ปดํ์ผ๋ฌ ์์ฒด์ ๊ฐ์ ๋๊ตฌ๋ ์ด๋ฌํ JSDoc ์ฃผ์์ ์ฝ์ด ์ผ๋ฐ ์๋ฐ์คํฌ๋ฆฝํธ ํ์ผ์ ๋ํ ํ์ ์ฒดํน๊ณผ ์๋ ์์ฑ์ ์ ๊ณตํ ์ ์์ต๋๋ค.
์๋ ๋ฐฉ์: `@param`, `@returns`, `@type`๊ณผ ๊ฐ์ ํ๊ทธ๊ฐ ์๋ ํน์ ์ฃผ์ ๋ธ๋ก(`/** ... */`)์ ์ฌ์ฉํ์ฌ ์ฝ๋๋ฅผ ์ค๋ช ํฉ๋๋ค.
๋ชจ๋ ํ์ดํ ์์:
// services/user-service.js
/**
* ์์คํ
์ ์ฌ์ฉ์๋ฅผ ๋ํ๋
๋๋ค.
* @typedef {Object} User
* @property {number} id - ๊ณ ์ ์ฌ์ฉ์ ์๋ณ์.
* @property {string} name - ์ฌ์ฉ์์ ์ ์ฒด ์ด๋ฆ.
* @property {string} email - ์ฌ์ฉ์์ ์ด๋ฉ์ผ ์ฃผ์.
* @property {boolean} [isActive] - ํ์ฑ ์ํ์ ๋ํ ์ ํ์ ํ๋๊ทธ.
*/
/**
* ID๋ก ์ฌ์ฉ์๋ฅผ ๊ฐ์ ธ์ต๋๋ค.
* @param {number} userId - ๊ฐ์ ธ์ฌ ์ฌ์ฉ์์ ID.
* @returns {Promise
์ด ๊ฒ์ฌ๋ฅผ ํ์ฑํํ๋ ค๋ฉด ํ๋ก์ ํธ ๋ฃจํธ์ ๋ค์ ๋ด์ฉ์ผ๋ก `jsconfig.json` ํ์ผ์ ๋ง๋ค ์ ์์ต๋๋ค:
{
"compilerOptions": {
"checkJs": true,
"target": "es2020",
"module": "esnext"
},
"include": ["**/*.js"]
}
JSDoc์ ๊ธฐ์กด ์๋ฐ์คํฌ๋ฆฝํธ ์ฝ๋๋ฒ ์ด์ค์ ํ์ ์์ ์ฑ์ ๋์ ํ๋ ํ๋ฅญํ๊ณ ๋ง์ฐฐ์ด ์ ์ ๋ฐฉ๋ฒ์ผ๋ก, ๋ ๊ฑฐ์ ํ๋ก์ ํธ๋ ํ์ค ์๋ฐ์คํฌ๋ฆฝํธ์ ๋ ๊ฐ๊น๊ฒ ๋จธ๋ฌผ๊ณ ์ถ์ดํ๋ ํ์๊ฒ ํ๋ฅญํ ์ ํ์ ๋๋ค.
Flow: ์ญ์ฌ์ ๊ด์ ๊ณผ ํ์ ์ฌ์ฉ ์ฌ๋ก
ํ์ด์ค๋ถ์์ ๊ฐ๋ฐํ Flow๋ ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์ํ ๋ ๋ค๋ฅธ ์ ์ ํ์ ์ฒด์ปค์ ๋๋ค. ์ด๊ธฐ์๋ ํ์ ์คํฌ๋ฆฝํธ์ ๊ฐ๋ ฅํ ๊ฒฝ์์์์ต๋๋ค. ๋น๋ก ํ์ ์คํฌ๋ฆฝํธ๊ฐ ๊ธ๋ก๋ฒ ๊ฐ๋ฐ์ ์ปค๋ฎค๋ํฐ์ ๋ง์์ ๋๋ถ๋ถ ์ฌ๋ก์ก์์ง๋ง, Flow๋ ์ฌ์ ํ ์ผ๋ถ ์กฐ์ง ๋ด์์, ํนํ ๊น์ ๋ฟ๋ฆฌ๋ฅผ ๋๊ณ ์๋ ๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ ์ํ๊ณ์์ ํ๋ฐํ ๊ฐ๋ฐ๋๊ณ ์ฌ์ฉ๋ฉ๋๋ค.
Flow๋ ํ์ ์คํฌ๋ฆฝํธ์ ๋งค์ฐ ์ ์ฌํ ๊ตฌ๋ฌธ์ผ๋ก ํ์ ์ด๋ ธํ ์ด์ ์ ์ถ๊ฐํ๊ฑฐ๋ ์ฝ๋์์ ํ์ ์ ์ถ๋ก ํ์ฌ ์๋ํฉ๋๋ค. ํด๋น ํ์ผ์ ๋ํด ํ์ฑํ๋๋ ค๋ฉด ํ์ผ ์๋จ์ `// @flow` ์ฃผ์์ด ํ์ํฉ๋๋ค.
์ฌ์ ํ ์ ๋ฅํ ๋๊ตฌ์ด์ง๋ง, ์๋ก์ด ํ๋ก์ ํธ๋ ๊ฐ์ฅ ํฐ ์ปค๋ฎค๋ํฐ ์ง์, ๋ฌธ์ ๋ฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ํ์ ์ ์๋ฅผ ์ฐพ๋ ํ์๊ฒ๋ ์ค๋๋ ์ผ๋ฐ์ ์ผ๋ก ํ์ ์คํฌ๋ฆฝํธ๊ฐ ๊ถ์ฅ๋๋ ์ ํ์ ๋๋ค.
์ค์ฉ์ ์ธ ์ฌ์ธต ๋ถ์: ์ ์ ํ์ ์ฒดํน์ ์ํ ํ๋ก์ ํธ ๊ตฌ์ฑํ๊ธฐ
์ด๋ก ์์ ์ค์ฒ์ผ๋ก ๋์ด๊ฐ ๋ณด๊ฒ ์ต๋๋ค. ๊ฒฌ๊ณ ํ ๋ชจ๋ ํ์ ์ฒดํน์ ์ํด ํ๋ก์ ํธ๋ฅผ ์ค์ ํ๋ ๋ฐฉ๋ฒ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
ํ์ ์คํฌ๋ฆฝํธ ํ๋ก์ ํธ ์ฒ์๋ถํฐ ์ค์ ํ๊ธฐ
์ด๊ฒ์ ์๋ก์ด ํ๋ก์ ํธ๋ ์ฃผ์ ๋ฆฌํฉํ ๋ง์ ์ํ ๊ฒฝ๋ก์ ๋๋ค.
1๋จ๊ณ: ํ๋ก์ ํธ ์ด๊ธฐํ ๋ฐ ์์กด์ฑ ์ค์น
์ ํ๋ก์ ํธ ํด๋์์ ํฐ๋ฏธ๋์ ์ด๊ณ ๋ค์์ ์คํํฉ๋๋ค:
npm init -y
npm install typescript --save-dev
2๋จ๊ณ: `tsconfig.json` ์์ฑ
๊ถ์ฅ ๊ธฐ๋ณธ๊ฐ์ผ๋ก ๊ตฌ์ฑ ํ์ผ์ ์์ฑํฉ๋๋ค:
npx tsc --init
3๋จ๊ณ: ํ๋ ํ๋ก์ ํธ๋ฅผ ์ํ `tsconfig.json` ๊ตฌ์ฑ
์์ฑ๋ `tsconfig.json`์ ์ด๊ณ ์์ ํฉ๋๋ค. ๋ค์์ ES ๋ชจ๋์ ์ฌ์ฉํ๋ ํ๋ ์น ๋๋ Node.js ํ๋ก์ ํธ๋ฅผ ์ํ ๊ฒฌ๊ณ ํ ์์์ ์ ๋๋ค:
{
"compilerOptions": {
/* ํ์
์ฒดํน */
"strict": true, // ๋ชจ๋ ์๊ฒฉํ ํ์
์ฒดํน ์ต์
์ ํ์ฑํํฉ๋๋ค.
"noImplicitAny": true, // ์์์ ์ผ๋ก 'any' ํ์
์ ๊ฐ์ง๋ ํํ์ ๋ฐ ์ ์ธ์ ๋ํด ์ค๋ฅ๋ฅผ ๋ฐ์์ํต๋๋ค.
"strictNullChecks": true, // ์๊ฒฉํ null ๊ฒ์ฌ๋ฅผ ํ์ฑํํฉ๋๋ค.
/* ๋ชจ๋ */
"module": "esnext", // ๋ชจ๋ ์ฝ๋ ์์ฑ์ ์ง์ ํฉ๋๋ค.
"moduleResolution": "node", // Node.js ์คํ์ผ์ ์ฌ์ฉํ์ฌ ๋ชจ๋์ ํด์ํฉ๋๋ค.
"esModuleInterop": true, // CommonJS ๋ชจ๋๊ณผ์ ํธํ์ฑ์ ํ์ฑํํฉ๋๋ค.
"baseUrl": "./src", // ์๋์ ์ด์ง ์์ ๋ชจ๋ ์ด๋ฆ์ ํด์ํ ๊ธฐ๋ณธ ๋๋ ํ ๋ฆฌ์
๋๋ค.
"paths": { // ๋ ๊น๋ํ import๋ฅผ ์ํด ๋ชจ๋ ๋ณ์นญ์ ์์ฑํฉ๋๋ค.
"@components/*": ["components/*"],
"@services/*": ["services/*"]
},
/* ์๋ฐ์คํฌ๋ฆฝํธ ์ง์ */
"allowJs": true, // ์๋ฐ์คํฌ๋ฆฝํธ ํ์ผ์ ์ปดํ์ผ์ ํ์ฉํฉ๋๋ค.
/* ์ถ๋ ฅ */
"outDir": "./dist", // ์ถ๋ ฅ ๊ตฌ์กฐ๋ฅผ ํด๋น ๋๋ ํ ๋ฆฌ๋ก ๋ฆฌ๋๋ ์
ํฉ๋๋ค.
"sourceMap": true, // ํด๋นํ๋ '.map' ํ์ผ์ ์์ฑํฉ๋๋ค.
/* ์ธ์ด ๋ฐ ํ๊ฒฝ */
"target": "es2020", // ์ถ๋ ฅ๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ์ธ์ด ๋ฒ์ ์ ์ค์ ํฉ๋๋ค.
"lib": ["es2020", "dom"] // ๋ฒ๋ค ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ ์ธ ํ์ผ ์ธํธ๋ฅผ ์ง์ ํฉ๋๋ค.
},
"include": ["src/**/*"], // 'src' ํด๋์ ํ์ผ๋ง ์ปดํ์ผํฉ๋๋ค.
"exclude": ["node_modules"]
}
์ด ๊ตฌ์ฑ์ ์๊ฒฉํ ํ์ดํ์ ๊ฐ์ ํ๊ณ , ํ๋์ ์ธ ๋ชจ๋ ํด์์ ์ค์ ํ๋ฉฐ, ์ค๋๋ ํจํค์ง์์ ์ํธ ์ด์ฉ์ฑ์ ํ์ฑํํ๊ณ , ํธ๋ฆฌํ import ๋ณ์นญ(์: `import MyComponent from '@components/MyComponent'`)๊น์ง ์์ฑํฉ๋๋ค.
๋ชจ๋ ํ์ ์ฒดํน์ ์ผ๋ฐ์ ์ธ ํจํด๊ณผ ๊ณผ์
์ ์ ๋ถ์์ ํตํฉํ๋ฉด์ ๋ช ๊ฐ์ง ์ผ๋ฐ์ ์ธ ์๋๋ฆฌ์ค์ ์ง๋ฉดํ๊ฒ ๋ ๊ฒ์ ๋๋ค.
๋์ ์ํฌํธ(`import()`) ์ฒ๋ฆฌํ๊ธฐ
๋์ ์ํฌํธ๋ ๋ชจ๋์ ํ์ํ ๋ ๋ก๋ํ ์ ์๊ฒ ํด์ฃผ๋ ํ๋ ์๋ฐ์คํฌ๋ฆฝํธ ๊ธฐ๋ฅ์ผ๋ก, ์ฝ๋ ๋ถํ ๋ฐ ์ด๊ธฐ ํ์ด์ง ๋ก๋ ์๊ฐ ๊ฐ์ ์ ํ์ํฉ๋๋ค. ํ์ ์คํฌ๋ฆฝํธ์ ๊ฐ์ ์ ์ ํ์ ์ฒด์ปค๋ ์ด๋ฅผ ์ฒ๋ฆฌํ ๋งํผ ๋๋ํฉ๋๋ค.
// utils/formatter.ts
export function formatDate(date: Date): string {
return date.toLocaleDateString('en-US');
}
// main.ts
async function showDate() {
if (userNeedsDate) {
const formatterModule = await import('./utils/formatter'); // ํ์
์คํฌ๋ฆฝํธ๊ฐ formatterModule์ ํ์
์ ์ถ๋ก ํฉ๋๋ค
const formatted = formatterModule.formatDate(new Date());
console.log(formatted);
}
}
ํ์ ์คํฌ๋ฆฝํธ๋ `import()` ํํ์์ด ๋ชจ๋์ ๋ค์์คํ์ด์ค๋ก ํด์๋๋ Promise๋ฅผ ๋ฐํํ๋ค๋ ๊ฒ์ ์ดํดํฉ๋๋ค. `formatterModule`์ ์ ํํ๊ฒ ํ์ดํํ๊ณ ํด๋น export์ ๋ํ ์๋ ์์ฑ์ ์ ๊ณตํฉ๋๋ค.
์๋ํํฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ํ์ดํ (DefinitelyTyped)
๊ฐ์ฅ ํฐ ๊ณผ์ ์ค ํ๋๋ NPM์ ์๋ ๋ฐฉ๋ํ ์๋ฐ์คํฌ๋ฆฝํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ํ๊ณ์ ์ํธ ์์ฉํ๋ ๊ฒ์ ๋๋ค. ๋ง์ ์ธ๊ธฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๊ฐ ์ด์ ํ์ ์คํฌ๋ฆฝํธ๋ก ์์ฑ๋์ด ์์ฒด ํ์ ์ ์๋ฅผ ๋ฒ๋ค๋ก ์ ๊ณตํฉ๋๋ค. ๊ทธ๋ ์ง ์์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ํด, ๊ธ๋ก๋ฒ ๊ฐ๋ฐ์ ์ปค๋ฎค๋ํฐ๋ DefinitelyTyped๋ผ๋ ๊ณ ํ์ง ํ์ ์ ์์ ๊ฑฐ๋ํ ์ ์ฅ์๋ฅผ ์ ์ง ๊ด๋ฆฌํฉ๋๋ค.
์ด๋ฌํ ํ์ ์ ๊ฐ๋ฐ ์์กด์ฑ์ผ๋ก ์ค์นํ ์ ์์ต๋๋ค. ์๋ฅผ ๋ค์ด, ์ธ๊ธฐ ์๋ `lodash` ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ํ์ ๊ณผ ํจ๊ป ์ฌ์ฉํ๋ ค๋ฉด:
npm install lodash
npm install @types/lodash --save-dev
์ดํ, ํ์ ์คํฌ๋ฆฝํธ ํ์ผ์ `lodash`๋ฅผ ๊ฐ์ ธ์ค๋ฉด ๋ชจ๋ ๊ธฐ๋ฅ์ ๋ํ ์ ์ฒด ํ์ ์ฒดํน๊ณผ ์๋ ์์ฑ์ ์ป๊ฒ ๋ฉ๋๋ค. ์ด๋ ์ธ๋ถ ์ฝ๋๋ก ์์ ํ ๋ ํ๋๋ฅผ ๋ฐ๊พธ๋ ์์์ ๋๋ค.
๊ฒฉ์ฐจ ํด์: ES ๋ชจ๋๊ณผ CommonJS ๊ฐ์ ์ํธ ์ด์ฉ์ฑ
ES ๋ชจ๋(`import`/`export`)์ ์ฌ์ฉํ์ง๋ง CommonJS(`require`/`module.exports`)๋ก ์์ฑ๋ ์์กด์ฑ์ ์ฌ์ฉํด์ผ ํ๋ ํ๋ก์ ํธ์ ์ข ์ข ์ฒํ๊ฒ ๋ ๊ฒ์ ๋๋ค. ์ด๋ ํนํ ๊ธฐ๋ณธ ๋ด๋ณด๋ด๊ธฐ(default exports)์ ๊ด๋ จํ์ฌ ํผ๋์ ์ผ๊ธฐํ ์ ์์ต๋๋ค.
`tsconfig.json`์ `"esModuleInterop": true` ํ๋๊ทธ๋ ์ฌ๊ธฐ์ ์ต๊ณ ์ ์น๊ตฌ์ ๋๋ค. ์ด๋ CJS ๋ชจ๋์ ๋ํ ํฉ์ฑ ๊ธฐ๋ณธ ๋ด๋ณด๋ด๊ธฐ๋ฅผ ์์ฑํ์ฌ ๊น๋ํ๊ณ ํ์ค์ ์ธ import ๊ตฌ๋ฌธ์ ์ฌ์ฉํ ์ ์๊ฒ ํด์ค๋๋ค:
// esModuleInterop ์์ด๋ ์ด๋ ๊ฒ ํด์ผ ํ ์ ์์ต๋๋ค:
import * as moment from 'moment';
// esModuleInterop: true๊ฐ ์์ผ๋ฉด ์ด๋ ๊ฒ ํ ์ ์์ต๋๋ค:
import moment from 'moment';
์ด ํ๋๊ทธ๋ฅผ ํ์ฑํํ๋ ๊ฒ์ ์ด๋ฌํ ๋ชจ๋ ํ์์ ๋ถ์ผ์น๋ฅผ ์ํํ๊ธฐ ์ํด ๋ชจ๋ ํ๋ ํ๋ก์ ํธ์ ๋งค์ฐ ๊ถ์ฅ๋ฉ๋๋ค.
ํ์ ์ฒดํน์ ๋์ด์๋ ์ ์ ๋ถ์: ๋ฆฐํฐ์ ํฌ๋งทํฐ
ํ์ ์ฒดํน์ด ๊ธฐ๋ณธ์ด์ง๋ง, ์์ ํ ์ ์ ๋ถ์ ์ ๋ต์๋ ํ์ ์ฒด์ปค์ ์กฐํ๋กญ๊ฒ ์๋ํ๋ ๋ค๋ฅธ ๋๊ตฌ๋ค๋ ํฌํจ๋ฉ๋๋ค.
ESLint์ TypeScript-ESLint ํ๋ฌ๊ทธ์ธ
ESLint๋ ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์ํ ํ๋ฌ๊ทธํ ๋ฆฐํ ์ ํธ๋ฆฌํฐ์ ๋๋ค. ํ์ ์ค๋ฅ๋ฅผ ๋์ด์ ์คํ์ผ ๊ท์น์ ๊ฐ์ ํ๊ณ , ์ํฐ ํจํด์ ์ฐพ์ผ๋ฉฐ, ํ์ ์์คํ ์ด ๋์น ์ ์๋ ๋ ผ๋ฆฌ์ ์ค๋ฅ๋ฅผ ์ก์๋ ๋๋ค. `typescript-eslint` ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉํ๋ฉด ํ์ ์ ๋ณด๋ฅผ ํ์ฉํ์ฌ ํจ์ฌ ๋ ๊ฐ๋ ฅํ ๊ฒ์ฌ๋ฅผ ์ํํ ์ ์์ต๋๋ค.
์๋ฅผ ๋ค์ด, ESLint๋ฅผ ๋ค์๊ณผ ๊ฐ์ด ๊ตฌ์ฑํ ์ ์์ต๋๋ค:
- ์ผ๊ด๋ import ์์ ๊ฐ์ (`import/order` ๊ท์น).
- ์์ฑ๋์์ง๋ง ์ฒ๋ฆฌ๋์ง ์์ `Promise`์ ๋ํด ๊ฒฝ๊ณ (์: await๋์ง ์์ ๊ฒฝ์ฐ).
- `any` ํ์ ์ฌ์ฉ์ ๋ฐฉ์งํ์ฌ ๊ฐ๋ฐ์๊ฐ ๋ ๋ช ์์ ์ด ๋๋๋ก ๊ฐ์ .
์ผ๊ด๋ ์ฝ๋ ์คํ์ผ์ ์ํ Prettier
๊ธ๋ก๋ฒ ํ์์๋ ๊ฐ๋ฐ์๋ค์ด ์ฝ๋ ํฌ๋งทํ (ํญ ๋ ๊ณต๋ฐฑ, ๋ฐ์ดํ ์คํ์ผ ๋ฑ)์ ๋ํด ๋ค๋ฅธ ์ ํธ๋๋ฅผ ๊ฐ์ง ์ ์์ต๋๋ค. ์ด๋ฌํ ์ฌ์ํ ์ฐจ์ด๋ ์ฝ๋ ๋ฆฌ๋ทฐ์์ ๋ ธ์ด์ฆ๋ฅผ ์์ฑํ ์ ์์ต๋๋ค. Prettier๋ ์ ์ฒด ์ฝ๋๋ฒ ์ด์ค๋ฅผ ์ผ๊ด๋ ์คํ์ผ๋ก ์๋ ์ฌํฌ๋งทํ์ฌ ์ด ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ๋ ๋ ๋จ์ ์ธ ์ฝ๋ ํฌ๋งทํฐ์ ๋๋ค. ์ํฌํ๋ก์ฐ(์: ์๋ํฐ์์ ์ ์ฅ ์ ๋๋ ์ฌ์ ์ปค๋ฐ ํ )์ ํตํฉํจ์ผ๋ก์จ ์คํ์ผ์ ๋ํ ๋ชจ๋ ๋ ผ์์ ์์ ๊ณ ๋ชจ๋ ์ฌ๋์ด ์ฝ๋๋ฒ ์ด์ค๋ฅผ ๊ท ์ผํ๊ฒ ์ฝ์ ์ ์๋๋ก ๋ณด์ฅํฉ๋๋ค.
๋น์ฆ๋์ค ์ฌ๋ก: ์ ๊ธ๋ก๋ฒ ํ์ ์ํด ์ ์ ๋ถ์์ ํฌ์ํด์ผ ํ๋๊ฐ?
์ ์ ๋ถ์์ ์ฑํํ๋ ๊ฒ์ ๋จ์ง ๊ธฐ์ ์ ์ธ ๊ฒฐ์ ์ด ์๋๋ผ ๋ช ํํ ํฌ์ ์์ต๋ฅ ์ ๊ฐ์ง ์ ๋ต์ ์ธ ๋น์ฆ๋์ค ๊ฒฐ์ ์ ๋๋ค.
- ๋ฒ๊ทธ ๊ฐ์ ๋ฐ ์ ์ง๋ณด์ ๋น์ฉ ์ ๊ฐ: ๊ฐ๋ฐ ์ค์ ์ค๋ฅ๋ฅผ ์ก๋ ๊ฒ์ด ํ๋ก๋์ ์์ ์์ ํ๋ ๊ฒ๋ณด๋ค ๊ธฐํ๊ธ์์ ์ผ๋ก ์ ๋ ดํฉ๋๋ค. ์์ ์ ์ด๊ณ ์์ธก ๊ฐ๋ฅํ ์ฝ๋๋ฒ ์ด์ค๋ ๋๋ฒ๊น ๋ฐ ์ ์ง๋ณด์์ ๋ ์ ์ ์๊ฐ์ด ํ์ํฉ๋๋ค.
- ๊ฐ๋ฐ์ ์จ๋ณด๋ฉ ๋ฐ ํ์ ๊ฐ์ : ์ง๋ฆฌ์ ์์น์ ๊ด๊ณ์์ด ์๋ก์ด ํ ๊ตฌ์ฑ์์ ํ์ ์ด ์์ฒด ๋ฌธ์ํ ์ฝ๋๋ก ์์ฉํ๊ธฐ ๋๋ฌธ์ ์ฝ๋๋ฒ ์ด์ค๋ฅผ ๋ ๋นจ๋ฆฌ ์ดํดํ ์ ์์ต๋๋ค. ์ด๋ ์์ฐ์ฑ์ ๋๋ฌํ๋ ์๊ฐ์ ๋จ์ถ์ํต๋๋ค.
- ์ฝ๋๋ฒ ์ด์ค ํ์ฅ์ฑ ํฅ์: ์ ํ๋ฆฌ์ผ์ด์ ๊ณผ ํ์ด ์ฑ์ฅํจ์ ๋ฐ๋ผ ์ ์ ๋ถ์์ ๋ณต์ก์ฑ์ ๊ด๋ฆฌํ๋ ๋ฐ ํ์ํ ๊ตฌ์กฐ์ ๋ฌด๊ฒฐ์ฑ์ ์ ๊ณตํฉ๋๋ค. ๋๊ท๋ชจ ๋ฆฌํฉํ ๋ง์ ์คํ ๊ฐ๋ฅํ๊ณ ์์ ํ๊ฒ ๋ง๋ญ๋๋ค.
- '๋จ์ผ ์ง์ค ๊ณต๊ธ์' ์์ฑ: API ์๋ต์ด๋ ๊ณต์ ๋ฐ์ดํฐ ๋ชจ๋ธ์ ๋ํ ํ์ ์ ์๋ ํ๋ก ํธ์๋์ ๋ฐฑ์๋ ํ ๋ชจ๋์๊ฒ ๋จ์ผ ์ง์ค ๊ณต๊ธ์์ด ๋์ด ํตํฉ ์ค๋ฅ์ ์คํด๋ฅผ ์ค์ ๋๋ค.
๊ฒฐ๋ก : ๊ฒฌ๊ณ ํ๊ณ ํ์ฅ ๊ฐ๋ฅํ ์๋ฐ์คํฌ๋ฆฝํธ ์ ํ๋ฆฌ์ผ์ด์ ๊ตฌ์ถํ๊ธฐ
์๋ฐ์คํฌ๋ฆฝํธ์ ๋์ ์ด๊ณ ์ ์ฐํ ํน์ฑ์ ๊ฐ์ฅ ํฐ ๊ฐ์ ์ค ํ๋์ด์ง๋ง, ์์ ์ฑ๊ณผ ์์ธก ๊ฐ๋ฅ์ฑ์ ํฌ์ํ ํ์๋ ์์ต๋๋ค. ๋ชจ๋ ํ์ ์ฒดํน์ ์ํด ์ ์ ๋ถ์์ ์์ฉํจ์ผ๋ก์จ, ๊ฐ๋ฐ์ ๊ฒฝํ๊ณผ ์ต์ข ์ ํ์ ํ์ง์ ๋ณํ์ํค๋ ๊ฐ๋ ฅํ ์์ ๋ง์ ๋์ ํ๊ฒ ๋ฉ๋๋ค.
ํ๋์ ์ ์ธ๊ณ์ ์ผ๋ก ๋ถ์ฐ๋ ํ์๊ฒ ํ์ ์คํฌ๋ฆฝํธ์ JSDoc๊ณผ ๊ฐ์ ๋๊ตฌ๋ ๋ ์ด์ ์ฌ์น๊ฐ ์๋๋ผ ํ์ํ์ ๋๋ค. ์ด๋ค์ ๋ฌธํ์ , ์ธ์ด์ ์ฅ๋ฒฝ์ ์ด์ํ๋ ๋ฐ์ดํฐ ๊ตฌ์กฐ์ ๊ณตํต ์ธ์ด๋ฅผ ์ ๊ณตํ์ฌ ๊ฐ๋ฐ์๋ค์ด ๋ณต์กํ๊ณ ํ์ฅ ๊ฐ๋ฅํ๋ฉฐ ๊ฒฌ๊ณ ํ ์ ํ๋ฆฌ์ผ์ด์ ์ ์์ ๊ฐ ์๊ฒ ๊ตฌ์ถํ ์ ์๋๋ก ํฉ๋๋ค. ๊ฒฌ๊ณ ํ ์ ์ ๋ถ์ ์ค์ ์ ํฌ์ํจ์ผ๋ก์จ, ๋น์ ์ ๋ ๋์ ์ฝ๋๋ฅผ ์์ฑํ๋ ๊ฒ๋ฟ๋ง ์๋๋ผ ๋ ํจ์จ์ ์ด๊ณ ํ๋ ฅ์ ์ด๋ฉฐ ์ฑ๊ณต์ ์ธ ์์ง๋์ด๋ง ๋ฌธํ๋ฅผ ๊ตฌ์ถํ๋ ๊ฒ์ ๋๋ค.