Skip to content

Commit 3c405bb

Browse files
authored
docs: Standardize technical terms to English in guides/examples Korean documentation (#794)
* docs: Standardize technical terms to English in guides/examples Korean documentation * fix: reflecting feedback
1 parent 78c412e commit 3c405bb

File tree

3 files changed

+72
-72
lines changed

3 files changed

+72
-72
lines changed

โ€Ži18n/kr/docusaurus-plugin-content-docs/current/guides/examples/auth.mdโ€Ž

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,11 @@ sidebar_label: ์ธ์ฆ
1313

1414
## ์‚ฌ์šฉ์ž ๋กœ๊ทธ์ธ ์ •๋ณด ์ˆ˜์ง‘ ๋ฐฉ๋ฒ•
1515

16-
์•ฑ์—์„œ ์‚ฌ์šฉ์ž๋กœ๋ถ€ํ„ฐ ๋กœ๊ทธ์ธ ์ •๋ณด๋ฅผ ์ˆ˜์ง‘ํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. ๋งŒ์•ฝ์— OAuth๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐ, OAuth ์ œ๊ณต์ž์˜ ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ [3๋‹จ๊ณ„](#how-to-store-the-token-for-authenticated-requests)๋กœ ๋ฐ”๋กœ ๋„˜์–ด๊ฐˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
16+
์•ฑ์—์„œ ์‚ฌ์šฉ์ž๋กœ๋ถ€ํ„ฐ ๋กœ๊ทธ์ธ ์ •๋ณด๋ฅผ ์ˆ˜์ง‘ํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. ๋งŒ์•ฝ์— OAuth๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐ, OAuth ์ œ๊ณต์ž์˜ ๋กœ๊ทธ์ธ page๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ [3๋‹จ๊ณ„](#how-to-store-the-token-for-authenticated-requests)๋กœ ๋ฐ”๋กœ ๋„˜์–ด๊ฐˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
1717

18-
### ์ „์šฉ ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€ ๋งŒ๋“ค๊ธฐ
18+
### ์ „์šฉ ๋กœ๊ทธ์ธ page ๋งŒ๋“ค๊ธฐ
1919

20-
์›น์‚ฌ์ดํŠธ์—์„œ ์‚ฌ์šฉ์ž ์ด๋ฆ„๊ณผ ๋น„๋ฐ€๋ฒˆํ˜ธ๋ฅผ ์ž…๋ ฅํ•˜๋Š” ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€๋ฅผ ์ œ๊ณตํ•˜๋Š” ๊ฒƒ์ด ์ผ๋ฐ˜์ ์ž…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ํŽ˜์ด์ง€๋“ค์€ ๊ตฌ์กฐ๊ฐ€ ๋‹จ์ˆœํ•˜์—ฌ ๋ณ„๋„์˜ ๋ณต์žกํ•œ ๋ถ„ํ•ด ์ž‘์—…์ด ํ•„์š”ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋‹ค๋งŒ, ๋กœ๊ทธ์ธ๊ณผ ํšŒ์›๊ฐ€์ž… ์–‘์‹์€ ์™ธํ˜•์ด ๋น„์Šทํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ๊ฒฝ์šฐ์— ๋”ฐ๋ผ ๋‘ ์–‘์‹์„ ํ•˜๋‚˜์˜ ํŽ˜์ด์ง€์—์„œ ํ†ตํ•ฉํ•˜์—ฌ ์ œ๊ณตํ•˜๊ธฐ๋„ ํ•ฉ๋‹ˆ๋‹ค.
20+
์›น์‚ฌ์ดํŠธ์—์„œ ์‚ฌ์šฉ์ž ์ด๋ฆ„๊ณผ ๋น„๋ฐ€๋ฒˆํ˜ธ๋ฅผ ์ž…๋ ฅํ•˜๋Š” ๋กœ๊ทธ์ธ page๋ฅผ ์ œ๊ณตํ•˜๋Š” ๊ฒƒ์ด ์ผ๋ฐ˜์ ์ž…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ page๋“ค์€ ๊ตฌ์กฐ๊ฐ€ ๋‹จ์ˆœํ•˜์—ฌ ๋ณ„๋„์˜ ๋ณต์žกํ•œ ๋ถ„ํ•ด ์ž‘์—…์ด ํ•„์š”ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋‹ค๋งŒ, ๋กœ๊ทธ์ธ๊ณผ ํšŒ์›๊ฐ€์ž… ์–‘์‹์€ ์™ธํ˜•์ด ๋น„์Šทํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ๊ฒฝ์šฐ์— ๋”ฐ๋ผ ๋‘ ์–‘์‹์„ ํ•˜๋‚˜์˜ page์—์„œ ํ†ตํ•ฉํ•˜์—ฌ ์ œ๊ณตํ•˜๊ธฐ๋„ ํ•ฉ๋‹ˆ๋‹ค.
2121

2222
- ๐Ÿ“‚ pages
2323
- ๐Ÿ“‚ login
@@ -29,9 +29,9 @@ sidebar_label: ์ธ์ฆ
2929

3030
๋กœ๊ทธ์ธ๊ณผ ํšŒ์›๊ฐ€์ž… ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋ณ„๋„๋กœ ๋งŒ๋“ค๊ณ , ํ•„์š”์— ๋”ฐ๋ผ index ํŒŒ์ผ์—์„œ export ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ์ปดํฌ๋„ŒํŠธ๋“ค์€ ์‚ฌ์šฉ์ž๋กœ๋ถ€ํ„ฐ ๋กœ๊ทธ์ธ ์ •๋ณด์„ ์ž…๋ ฅ๋ฐ›๋Š” ํผ์„ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค.
3131

32-
### ๋กœ๊ทธ์ธ ๋‹ค์ด์–ผ๋กœ๊ทธ ๋งŒ๋“ค๊ธฐ
32+
### ๋กœ๊ทธ์ธ dialog ๋งŒ๋“ค๊ธฐ
3333

34-
์•ฑ์˜ ์–ด๋””์„œ๋‚˜ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๋กœ๊ทธ์ธ ๋‹ค์ด์–ผ๋กœ๊ทธ๊ฐ€ ํ•„์š”ํ•˜๋‹ค๋ฉด, ์ด ๋‹ค์ด์–ผ๋กœ๊ทธ๋ฅผ ์žฌ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•œ ์œ„์ ฏ์œผ๋กœ ๋งŒ๋“œ๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ์ด๋ ‡๊ฒŒ ํ•˜๋ฉด ๋ถˆํ•„์š”ํ•œ ์„ธ๋ถ„ํ™”๋ฅผ ํ”ผํ•˜๋ฉด์„œ๋„ ์–ด๋–ค ํŽ˜์ด์ง€์—์„œ๋‚˜ ์‰ฝ๊ฒŒ ๋กœ๊ทธ์ธ ๋‹ค์ด์–ผ๋กœ๊ทธ๋ฅผ ๋„์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
34+
์•ฑ์˜ ์–ด๋””์„œ๋‚˜ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๋กœ๊ทธ์ธ dialog๊ฐ€ ํ•„์š”ํ•˜๋‹ค๋ฉด, ์ด dialog๋ฅผ ์žฌ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•œ widget์œผ๋กœ ๋งŒ๋“œ๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ์ด๋ ‡๊ฒŒ ํ•˜๋ฉด ๋ถˆํ•„์š”ํ•œ ์„ธ๋ถ„ํ™”๋ฅผ ํ”ผํ•˜๋ฉด์„œ๋„ ์–ด๋–ค page์—์„œ๋‚˜ ์‰ฝ๊ฒŒ ๋กœ๊ทธ์ธ dialog๋ฅผ ๋„์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
3535

3636
- ๐Ÿ“‚ widgets
3737
- ๐Ÿ“‚ login-dialog
@@ -40,11 +40,11 @@ sidebar_label: ์ธ์ฆ
4040
- ๐Ÿ“„ index.ts
4141
- other widgetsโ€ฆ
4242

43-
๊ฐ€์ด๋“œ ๋‚˜๋จธ์ง€ ๋ถ€๋ถ„์€ ์ „์šฉ ํŽ˜์ด์ง€ ๋ฐฉ์‹์— ๋Œ€ํ•ด ์„ค๋ช…ํ•˜๊ณ  ์žˆ์ง€๋งŒ, ๋™์ผํ•œ ์›์น™์„ ๋กœ๊ทธ์ธ ๋‹ค์ด์–ผ๋กœ๊ทธ์—๋„ ์ ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
43+
๊ฐ€์ด๋“œ ๋‚˜๋จธ์ง€ ๋ถ€๋ถ„์€ ์ „์šฉ page ๋ฐฉ์‹์— ๋Œ€ํ•ด ์„ค๋ช…ํ•˜๊ณ  ์žˆ์ง€๋งŒ, ๋™์ผํ•œ ์›์น™์„ ๋กœ๊ทธ์ธ dialog์—๋„ ์ ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
4444

4545
### ํด๋ผ์ด์–ธํŠธ ์ธก ๊ฒ€์ฆ
4646

47-
ํŠนํžˆ ํšŒ์›๊ฐ€์ž…์˜ ๊ฒฝ์šฐ, ์‚ฌ์šฉ์ž๊ฐ€ ์ž…๋ ฅํ•œ ๋‚ด์šฉ์— ๋ฌธ์ œ๊ฐ€ ์žˆ์„ ๋•Œ ๋น ๋ฅด๊ฒŒ ํ”ผ๋“œ๋ฐฑ์„ ์ œ๊ณตํ•˜๊ธฐ ์œ„ํ•ด ํด๋ผ์ด์–ธํŠธ ์ธก ๊ฒ€์ฆ์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ์ด๋ฅผ ์œ„ํ•ด ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€์˜ `model` ์„ธ๊ทธ๋จผํŠธ์—์„œ ๊ฒ€์ฆ ๋กœ์ง์„ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด JS/TS์—์„œ๋Š” [Zod][ext-zod]์™€ ๊ฐ™์€ ์Šคํ‚ค๋งˆ ๊ฒ€์ฆ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
47+
ํŠนํžˆ ํšŒ์›๊ฐ€์ž…์˜ ๊ฒฝ์šฐ, ์‚ฌ์šฉ์ž๊ฐ€ ์ž…๋ ฅํ•œ ๋‚ด์šฉ์— ๋ฌธ์ œ๊ฐ€ ์žˆ์„ ๋•Œ ๋น ๋ฅด๊ฒŒ ํ”ผ๋“œ๋ฐฑ์„ ์ œ๊ณตํ•˜๊ธฐ ์œ„ํ•ด ํด๋ผ์ด์–ธํŠธ ์ธก ๊ฒ€์ฆ์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ์ด๋ฅผ ์œ„ํ•ด ๋กœ๊ทธ์ธ page์˜ `model` segment์—์„œ ๊ฒ€์ฆ ๋กœ์ง์„ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด JS/TS์—์„œ๋Š” [Zod][ext-zod]์™€ ๊ฐ™์€ ์Šคํ‚ค๋งˆ ๊ฒ€์ฆ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
4848

4949
```ts title="pages/login/model/registration-schema.ts"
5050
import { z } from "zod";
@@ -59,7 +59,7 @@ export const registrationData = z.object({
5959
});
6060
```
6161

62-
๊ทธ๋Ÿฐ ๋‹ค์Œ, ui ์„ธ๊ทธ๋จผํŠธ์—์„œ ์ด ์Šคํ‚ค๋งˆ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ์šฉ์ž ์ž…๋ ฅ์„ ๊ฒ€์ฆํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
62+
๊ทธ๋Ÿฐ ๋‹ค์Œ, ui segment์—์„œ ์ด ์Šคํ‚ค๋งˆ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ์šฉ์ž ์ž…๋ ฅ์„ ๊ฒ€์ฆํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
6363

6464
```tsx title="pages/login/ui/RegisterPage.tsx"
6565
import { registrationData } from "../model/registration-schema";
@@ -91,11 +91,11 @@ export function RegisterPage() {
9191

9292
## ๋กœ๊ทธ์ธ ์ •๋ณด ์ „์†ก ๋ฐฉ๋ฒ•
9393

94-
๋กœ๊ทธ์ธ ์ •๋ณด๋ฅผ ๋ฐฑ์—”๋“œ ์„œ๋ฒ„๋กœ ์ „์†กํ•˜๊ธฐ ์œ„ํ•œ ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ์ž‘์„ฑํ•˜์„ธ์š”. ์ด ํ•จ์ˆ˜๋Š” ์ƒํƒœ ๊ด€๋ฆฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋‚˜ ๋ฎคํ…Œ์ด์…˜ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ(์˜ˆ: TanStack Query)๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ˜ธ์ถœํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
94+
๋กœ๊ทธ์ธ ์ •๋ณด๋ฅผ ๋ฐฑ์—”๋“œ ์„œ๋ฒ„๋กœ ์ „์†กํ•˜๊ธฐ ์œ„ํ•œ ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ์ž‘์„ฑํ•˜์„ธ์š”. ์ด ํ•จ์ˆ˜๋Š” ์ƒํƒœ ๊ด€๋ฆฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋‚˜ TanStack Query์˜ `useMutation`๊ณผ ๊ฐ™์€ mutation ๊ธฐ๋Šฅ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ˜ธ์ถœํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
9595

9696
### ์š”์ฒญ ํ•จ์ˆ˜ ์ €์žฅ ์œ„์น˜
9797

98-
์ด ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ์ €์žฅํ•  ์ˆ˜ ์žˆ๋Š” ์œ„์น˜๋Š” ํฌ๊ฒŒ ๋‘ ๊ฐ€์ง€์ž…๋‹ˆ๋‹ค: `shared/api` ๋˜๋Š” ํŽ˜์ด์ง€์˜ `api` ์„ธ๊ทธ๋จผํŠธ์ž…๋‹ˆ๋‹ค.
98+
์ด ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ์ €์žฅํ•  ์ˆ˜ ์žˆ๋Š” ์œ„์น˜๋Š” ํฌ๊ฒŒ ๋‘ ๊ฐ€์ง€์ž…๋‹ˆ๋‹ค: `shared/api` ๋˜๋Š” page์˜ `api` segment์ž…๋‹ˆ๋‹ค.
9999

100100
#### `shared/api`์— ์ €์žฅํ•˜๊ธฐ
101101

@@ -109,7 +109,7 @@ export function RegisterPage() {
109109
- ๐Ÿ“„ client.ts
110110
- ๐Ÿ“„ index.ts
111111

112-
`๐Ÿ“„ client.ts` ํŒŒ์ผ์€ ์š”์ฒญ์„ ์ˆ˜ํ–‰ํ•˜๋Š” ์›์‹œ ํ•จ์ˆ˜(์˜ˆ: `fetch()`)์— ๋Œ€ํ•œ ๋ž˜ํผ๋ฅผ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. ์ด ๋ž˜ํผ๋Š” ๋ฐฑ์—”๋“œ์˜ ๊ธฐ๋ณธ URL ์„ค์ •, ํ—ค๋” ์„ค์ •, ๋ฐ์ดํ„ฐ ์ง๋ ฌํ™” ๋“ฑ์„ ์ฒ˜๋ฆฌํ•ฉ๋‹ˆ๋‹ค.
112+
`๐Ÿ“„ client.ts` ํŒŒ์ผ์€ ์š”์ฒญ์„ ์ˆ˜ํ–‰ํ•˜๋Š” ์›์‹œ ํ•จ์ˆ˜(์˜ˆ: `fetch()`)์— ๋Œ€ํ•œ wrapper๋ฅผ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. ์ด wrapper๋Š” ๋ฐฑ์—”๋“œ์˜ ๊ธฐ๋ณธ URL ์„ค์ •, ํ—ค๋” ์„ค์ •, ๋ฐ์ดํ„ฐ ์ง๋ ฌํ™” ๋“ฑ์„ ์ฒ˜๋ฆฌํ•ฉ๋‹ˆ๋‹ค.
113113

114114
```ts title="shared/api/endpoints/login.ts"
115115
import { POST } from "../client";
@@ -123,9 +123,9 @@ export function login({ email, password }: { email: string, password: string })
123123
export { login } from "./endpoints/login";
124124
```
125125

126-
#### ํŽ˜์ด์ง€์˜ `api` ์„ธ๊ทธ๋จผํŠธ์— ์ €์žฅํ•˜๊ธฐ
126+
#### page์˜ `api` segment์— ์ €์žฅํ•˜๊ธฐ
127127

128-
๋กœ๊ทธ์ธ ์š”์ฒญ์ด ํŠน์ • ํŽ˜์ด์ง€์—๋งŒ ํ•„์š”ํ•œ ๊ฒฝ์šฐ, ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€์˜ `api` ์„ธ๊ทธ๋จผํŠธ์— ํ•จ์ˆ˜๋ฅผ ์ €์žฅํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
128+
๋กœ๊ทธ์ธ ์š”์ฒญ์ด ํŠน์ • page์—๋งŒ ํ•„์š”ํ•œ ๊ฒฝ์šฐ, ๋กœ๊ทธ์ธ page์˜ `api` segment์— ํ•จ์ˆ˜๋ฅผ ์ €์žฅํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
129129

130130
- ๐Ÿ“‚ pages
131131
- ๐Ÿ“‚ login
@@ -144,15 +144,15 @@ export function login({ email, password }: { email: string, password: string })
144144
}
145145
```
146146

147-
์ด ํ•จ์ˆ˜๋Š” ํŽ˜์ด์ง€์˜ ๊ณต๊ฐœ API์—์„œ ๋‚ด๋ณด๋‚ผ ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค. ๋กœ๊ทธ์ธ ์š”์ฒญ์ด ๋‹ค๋ฅธ ๊ณณ์—์„œ ํ•„์š”ํ•  ๊ฐ€๋Šฅ์„ฑ์ด ๋‚ฎ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค.
147+
์ด ํ•จ์ˆ˜๋Š” page์˜ ๊ณต๊ฐœ API์—์„œ ๋‚ด๋ณด๋‚ผ ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค. ๋กœ๊ทธ์ธ ์š”์ฒญ์ด ๋‹ค๋ฅธ ๊ณณ์—์„œ ํ•„์š”ํ•  ๊ฐ€๋Šฅ์„ฑ์ด ๋‚ฎ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค.
148148

149149
### ์ด์ค‘ ์ธ์ฆ(2FA)
150150

151-
์•ฑ์ด ์ด์ค‘ ์ธ์ฆ(2FA)์„ ์ง€์›ํ•˜๋Š” ๊ฒฝ์šฐ, ์‚ฌ์šฉ์ž๊ฐ€ ์ผํšŒ์šฉ ๋น„๋ฐ€๋ฒˆํ˜ธ(OTP)๋ฅผ ์ž…๋ ฅํ•  ์ˆ˜ ์žˆ๋Š” ๋ณ„๋„์˜ ํŽ˜์ด์ง€๋กœ ์ด๋™ํ•ด์•ผ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ผ๋ฐ˜์ ์œผ๋กœ `POST /login` ์š”์ฒญ์€ ์‚ฌ์šฉ์ž๊ฐ€ 2FA๋ฅผ ํ™œ์„ฑํ™”ํ–ˆ์Œ์„ ๋‚˜ํƒ€๋‚ด๋Š” ํ”Œ๋ž˜๊ทธ๊ฐ€ ํฌํ•จ๋œ ์‚ฌ์šฉ์ž ๊ฐ์ฒด๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค. ์ด ํ”Œ๋ž˜๊ทธ๊ฐ€ ์„ค์ •๋˜๋ฉด ์‚ฌ์šฉ์ž๋ฅผ 2FA ํŽ˜์ด์ง€๋กœ ๋ฆฌ๋””๋ ‰์…˜ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.
151+
์•ฑ์ด ์ด์ค‘ ์ธ์ฆ(2FA)์„ ์ง€์›ํ•˜๋Š” ๊ฒฝ์šฐ, ์‚ฌ์šฉ์ž๊ฐ€ ์ผํšŒ์šฉ ๋น„๋ฐ€๋ฒˆํ˜ธ(OTP)๋ฅผ ์ž…๋ ฅํ•  ์ˆ˜ ์žˆ๋Š” ๋ณ„๋„์˜ page๋กœ ์ด๋™ํ•ด์•ผ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ผ๋ฐ˜์ ์œผ๋กœ `POST /login` ์š”์ฒญ์€ ์‚ฌ์šฉ์ž๊ฐ€ 2FA๋ฅผ ํ™œ์„ฑํ™”ํ–ˆ์Œ์„ ๋‚˜ํƒ€๋‚ด๋Š” ํ”Œ๋ž˜๊ทธ๊ฐ€ ํฌํ•จ๋œ ์‚ฌ์šฉ์ž ๊ฐ์ฒด๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค. ์ด ํ”Œ๋ž˜๊ทธ๊ฐ€ ์„ค์ •๋˜๋ฉด ์‚ฌ์šฉ์ž๋ฅผ 2FA page๋กœ ๋ฆฌ๋””๋ ‰์…˜ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.
152152

153-
2FA ํŽ˜์ด์ง€๋Š” ๋กœ๊ทธ์ธ๊ณผ ๋ฐ€์ ‘ํ•˜๊ฒŒ ์—ฐ๊ด€๋˜์–ด ์žˆ์œผ๋ฏ€๋กœ Pages ๋ ˆ์ด์–ด์˜ `login` ์Šฌ๋ผ์ด์Šค์— ํ•จ๊ป˜ ์ €์žฅํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.<br/>
153+
2FA page๋Š” ๋กœ๊ทธ์ธ๊ณผ ๋ฐ€์ ‘ํ•˜๊ฒŒ ์—ฐ๊ด€๋˜์–ด ์žˆ์œผ๋ฏ€๋กœ Pages layer์˜ `login` slice์— ํ•จ๊ป˜ ์ €์žฅํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.<br/>
154154

155-
์ด์ค‘ ์ธ์ฆ์„ ์ฒ˜๋ฆฌํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” `login()` ํ•จ์ˆ˜์™€ ์œ ์‚ฌํ•œ ๋˜ ๋‹ค๋ฅธ ์š”์ฒญ ํ•จ์ˆ˜๊ฐ€ ํ•„์š”ํ•  ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ํ•จ์ˆ˜๋“ค์€ `Shared`๋‚˜ ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€์˜ `api` ์„ธ๊ทธ๋จผํŠธ์— ํ•จ๊ป˜ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
155+
์ด์ค‘ ์ธ์ฆ์„ ์ฒ˜๋ฆฌํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” `login()` ํ•จ์ˆ˜์™€ ์œ ์‚ฌํ•œ ๋˜ ๋‹ค๋ฅธ ์š”์ฒญ ํ•จ์ˆ˜๊ฐ€ ํ•„์š”ํ•  ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ํ•จ์ˆ˜๋“ค์€ `Shared`๋‚˜ ๋กœ๊ทธ์ธ page์˜ `api` segment์— ํ•จ๊ป˜ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
156156

157157
## ์ธ์ฆ๋œ ์š”์ฒญ์˜ ํ† ํฐ ์ €์žฅ ๋ฐฉ๋ฒ• {#how-to-store-the-token-for-authenticated-requests}
158158

@@ -164,7 +164,7 @@ export function login({ email, password }: { email: string, password: string })
164164

165165
### Shared์— ์ €์žฅํ•˜๊ธฐ
166166

167-
`shared/api`์— ์ €์žฅํ•˜๋Š” ์ ‘๊ทผ ๋ฐฉ์‹์€ API ํด๋ผ์ด์–ธํŠธ์™€ ์ž˜ ๋งž์•„๋–จ์–ด์ง‘๋‹ˆ๋‹ค. ์ธ์ฆ์ด ํ•„์š”ํ•œ ๋‹ค๋ฅธ ์š”์ฒญ ํ•จ์ˆ˜์—์„œ ์ด ํ† ํฐ์„ ์‰ฝ๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. API ํด๋ผ์ด์–ธํŠธ์—์„œ ๋ฐ˜์‘ํ˜• ์Šคํ† ์–ด๋‚˜ ๋ชจ๋“ˆ ์ˆ˜์ค€ ๋ณ€์ˆ˜๋ฅผ ์‚ฌ์šฉํ•ด ํ† ํฐ์„ ์ €์žฅํ•˜๊ณ , `login()/logout()` ํ•จ์ˆ˜์—์„œ ํ•ด๋‹น ์ƒํƒœ๋ฅผ ์—…๋ฐ์ดํŠธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
167+
`shared/api`์— ์ €์žฅํ•˜๋Š” ์ ‘๊ทผ ๋ฐฉ์‹์€ API ํด๋ผ์ด์–ธํŠธ์™€ ์ž˜ ๋งž์•„๋–จ์–ด์ง‘๋‹ˆ๋‹ค. ์ธ์ฆ์ด ํ•„์š”ํ•œ ๋‹ค๋ฅธ ์š”์ฒญ ํ•จ์ˆ˜์—์„œ ์ด ํ† ํฐ์„ ์‰ฝ๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. API ํด๋ผ์ด์–ธํŠธ์—์„œ ๋ฐ˜์‘ํ˜• store๋‚˜ module ์ˆ˜์ค€ ๋ณ€์ˆ˜๋ฅผ ์‚ฌ์šฉํ•ด ํ† ํฐ์„ ์ €์žฅํ•˜๊ณ , `login()/logout()` ํ•จ์ˆ˜์—์„œ ํ•ด๋‹น ์ƒํƒœ๋ฅผ ์—…๋ฐ์ดํŠธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
168168

169169
ํ† ํฐ ์ž๋™ ๊ฐฑ์‹ ์€ API ํด๋ผ์ด์–ธํŠธ์—์„œ ๋ฏธ๋“ค์›จ์–ด ํ˜•ํƒœ๋กœ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ชจ๋“  ์š”์ฒญ๋งˆ๋‹ค ์‹คํ–‰๋˜๋ฉฐ, ์•„๋ž˜์™€ ๊ฐ™์€ ๋ฐฉ์‹์œผ๋กœ ๋™์ž‘ํ•ฉ๋‹ˆ๋‹ค:
170170

@@ -178,49 +178,49 @@ export function login({ email, password }: { email: string, password: string })
178178

179179
### Entities์— ์ €์žฅํ•˜๊ธฐ
180180

181-
FSD ํ”„๋กœ์ ํŠธ์—์„œ๋Š” ์‚ฌ์šฉ์ž ์—”ํ‹ฐํ‹ฐ ๋˜๋Š” ํ˜„์žฌ ์‚ฌ์šฉ์ž ์—”ํ‹ฐํ‹ฐ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ผ๋ฐ˜์ ์ž…๋‹ˆ๋‹ค. ๋‘ ์—”ํ‹ฐํ‹ฐ๋Š” ๊ฐ™์€ ๊ฒƒ์„ ๊ฐ€๋ฆฌํ‚ฌ ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.
181+
FSD ํ”„๋กœ์ ํŠธ์—์„œ๋Š” user entity ๋˜๋Š” current user entity๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ผ๋ฐ˜์ ์ž…๋‹ˆ๋‹ค. ๋‘ entity๋Š” ๊ฐ™์€ ๊ฒƒ์„ ๊ฐ€๋ฆฌํ‚ฌ ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.
182182

183183
:::note
184184

185185
**ํ˜„์žฌ ์‚ฌ์šฉ์ž**๋Š” "viewer" ๋˜๋Š” "me"๋ผ๊ณ ๋„ ํ•ฉ๋‹ˆ๋‹ค. ์ด๋Š” ๊ถŒํ•œ๊ณผ ๊ฐœ์ธ ์ •๋ณด๋ฅผ ๊ฐ€์ง„ ๋‹จ์ผ ์ธ์ฆ ์‚ฌ์šฉ์ž์™€ ๊ณต๊ฐœ์ ์œผ๋กœ ์ ‘๊ทผ ๊ฐ€๋Šฅํ•œ ์ •๋ณด๋กœ ๊ตฌ์„ฑ๋œ ๋ชจ๋“  ์‚ฌ์šฉ์ž ๋ชฉ๋ก์„ ๊ตฌ๋ณ„ํ•˜๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.
186186

187187
:::
188188

189-
User ์—”ํ‹ฐํ‹ฐ์— ํ† ํฐ์„ ์ €์žฅํ•˜๋ ค๋ฉด `model` ์„ธ๊ทธ๋จผํŠธ์— ๋ฐ˜์‘ํ˜• ์Šคํ† ์–ด๋ฅผ ์ƒ์„ฑํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์ด ์Šคํ† ์–ด๋Š” ํ† ํฐ๊ณผ ์‚ฌ์šฉ์ž ๊ฐ์ฒด๋ฅผ ๋ชจ๋‘ ํฌํ•จํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
189+
User entity์— ํ† ํฐ์„ ์ €์žฅํ•˜๋ ค๋ฉด `model` segment์— reactive store๋ฅผ ์ƒ์„ฑํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์ด store๋Š” ํ† ํฐ๊ณผ user ๊ฐ์ฒด๋ฅผ ๋ชจ๋‘ ํฌํ•จํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
190190

191-
API ํด๋ผ์ด์–ธํŠธ๋Š” ์ผ๋ฐ˜์ ์œผ๋กœ `shared/api` ์ •์˜๋˜๊ฑฐ๋‚˜ ์—”ํ‹ฐํ‹ฐ ์ „์ฒด์— ๋ถ„์‚ฐ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ์ฃผ์š” ๊ณผ์ œ๋Š” ๋ ˆ์ด์–ด์˜ ์ž„ํฌํŠธ ๊ทœ์น™([import rule on layers][import-rule-on-layers])์„ ์œ„๋ฐ˜ํ•˜์ง€ ์•Š์œผ๋ฉด์„œ ๋‹ค๋ฅธ ์š”์ฒญ์—์„œ๋„ ํ† ํฐ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค.
191+
API ํด๋ผ์ด์–ธํŠธ๋Š” ์ผ๋ฐ˜์ ์œผ๋กœ `shared/api` ์ •์˜๋˜๊ฑฐ๋‚˜ entity ์ „์ฒด์— ๋ถ„์‚ฐ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ์ฃผ์š” ๊ณผ์ œ๋Š” layer์˜ ์ž„ํฌํŠธ ๊ทœ์น™([import rule on layers][import-rule-on-layers])์„ ์œ„๋ฐ˜ํ•˜์ง€ ์•Š์œผ๋ฉด์„œ ๋‹ค๋ฅธ ์š”์ฒญ์—์„œ๋„ ํ† ํฐ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค.
192192

193-
> ๋ ˆ์ด์–ด ๊ทœ์น™: ์Šฌ๋ผ์ด์Šค์˜ ๋ชจ๋“ˆ์€ ์ž๊ธฐ๋ณด๋‹ค ๋‚ฎ์€ ๋ ˆ์ด์–ด์— ์œ„์น˜ํ•œ ๋‹ค๋ฅธ ์Šฌ๋ผ์ด์Šค๋งŒ ์ž„ํฌํŠธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
193+
> Layer ๊ทœ์น™: slice์˜ module์€ ์ž๊ธฐ๋ณด๋‹ค ๋‚ฎ์€ layer์— ์œ„์น˜ํ•œ ๋‹ค๋ฅธ slice๋งŒ importํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
194194
195195
์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•œ ๋ช‡ ๊ฐ€์ง€ ๋ฐฉ๋ฒ•์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค:
196196

197197
1. **์š”์ฒญ ์‹œ๋งˆ๋‹ค ํ† ํฐ ์ˆ˜๋™ ์ „๋‹ฌ**
198198
์ด ๋ฐฉ๋ฒ•์€ ๊ฐ€์žฅ ๊ฐ„๋‹จํ•˜์ง€๋งŒ, ๋ฒˆ๊ฑฐ๋กญ๊ณ  ํƒ€์ž… ์•ˆ์ „์„ฑ์ด ๋ณด์žฅ๋˜์ง€ ์•Š์œผ๋ฉด ์‹ค์ˆ˜๊ฐ€ ๋ฐœ์ƒํ•  ๊ฐ€๋Šฅ์„ฑ์ด ํฝ๋‹ˆ๋‹ค. ๋˜ํ•œ Shared์˜ API ํด๋ผ์ด์–ธํŠธ์— ๋ฏธ๋“ค์›จ์–ด ํŒจํ„ด์„ ์ ์šฉํ•˜๊ธฐ ์–ด๋ ต์Šต๋‹ˆ๋‹ค.
199-
2. **์•ฑ ์ „์—ญ์—์„œ ๊ธ€๋กœ๋ฒŒ ์Šคํ† ์–ด๋กœ ํ† ํฐ ๊ด€๋ฆฌ**
200-
ํ† ํฐ์„ context๋‚˜ `localStorage`์— ์ €์žฅํ•˜๊ณ , `shared/api`์— ํ† ํฐ ์ ‘๊ทผ ํ‚ค๋ฅผ ๋ณด๊ด€ํ•ฉ๋‹ˆ๋‹ค. ํ† ํฐ์˜ ๋ฐ˜์‘ํ˜• ์ €์žฅ์†Œ๋Š” User ์—”ํ„ฐํ‹ฐ์—์„œ ๋‚ด๋ณด๋‚ด๋ฉฐ, ํ•„์š”ํ•œ ๊ฒฝ์šฐ context Provider๋Š” App ๋ ˆ์ด์–ด์—์„œ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค. ์ด ๋ฐฉ๋ฒ•์€ API ํด๋ผ์ด์–ธํŠธ ์„ค๊ณ„๋ฅผ ์œ ์—ฐํ•˜๊ฒŒ ๋งŒ๋“ค์ง€๋งŒ, ์ƒ์œ„ ๋ ˆ์ด์–ด์— context ์ œ๊ณต์ด ํ•„์š”ํ•˜๋‹ค๋Š” ์•”๋ฌต์ ์ธ ์˜์กด์„ฑ์„ ๋ฐœ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ context๋‚˜ `localStorage`๊ฐ€ ์ œ๋Œ€๋กœ ์„ค์ •๋˜์ง€ ์•Š์•˜์„ ๊ฒฝ์šฐ, ์œ ์šฉํ•œ ์˜ค๋ฅ˜ ๋ฉ”์‹œ์ง€๋ฅผ ์ œ๊ณตํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.
199+
2. **์•ฑ ์ „์—ญ์—์„œ ๊ธ€๋กœ๋ฒŒ store๋กœ ํ† ํฐ ๊ด€๋ฆฌ**
200+
ํ† ํฐ์„ context๋‚˜ `localStorage`์— ์ €์žฅํ•˜๊ณ , `shared/api`์— ํ† ํฐ ์ ‘๊ทผ ํ‚ค๋ฅผ ๋ณด๊ด€ํ•ฉ๋‹ˆ๋‹ค. ํ† ํฐ์˜ reactive store๋Š” User entity์—์„œ ๋‚ด๋ณด๋‚ด๋ฉฐ, ํ•„์š”ํ•œ ๊ฒฝ์šฐ context Provider๋Š” App layer์—์„œ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค. ์ด ๋ฐฉ๋ฒ•์€ API ํด๋ผ์ด์–ธํŠธ ์„ค๊ณ„๋ฅผ ์œ ์—ฐํ•˜๊ฒŒ ๋งŒ๋“ค์ง€๋งŒ, ์ƒ์œ„ layer์— context ์ œ๊ณต์ด ํ•„์š”ํ•˜๋‹ค๋Š” ์•”๋ฌต์ ์ธ ์˜์กด์„ฑ์„ ๋ฐœ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ context๋‚˜ `localStorage`๊ฐ€ ์ œ๋Œ€๋กœ ์„ค์ •๋˜์ง€ ์•Š์•˜์„ ๊ฒฝ์šฐ, ์œ ์šฉํ•œ ์˜ค๋ฅ˜ ๋ฉ”์‹œ์ง€๋ฅผ ์ œ๊ณตํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.
201201
3. **ํ† ํฐ ๋ณ€๊ฒฝ ์‹œ API ํด๋ผ์ด์–ธํŠธ ์—…๋ฐ์ดํŠธ**
202-
๋ฐ˜์‘ํ˜• ์Šคํ† ์–ด๋ฅผ ํ™œ์šฉํ•ด ์—”ํ‹ฐํ‹ฐ์˜ ์Šคํ† ์–ด๊ฐ€ ๋ณ€๊ฒฝ๋  ๋•Œ๋งˆ๋‹ค API ํด๋ผ์ด์–ธํŠธ์˜ ํ† ํฐ ์Šคํ† ์–ด๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๋Š” ๊ตฌ๋…(subscribe)์„ ์ƒ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฐฉ๋ฒ•์€ ์ƒ์œ„ ๊ณ„์ธต์— ์•”๋ฌต์ ์ธ ์˜์กด์„ฑ์„ ๋งŒ๋“ ๋‹ค๋Š” ์ ์—์„œ๋Š” ์ด์ „ ํ•ด๊ฒฐ์ฑ…๊ณผ ๋น„์Šทํ•˜์ง€๋งŒ, ์ด ๋ฐฉ๋ฒ•์€ ๋” "๋ช…๋ นํ˜•(push)" ์ ‘๊ทผ์ด๊ณ , ์ด์ „ ๋ฐฉ๋ฒ•์€ ๋” "์„ ์–ธํ˜•(pull)" ์ ‘๊ทผ์ž…๋‹ˆ๋‹ค.
202+
reactive store๋ฅผ ํ™œ์šฉํ•ด entity์˜ store๊ฐ€ ๋ณ€๊ฒฝ๋  ๋•Œ๋งˆ๋‹ค API ํด๋ผ์ด์–ธํŠธ์˜ ํ† ํฐ store๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๋Š” ๊ตฌ๋…(subscribe)์„ ์ƒ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฐฉ๋ฒ•์€ ์ƒ์œ„ layer์— ์•”๋ฌต์ ์ธ ์˜์กด์„ฑ์„ ๋งŒ๋“ ๋‹ค๋Š” ์ ์—์„œ๋Š” ์ด์ „ ํ•ด๊ฒฐ์ฑ…๊ณผ ๋น„์Šทํ•˜์ง€๋งŒ, ์ด ๋ฐฉ๋ฒ•์€ ๋” "๋ช…๋ นํ˜•(push)" ์ ‘๊ทผ์ด๊ณ , ์ด์ „ ๋ฐฉ๋ฒ•์€ ๋” "์„ ์–ธํ˜•(pull)" ์ ‘๊ทผ์ž…๋‹ˆ๋‹ค.
203203

204-
์—”ํ‹ฐํ‹ฐ์˜ `model`์— ํ† ํฐ์„ ์ €์žฅํ•˜์—ฌ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๋ฉด, ํ† ํฐ ๊ด€๋ฆฌ์™€ ๊ด€๋ จ๋œ ๋” ๋งŽ์€ ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง์„ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, `model` ์„ธ๊ทธ๋จผํŠธ์— ํ† ํฐ ๋งŒ๋ฃŒ ์‹œ ๊ฐฑ์‹ ํ•˜๋Š” ๋กœ์ง์„ ์ถ”๊ฐ€ํ•˜๊ฑฐ๋‚˜, ์ผ์ • ์‹œ๊ฐ„์ด ์ง€๋‚˜๋ฉด ํ† ํฐ์„ ๋ฌดํšจํ™”ํ•˜๋Š” ๋กœ์ง์„ ํฌํ•จํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
205-
๋ฐฑ์—”๋“œ์— ์š”์ฒญ์„ ๋ณด๋‚ด์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ์—๋Š” User ์—”ํ‹ฐํ‹ฐ์˜ api ์„ธ๊ทธ๋จผํŠธ๋‚˜ `shared/api`๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
204+
entity์˜ `model` segment์— ํ† ํฐ์„ ์ €์žฅํ•˜์—ฌ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๋ฉด, ํ† ํฐ ๊ด€๋ฆฌ์™€ ๊ด€๋ จ๋œ ๋” ๋งŽ์€ ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง์„ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, `model` segment์— ํ† ํฐ ๋งŒ๋ฃŒ ์‹œ ๊ฐฑ์‹ ํ•˜๋Š” ๋กœ์ง์„ ์ถ”๊ฐ€ํ•˜๊ฑฐ๋‚˜, ์ผ์ • ์‹œ๊ฐ„์ด ์ง€๋‚˜๋ฉด ํ† ํฐ์„ ๋ฌดํšจํ™”ํ•˜๋Š” ๋กœ์ง์„ ํฌํ•จํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
205+
๋ฐฑ์—”๋“œ์— ์š”์ฒญ์„ ๋ณด๋‚ด์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ์—๋Š” User entity์˜ api segment๋‚˜ `shared/api`๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
206206

207207
### Pages/Widgets์— ์ €์žฅํ•˜๊ธฐ (๊ถŒ์žฅํ•˜์ง€ ์•Š์Œ)
208208

209-
์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์ „์—ญ์— ์ ์šฉ๋˜๋Š” ์ƒํƒœ(์˜ˆ: ์•ก์„ธ์Šค ํ† ํฐ)๋ฅผ ํŽ˜์ด์ง€๋‚˜ ์œ„์ ฏ์— ์ €์žฅํ•˜๋Š” ๊ฒƒ์€ ๊ถŒ์žฅ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€์˜ `model` ์„ธ๊ทธ๋จผํŠธ์— ํ† ํฐ ์Šคํ† ์–ด๋ฅผ ๋ฐฐ์น˜ํ•˜๋Š” ๋Œ€์‹ , ์ด ์•„ํ‹ฐํด์—์„œ ์ œ์‹œํ•œ ์ฒ˜์Œ ๋‘ ํ•ด๊ฒฐ์ฑ…์ธ Shared๋‚˜ Entities๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ๊ถŒ์žฅ๋ฉ๋‹ˆ๋‹ค.
209+
์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์ „์—ญ์— ์ ์šฉ๋˜๋Š” ์ƒํƒœ(์˜ˆ: ์•ก์„ธ์Šค ํ† ํฐ)๋ฅผ page๋‚˜ widget์— ์ €์žฅํ•˜๋Š” ๊ฒƒ์€ ๊ถŒ์žฅ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋กœ๊ทธ์ธ page์˜ `model` segment์— ํ† ํฐ store๋ฅผ ๋ฐฐ์น˜ํ•˜๋Š” ๋Œ€์‹ , ์ด ์•„ํ‹ฐํด์—์„œ ์ œ์‹œํ•œ ์ฒ˜์Œ ๋‘ ํ•ด๊ฒฐ์ฑ…์ธ Shared๋‚˜ Entities๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ๊ถŒ์žฅ๋ฉ๋‹ˆ๋‹ค.
210210

211211
## ๋กœ๊ทธ์•„์›ƒ ๋ฐ ํ† ํฐ ๋ฌดํšจํ™”
212212

213-
๋กœ๊ทธ์•„์›ƒ ๊ธฐ๋Šฅ์€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ์ค‘์š”ํ•œ ๊ธฐ๋Šฅ์ด์ง€๋งŒ, ์ด๋ฅผ ์œ„ํ•œ ๋ณ„๋„์˜ ํŽ˜์ด์ง€๋Š” ์—†๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์Šต๋‹ˆ๋‹ค. ์ด ๊ธฐ๋Šฅ์€ ๋ฐฑ์—”๋“œ์— ์ธ์ฆ๋œ ์š”์ฒญ์„ ๋ณด๋‚ด๊ณ , ํ† ํฐ ์Šคํ† ์–ด๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๋Š” ์ž‘์—…์œผ๋กœ ๊ตฌ์„ฑ๋ฉ๋‹ˆ๋‹ค.
213+
๋กœ๊ทธ์•„์›ƒ ๊ธฐ๋Šฅ์€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ์ค‘์š”ํ•œ ๊ธฐ๋Šฅ์ด์ง€๋งŒ, ์ด๋ฅผ ์œ„ํ•œ ๋ณ„๋„์˜ page๋Š” ์—†๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์Šต๋‹ˆ๋‹ค. ์ด ๊ธฐ๋Šฅ์€ ๋ฐฑ์—”๋“œ์— ์ธ์ฆ๋œ ์š”์ฒญ์„ ๋ณด๋‚ด๊ณ , ํ† ํฐ store๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๋Š” ์ž‘์—…์œผ๋กœ ๊ตฌ์„ฑ๋ฉ๋‹ˆ๋‹ค.
214214

215-
๋ชจ๋“  ์š”์ฒญ์„ `shared/api`์— ๋ณด๊ด€ํ–ˆ๋‹ค๋ฉด, ๋กœ๊ทธ์ธ ํ•จ์ˆ˜ ๊ทผ์ฒ˜์— ๋กœ๊ทธ์•„์›ƒ ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ๋‘๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ๊ทธ๋ ‡์ง€ ์•Š์€ ๊ฒฝ์šฐ, ๋กœ๊ทธ์•„์›ƒ ๋ฒ„ํŠผ์ด ์žˆ๋Š” ์œ„์น˜ ๊ทผ์ฒ˜์— ๋กœ๊ทธ์•„์›ƒ ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋ชจ๋“  ํŽ˜์ด์ง€์— ๋‚˜ํƒ€๋‚˜๋Š” ํ—ค๋” ์œ„์ ฏ์— ๋กœ๊ทธ์•„์›ƒ ๋งํฌ๊ฐ€ ์žˆ๋‹ค๋ฉด, ํ•ด๋‹น ์š”์ฒญ์„ ๊ทธ ์œ„์ ฏ์˜ `api` ์„ธ๊ทธ๋จผํŠธ์— ๋ฐฐ์น˜ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.
215+
๋ชจ๋“  ์š”์ฒญ์„ `shared/api`์— ๋ณด๊ด€ํ–ˆ๋‹ค๋ฉด, ๋กœ๊ทธ์ธ ํ•จ์ˆ˜ ๊ทผ์ฒ˜์— ๋กœ๊ทธ์•„์›ƒ ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ๋‘๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ๊ทธ๋ ‡์ง€ ์•Š์€ ๊ฒฝ์šฐ, ๋กœ๊ทธ์•„์›ƒ ๋ฒ„ํŠผ์ด ์žˆ๋Š” ์œ„์น˜ ๊ทผ์ฒ˜์— ๋กœ๊ทธ์•„์›ƒ ์š”์ฒญ ํ•จ์ˆ˜๋ฅผ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋ชจ๋“  page์— ๋‚˜ํƒ€๋‚˜๋Š” header widget์— ๋กœ๊ทธ์•„์›ƒ ๋งํฌ๊ฐ€ ์žˆ๋‹ค๋ฉด, ํ•ด๋‹น ์š”์ฒญ์„ ๊ทธ widget์˜ `api` segment์— ๋ฐฐ์น˜ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.
216216

217-
ํ† ํฐ ์Šคํ† ์–ด์— ๋Œ€ํ•œ ์—…๋ฐ์ดํŠธ๋Š” ๋กœ๊ทธ์•„์›ƒ ๋ฒ„ํŠผ์ด ์œ„์น˜ํ•œ ๊ณณ(์˜ˆ: ํ—ค๋” ์œ„์ ฏ)์—์„œ ํŠธ๋ฆฌ๊ฑฐ๋˜์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์ด ์š”์ฒญ๊ณผ ์Šคํ† ์–ด ์—…๋ฐ์ดํŠธ๋ฅผ ํ•ด๋‹น ์œ„์ ฏ์˜ `model` ์„ธ๊ทธ๋จผํŠธ์—์„œ ๊ฒฐํ•ฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
217+
ํ† ํฐ store์— ๋Œ€ํ•œ ์—…๋ฐ์ดํŠธ๋Š” ๋กœ๊ทธ์•„์›ƒ ๋ฒ„ํŠผ์ด ์œ„์น˜ํ•œ ๊ณณ(์˜ˆ: header widget)์—์„œ ํŠธ๋ฆฌ๊ฑฐ๋˜์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์ด ์š”์ฒญ๊ณผ store ์—…๋ฐ์ดํŠธ๋ฅผ ํ•ด๋‹น widget์˜ `model` segment์—์„œ ๊ฒฐํ•ฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
218218

219219
### ์ž๋™ ๋กœ๊ทธ์•„์›ƒ
220220

221-
๋กœ๊ทธ์•„์›ƒ ์š”์ฒญ ์‹คํŒจ๋‚˜ ๋กœ๊ทธ์ธ ํ† ํฐ ๊ฐฑ์‹  ์‹คํŒจ ์‹œ๋ฅผ ๋Œ€๋น„ํ•ด ์•ˆ์ „์žฅ์น˜๋ฅผ ๋งˆ๋ จํ•˜๋Š” ๊ฒƒ๋„ ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค. ์ด ๋‘ ๊ฒฝ์šฐ ๋ชจ๋‘ ํ† ํฐ ์Šคํ† ์–ด๋ฅผ ๋น„์›Œ์•ผ ํ•ฉ๋‹ˆ๋‹ค. ํ† ํฐ์„ Entities์— ์ €์žฅํ•˜๋Š” ๊ฒฝ์šฐ, ์ด ๋กœ์ง์€ `model` ์„ธ๊ทธ๋จผํŠธ์— ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ† ํฐ์„ Shared์— ์ €์žฅํ•˜๋Š” ๊ฒฝ์šฐ, ์ด ๋กœ์ง์„ `shared/api`์— ํฌํ•จํ•˜๋ฉด ์„ธ๊ทธ๋จผํŠธ๊ฐ€ ๋„ˆ๋ฌด ๋ณต์žกํ•ด์งˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ํ† ํฐ ๊ด€๋ฆฌ ๋กœ์ง์„ ๋ณ„๋„์˜ ์„ธ๊ทธ๋จผํŠธ(์˜ˆ: `shared/auth`)๋กœ ๋ถ„๋ฆฌํ•˜๋Š” ๊ฒƒ๋„ ๊ณ ๋ คํ•ด๋ณผ ๋งŒํ•ฉ๋‹ˆ๋‹ค.
221+
๋กœ๊ทธ์•„์›ƒ ์š”์ฒญ ์‹คํŒจ๋‚˜ ๋กœ๊ทธ์ธ ํ† ํฐ ๊ฐฑ์‹  ์‹คํŒจ ์‹œ๋ฅผ ๋Œ€๋น„ํ•ด ์•ˆ์ „์žฅ์น˜๋ฅผ ๋งˆ๋ จํ•˜๋Š” ๊ฒƒ๋„ ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค. ์ด ๋‘ ๊ฒฝ์šฐ ๋ชจ๋‘ ํ† ํฐ store๋ฅผ ๋น„์›Œ์•ผ ํ•ฉ๋‹ˆ๋‹ค. ํ† ํฐ์„ Entities์— ์ €์žฅํ•˜๋Š” ๊ฒฝ์šฐ, ์ด ๋กœ์ง์€ `model` segment์— ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ† ํฐ์„ Shared์— ์ €์žฅํ•˜๋Š” ๊ฒฝ์šฐ, ์ด ๋กœ์ง์„ `shared/api`์— ํฌํ•จํ•˜๋ฉด segment๊ฐ€ ๋„ˆ๋ฌด ๋ณต์žกํ•ด์งˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ํ† ํฐ ๊ด€๋ฆฌ ๋กœ์ง์„ ๋ณ„๋„์˜ segment(์˜ˆ: `shared/auth`)๋กœ ๋ถ„๋ฆฌํ•˜๋Š” ๊ฒƒ๋„ ๊ณ ๋ คํ•ด๋ณผ ๋งŒํ•ฉ๋‹ˆ๋‹ค.
222222

223223
[tutorial-authentication]: /docs/get-started/tutorial#authentication
224224
[import-rule-on-layers]: /docs/reference/layers#import-rule-on-layers
225225
[ext-remix]: https://remix.run
226-
[ext-zod]: https://zod.dev
226+
[ext-zod]: https://zod.dev

0 commit comments

Comments
ย (0)