FSD : Public API

안녕하세요! 오늘은 FSD의 꽃이자, 개발자들의 약속인 **Public API(공개 API)**에 대해 설명해 드릴게요.

이름이 좀 어렵죠? 하지만 개념은 **"학교 매점의 키오스크(주문 기계)"**나 **"식당의 메뉴판"**과 똑같습니다.

---

🍔 햄버거 가게로 이해하는 Public API

여러분이 햄버거 가게에 갔다고 상상해 보세요.

1. ❌ Public API가 없는 세상 (혼란의 도가니)

• 여러분이 햄버거를 먹으려고 주방으로 직접 들어갑니다.
• 냉장고를 열어서 패티를 꺼내고, 소스 통을 찾아서 뿌립니다.
• 문제점:
  • 만약 알바생이 "케첩 위치를 왼쪽 선반에서 오른쪽 선반으로 옮기면" 어떻게 될까요?
  • 여러분은 케첩을 못 찾아서 햄버거를 못 먹게 됩니다. (에러 발생! 💥)
  • 주방 구조가 바뀔 때마다 손님들이 다 헤매게 되죠.

2. ✅ Public API가 있는 세상 (FSD의 방식)

• 여러분은 주방에 들어가지 않습니다. 대신 **카운터(메뉴판)**에서 주문만 합니다.
• "불고기버거 하나 주세요!"라고 말하면 끝입니다.
• 장점:
  • 알바생이 주방 안에서 케첩을 어디에 두든, 패티를 어떻게 굽든 여러분은 신경 쓸 필요가 없습니다.
  • 주방 내부가 아무리 바뀌어도, **카운터(접점)**만 그대로면 햄버거는 정상적으로 나옵니다.

여기서 **"카운터(메뉴판)"**가 바로 Public API입니다.

---

📜 코드에서는 어떻게 생겼나요? (index.ts)

FSD에서는 각 폴더(Slice)마다 index.ts라는 파일을 입구에 딱 하나 둡니다. 이 파일이 바로 카운터 알바생입니다.

📁 폴더 구조 (예: 로그인 기능)

code Text

downloadcontent_copy

expand_less

    features/
  └── auth/ (로그인 기능)
       ├── ui/             (화면)
       │    └── LoginButton.tsx
       ├── model/          (로직)
       │    └── logic.ts
       ├── lib/            (도구)
       │    └── helper.ts
       └── index.ts        ⭐️ 여기가 바로 Public API (카운터)!!
  

❌ 나쁜 사용법 (주방 침입)

다른 파일에서 LoginButton을 쓰고 싶다고 해서, 깊숙한 곳까지 직접 찾아들어가면 안 됩니다.

code JavaScript

downloadcontent_copy

expand_less

    // 옆 동네 장바구니 기능에서...
import { LoginButton } from 'features/auth/ui/LoginButton'; // 😱 땡!! 주방 침입!
  

• 이유: 나중에 ui 폴더 이름을 components로 바꾸면 이 코드는 다 고장 납니다.

✅ 좋은 사용법 (카운터 주문)

오직 index.ts를 통해서만 가져옵니다.

code JavaScript

downloadcontent_copy

expand_less

    // index.ts (카운터 알바생)
export { LoginButton } from './ui/LoginButton'; // "LoginButton은 주문 가능합니다~"

// ---------------------------------------------------

// 옆 동네 장바구니 기능에서...
import { LoginButton } from 'features/auth'; // 😍 딩동댕!! 카운터 이용!
  

• 이유: 이제 auth 폴더 내부를 어떻게 뒤집어 엎든, 밖에서 부르는 코드는 features/auth로 똑같기 때문에 에러가 안 납니다.

---

🛡️ 왜 이 규칙이 중요한가요? (캡슐화)

이것을 전문 용어로 **"캡슐화(Encapsulation)"**라고 합니다. 알약을 생각해보세요.

• 알약 내부 (Internal): 쓴 가루약, 화학 성분들이 들어있습니다. (복잡한 로직)
• 알약 껍질 (Public API): 매끈하고 먹기 좋습니다. (사용법)

우리는 알약 안에 뭐가 들었는지 분해해보지 않고 그냥 삼키면 병이 낫습니다.
코드도 마찬가지입니다. **"남들에게 보여줄 것(index.ts에 적은 것)"**과 **"나만 알고 있을 비밀(내부 파일들)"**을 철저히 구분해야 합니다.

1. 안전함: 내부 코드를 수정해도 다른 파일들이 고장 나지 않습니다.
2. 깔끔함: index.ts만 열어보면 "아, 이 폴더는 이런 기능들을 제공하는구나"라고 바로 알 수 있습니다. 메뉴판이니까요!

📝 고등학생을 위한 세 줄 요약

1. 남의 폴더 속사정(내부 파일)까지 알려고 하지 마라. (주방에 들어가지 마라!)
2. 모든 거래는 index.ts라는 대표 창구(카운터)를 통해서만 해라.
3. 이렇게 해야 나중에 **내부 수리(리팩토링)**를 해도 가게 문을 안 닫을 수 있다.

* 본 문서는 google ai studio 로 생성되었습니다. ( 원문 : https://feature-sliced.github.io/documentation/docs/reference/public-api )