diff --git a/README.md b/README.md
index f4dc819..ef9e372 100644
--- a/README.md
+++ b/README.md
@@ -42,6 +42,25 @@ PW: 123123
+## ๐ **0. ๋ชฉ์ฐจ**
+
+1. [์๋น์ค ์๊ฐ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#-1-%EC%84%9C%EB%B9%84%EC%8A%A4-%EC%86%8C%EA%B0%9C)
+2. [๋ฐฉ๊พธ์ ํ์ ์๊ฐ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#-2-%EB%B0%A9%EA%BE%B8%EC%84%9D-%ED%8C%80%EC%9B%90-%EC%86%8C%EA%B0%9C)
+3. [์ญํ ๋ถ๋ด](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-3-%EC%97%AD%ED%95%A0-%EB%B6%84%EB%8B%B4)
+4. [๊ฐ๋ฐ ์ผ์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#-4-%EA%B0%9C%EB%B0%9C-%EC%9D%BC%EC%A0%95)
+5. [๊ฐ๋ฐ ํ๊ฒฝ ๋ฐ ๊ธฐ์ ์คํ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-5-%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EB%B0%8F-%EA%B8%B0%EC%88%A0-%EC%8A%A4%ED%83%9D)
+6. [ํ๋ก์ ํธ ํด๋ ๊ตฌ์กฐ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#-6-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%ED%8F%B4%EB%8D%94-%EA%B5%AC%EC%A1%B0)
+7. [Git Branch ์ ๋ต - Github Flow](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-7-git-branch-%EC%A0%84%EB%9E%B5---github-flow)
+8. [๋ฐฉ๊พธ์์์๋ ์ด๋ ๊ฒ ํ์
ํด์](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#-8-%EB%B0%A9%EA%BE%B8%EC%84%9D%EC%97%90%EC%84%9C%EB%8A%94-%EC%9D%B4%EB%A0%87%EA%B2%8C-%ED%98%91%EC%97%85%ED%95%B4%EC%9A%94)
+9. [์ฃผ์ ๊ธฐ๋ฅ ์ด๋ฏธ์ง๋ก ํ์ธํ๊ธฐ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-9-%EC%A3%BC%EC%9A%94-%EA%B8%B0%EB%8A%A5-%EC%86%8C%EA%B0%9C)
+10. [์์ธ ๋ด๋น ์
๋ฌด](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-10-%EC%83%81%EC%84%B8-%EB%8B%B4%EB%8B%B9-%EC%97%85%EB%AC%B4)
+11. [ํต์ฌ ์ฝ๋](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-11-%ED%95%B5%EC%8B%AC-%EC%BD%94%EB%93%9C)
+12. [ํธ๋ฌ๋ธ ์ํ
](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-12-%ED%8A%B8%EB%9F%AC%EB%B8%94-%EC%8A%88%ED%8C%85)
+13. [๋ฆฌํฉํ ๋งํ ๋ถ๋ถ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-13-%EB%A6%AC%ED%8C%A9%ED%86%A0%EB%A7%81%ED%95%A0-%EB%B6%80%EB%B6%84)
+14. [๋๋์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/tree/develop#%EF%B8%8F-14-%EB%8A%90%EB%82%80%EC%A0%90)
+
+
+
## ๐ข **1. ์๋น์ค ์๊ฐ**
์ธํ
๋ฆฌ์ด๋ฅผ ์ฌ๋ํ๋ ๋ชจ๋ ์ด๋ค์ ์ํ ์จ๋ผ์ธ ์ธํ
๋ฆฌ์ด ํ๋ซํผ, **๋ฐฉ๊พธ์**์ ์๊ฐํฉ๋๋ค!
@@ -74,19 +93,23 @@ PW: 123123
โฒ
+
## โด๏ธ **3. ์ญํ ๋ถ๋ด**
+
## ๐
**4. ๊ฐ๋ฐ ์ผ์ **
๐ฅ 2023.06.01 - 2023.06.30
-- ๊ฐ๋ฐ ์ผ์ ์ ๋
ธ์
์ [๊ฐํธ ์ฐจํธ](https://www.notion.so/14-OH-LEE-f89c38cec5a1439abf2b02d0c76e5376?pvs=4#285a18d7c0ff4ce58aacd87bf1be8366)์ [์ด๊ด ๋ณด๋](https://www.notion.so/14-OH-LEE-f89c38cec5a1439abf2b02d0c76e5376?pvs=4#481e623f274a473e99504597add863e1)๋ฅผ ๋ง๋ค์ด ๊ด๋ฆฌ
+- ๊ฐ๋ฐ ์ผ์ ์ ๋
ธ์
์ [๊ฐํธ ์ฐจํธ](https://www.notion.so/14-OH-LEE-f89c38cec5a1439abf2b02d0c76e5376?pvs=4#285a18d7c0ff4ce58aacd87bf1be8366)์ [์ด๊ด ๋ณด๋](https://www.notion.so/14-OH-LEE-f89c38cec5a1439abf2b02d0c76e5376?pvs=4#481e623f274a473e99504597add863e1)๋ฅผ ๋ง๋ค์ด ๊ด๋ฆฌํ์์ต๋๋ค.
+
+
@@ -95,11 +118,12 @@ PW: 123123
โฒ
+
## โ๏ธ **5. ๊ฐ๋ฐ ํ๊ฒฝ ๋ฐ ๊ธฐ์ ์คํ**
-
+
๐ [API ๋ช
์ธ ๋ฐ๋ก๊ฐ๊ธฐ](https://toothsome-debt-b2b.notion.site/API-1c9f20ecba054f5ebfbaff4b65243976?pvs=4)
@@ -107,21 +131,21 @@ PW: 123123
### **์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ฌ์ฉํ์๊น?**
-
-
+
+
### **์ปจ๋ฒค์
**
-#### **eslint**
+#### **๐ถ eslint**
-```json
+```javascript
{
"extends": ["react-app", "prettier"],
"rules": {
"indent": ["error", 2, { "SwitchCase": 1 }], // ๋ค์ฌ์ฐ๊ธฐ 2์นธ๋ง ํ์ฉ
- "no-var": "error", // // var ํค์๋ ์ฌ์ฉ ๊ธ์ง
+ "no-var": "error", // var ํค์๋ ์ฌ์ฉ ๊ธ์ง
"require-await": "error", // async ํจ์ ๋ด๋ถ์ await ํค์๋๊ฐ ์์ผ๋ฉด ์ค๋ฅ ๋ฐ์
"eqeqeq": "warn", // ==, != ๋์ ์ ===, !== ์ฌ์ฉ
"react/prop-types": 0, // ํ๋กญ์ค ํ์
๋ฌด์
@@ -130,9 +154,9 @@ PW: 123123
}
```
-#### **prettier**
+#### **๐ถ prettier**
-```json
+```javascript
{
"bracketSpacing": true, // ๊ฐ์ฒด ๋ฆฌํฐ๋ด์์ ๊ดํธ์ ๊ณต๋ฐฑ ์ฝ์
"jsxBracketSameLine": false, // JSX์ ๋ง์ง๋ง `>`๋ฅผ ๋ค์ ์ค๋ก ๋ด๋ฆด์ง ์ฌ๋ถ
@@ -149,19 +173,19 @@ PW: 123123
}
```
-#### **Github Issue Template**
+#### **๐ถ Github Issue Template**
-#### **Github PR template**
+#### **๐ถ Github PR template**
-#### **์ปค๋ฐ ์ปจ๋ฒค์
**
+#### **๐ถ ์ปค๋ฐ ์ปจ๋ฒค์
**
```
โจ feat: ๊ธฐ๋ฅ ์ถ๊ฐ, ์ญ์ , ๋ณ๊ฒฝ
@@ -179,7 +203,7 @@ PW: 123123
-#### **Styled Components ์ปจ๋ฒค์
**
+#### **๐ถ Styled Components ์ปจ๋ฒค์
**
```
wrapper: ~Wrapper
@@ -259,83 +283,93 @@ li๋ด์ ์คํ์ผํ ์์๊ฐ 3๊ฐ์ด์์ด๋ฉด li๋ฅผ Item์ผ๋ก ๋นผ๊ธฐ
โโ getTime.js
```
+
+
## โด๏ธ **7. Git Branch ์ ๋ต - Github Flow**
-
+- ๋น๊ต์ ์๊ณ ๋ณต์กํ์ง ์์ ํ๋ก์ ํธ๋ก, ํ์๋ค์๊ฒ ์ฝ๊ณ ๋น ๋ฅด๊ฒ ๋์
ํ ์ ์๋ **Github Flow** ์ ๋ต์ ์ฌ์ฉํ์์ต๋๋ค.
+
+
-
+
## ๐ค **8. ๋ฐฉ๊พธ์์์๋ ์ด๋ ๊ฒ ํ์
ํด์**
### **์ฝ๋๋ฆฌ๋ทฐ**
-- VS code ๋ผ์ด๋ธ ์์ด
- - ์ค์๊ฐ์ผ๋ก ํ์๋ค๊ณผ ์๊ฒฉ์ผ๋ก ์ฝ๋๋ฅผ ์์ ํ๊ณ ํธ๋ฆฌํ ํธ๋ฌ๋ธ ์ํ
์ ๊ฒฝํํ๋ค.
- - ๋ค์ํ OS์์ ์ฌ์ฉ์ด ๊ฐ๋ฅํ์ฌ ํ์๋ค์ ์๋ก ๋ค๋ฅธ OS ์ฐจ์ด์ ๊ตฌ์ ๋ฐ์ง ์์๋ค.
-- PR ๋ณํฉ ๊ท์น์ ์น์ธ์ 1ํ ์ด์์ผ๋ก ์ค์ ํ์ฌ PR์ ๋ฌด์กฐ๊ฑด ํ์ธํ ์ ์๊ฒ ํ๋ค. ์ถฉ๋์ ๋ฐฉ์งํ๋ ๊ฒ๊ณผ ๋๋ถ์ด ํ์๋ค์ ์ฝ๋์ ๋ฆฌ๋ทฐ๋ฅผ ๋ฌ์์ฃผ๊ธฐ ํธ๋ฆฌํ๋ค.
+- [VS code ๋ผ์ด๋ธ ์์ด](https://code.visualstudio.com/learn/collaboration/live-share)๋ฅผ ํตํ ํ์ด ์ฝ๋ฉ
+ - ์ค์๊ฐ ์๊ฒฉ์ผ๋ก ํ์๋ค๊ณผ ์ฝ๋๋ฅผ ์์ ํ ์ ์๊ธฐ ๋๋ฌธ์ ์ค๋ฅ๊ฐ ๋๋ ๋ถ๋ถ์ ์จ๋ผ์ธ๋ง์ผ๋ก๋ ์ฆ๊ฐ์ ์ผ๋ก ํด๊ฒฐํด ๋๊ฐ๋ ๊ณผ์ ์ ๊ฒฝํํ ์ ์์์ต๋๋ค. ๋ฐ๋ผ์ ์จ๋ผ์ธ ํ๋ก์ ํธ ์งํ์ ๋จ์ ์ ๋ณด์ํ์ฌ ํจ์จ์ ์ผ๋ก ํธ๋ฌ๋ธ ์ํ
์ ์งํํ์์ต๋๋ค.
+ - ๋ค์ํ OS์์ ์ฌ์ฉ์ด ๊ฐ๋ฅํ์ฌ ํ์๋ค์ OS๊ฐ ๋ค๋ฅด๋๋ผ๋ ํฐ ์ํฅ์ ๋ฐ์ง ์์๋ ์ ์ด ์ข์์ต๋๋ค.
+- PR ๋ณํฉ ๊ท์น์ ์น์ธ์ 1ํ ์ด์์ผ๋ก ์ค์ ํ์ฌ ํ์ ์ค ํ ๋ช
์ด๋ผ๋ PR์ ๋ฌด์กฐ๊ฑด ํ์ธํด๋ณผ ์ ์๊ฒ ํ์์ต๋๋ค. ์ถฉ๋์ ๋ฐฉ์งํ๋ ๊ฒ๊ณผ ๋๋ถ์ด ํ์๋ค์ ์ฝ๋์ ๋ฆฌ๋ทฐ๋ฅผ ๋ฌ์์ฃผ๋ฉด์ ์ ์ฒด์ ์ธ ์ฝ๋์ ํ๋ฆ์ ํ์ ๋ชจ๋๊ฐ ๋น ๋ฅด๊ฒ ์ธ์งํ ์ ์์์ต๋๋ค.
### **ํ์
ํด**
-- ๋
ธ์
: ์ ๋ณด ๊ณต์ , ํ์๋ก, ์๊ตฌ ์ฌํญ ์ ๋ฆฌ ๋ฐ ์ปจ๋ฒค์
์ ๋ฆฌ
- - ๋ค์ํ ํ์๊ณผ ํ
ํ๋ฆฟ์ด ๊ณต์ ๋์ด ์๊ณ , ๋์์ธ์ ์ผ๋ก ๊น๋ํ๊ณ ์๊ฐ์ ์ธ ์ ๋ณด๋ฅผ ์ ๊ณตํ์ฌ ์์
์ํ๋ฅผ ํ ๋์ ํ์
ํ ์ ์์๋ค.
- - ์ค์๊ฐ ๊ณต๋ ์์
์ ํ ์ ์์๋ค.
-- ํผ๊ทธ๋ง : ๋์์ธ ๊ณต๋ ์์
์ ํ ์ ์์๋ค.
-- ์ปค๋ฐ ์ปจ๋ฒค์
: ํ์
์ ํ๋ค ๋ณด๋ฉด ๋ณตํฉ์ ์ธ ์ปค๋ฐ ๋ด์ฉ์ด ๋ง์์ง๊ธฐ ๋๋ฌธ์ ์ปค๋ฐ ์ปจ๋ฒค์
์ ์ง์ ํ์ฌ ์ปค๋ฐ ๋ชฉ์ ์ ์ฝ๊ฒ ๋ณผ ์ ์๊ฒ ํ๋ค. ์ง์ ์์
์๊ฐ ์๋๋๋ผ๋ ์ฝ๋ ๋ณ๊ฒฝ์ ๋ํ ๋ฌธ๋งฅ์ ํ์
ํ๊ธฐ ์ฝ๊ณ ์ด๋ ฅ ์ถ์ ์ ํจ๊ณผ์ ์ผ๋ก ํ ์ ์์๋ค.
+- `๋
ธ์
` : ์ ๋ณด ๊ณต์ , ํ์๋ก, ์๊ตฌ ์ฌํญ ์ ๋ฆฌ ๋ฐ ์ปจ๋ฒค์
์ ๋ฆฌ
+ - ๋ค์ํ ํ์๊ณผ ํ
ํ๋ฆฟ์ด ๊ณต์ ๋์ด ์์ด ์์ ๋กญ๊ฒ ์ปค์คํ
ํ์ฌ ๋์์ธ์ ์ผ๋ก ๊น๋ํ๊ณ ์๊ฐ์ ์ธ ์ ๋ณด๋ฅผ ์ ๊ณตํ๋ฉด์ ์์
์ํ๋ฅผ ํ ๋์ ํ์
ํ ์ ์์์ต๋๋ค.
+ - ์ค์๊ฐ ๊ณต๋ ์์
์ ํ ์ ์๊ธฐ ๋๋ฌธ์ ํ์์ ๋ํ ์๊ฒฌ์ด๋ ์ญํ ์ ๋ถ๋ดํ์ฌ ๋ฌธ์๋ฅผ ์์ฑํ๋ ๋ฑ์ ์์
์ด ์์ํ์ต๋๋ค.
+- `ํผ๊ทธ๋ง` : ๋์์ธ ๊ณต๋ ์์
์ ํ ์ ์๊ณ , CSS ์ฝ๋๋ฅผ ๋ณด๊ธฐ ์ฝ๊ธฐ ๋๋ฌธ์ ๊ฐ๋ฐ ์์ฐ์ฑ์ ๋์ผ ์ ์์์ต๋๋ค.
+- `์ปค๋ฐ ์ปจ๋ฒค์
` : ํ์
์ ํ๋ค ๋ณด๋ฉด ๋ณตํฉ์ ์ธ ์ปค๋ฐ ๋ด์ฉ์ด ๋ง์์ง๊ธฐ ๋๋ฌธ์ ์ปค๋ฐ ์ปจ๋ฒค์
์ ์ง์ ํ์ฌ ์์
์ฌํญ์ ์ฝ๊ฒ ๋ณผ ์ ์๊ฒ ํ์ต๋๋ค. ์ง์ ์์
์๊ฐ ์๋๋๋ผ๋ ์ฝ๋ ๋ณ๊ฒฝ์ ๋ํ ๋ฌธ๋งฅ์ ํ์
ํ๊ธฐ ์ฝ๊ณ ์ด๋ ฅ ์ถ์ ์ ํจ๊ณผ์ ์ผ๋ก ํ ์ ์์์ต๋๋ค.
### **์ํต**
-- ๋์ค์ฝ๋๋ก ์ฃผ 5~6ํ ํ์๋ฅผ ์งํํ์ฌ ํ ๋ฌ๊ฐ 22ํ์ ํ์๋ฅผ ์งํํ๋ค. ์ค๋ฅ ๋ฐ์์ ์ฆ๊ฐ์ ์ธ ํผ๋๋ฐฑ๊ณผ ๋ฌธ์ ํด๊ฒฐ์ด ๊ฐ๋ฅํ๋ค.
+- ๋์ค์ฝ๋๋ก ์ฃผ 5~6ํ ํ์๋ฅผ ์งํํ์ฌ ํ ๋ฌ๊ฐ ์ด 22ํ์ ํ์๋ฅผ ์งํํ์์ต๋๋ค. ์ค๋ฅ ๋ฐ์์ ํ์ ์๊ฐ์ ํ์๋ค์ด ๊ฐ์ด ๋๋๋ฉด์ ์ฆ๊ฐ์ ์ธ ํผ๋๋ฐฑ์ ํตํด ๋ฐ์ํ ๋ฌธ์ ์ ๋ํด ์ต๋ํ ๋น ๋ฅด๊ฒ ํด๊ฒฐํ ์ ์์์ต๋๋ค.
โฒ
-
+
+
+## โด๏ธ **9. ์ฃผ์ ๊ธฐ๋ฅ ์ด๋ฏธ์ง๋ก ํ์ธํ๊ธฐ**
-## โด๏ธ **9. ์ฃผ์ ๊ธฐ๋ฅ ์๊ฐ**
### 1) ํ
-|์์ ํ๋ฉด|ํ์๊ฐ์
ํ์ด์ง|ํ๋กํ ์ค์ ํ์ด์ง|
-|---|---|---|
-|![splash](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/3a28142f-cfa4-459b-8a6a-f7dafe4676d9)|![ํ์๊ฐ์
](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/0596e112-fba7-415a-9be6-90f50f5cfb8b)|![ํ๋กํ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/bed27d45-d7a6-4e8b-9265-d7acd9b07842)|
-|๋ก๊ทธ์ธ ํ์ด์ง|ํผ๋ ํ์ด์ง|๊ฒ์ ํ์ด์ง|
-|:---:|:---:|:---:|
-|![๋ก๊ทธ์ธ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/dd7f1b16-9cc5-4fef-9916-67e5f5b911df)|![ํผ๋](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/003c44c1-622b-45f2-962c-24ae6a43eaaa)|![๊ฒ์](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/bc32ad5a-e1c8-4ff4-90a0-7472fb6ada15)|
+| ์์ ํ๋ฉด | ํ์๊ฐ์
ํ์ด์ง | ํ๋กํ ์ค์ ํ์ด์ง |
+| ----------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
+| ![splash](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/3a28142f-cfa4-459b-8a6a-f7dafe4676d9) | ![ํ์๊ฐ์
](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/0596e112-fba7-415a-9be6-90f50f5cfb8b) | ![ํ๋กํ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/bed27d45-d7a6-4e8b-9265-d7acd9b07842) |
+
+| ๋ก๊ทธ์ธ ํ์ด์ง | ํผ๋ ํ์ด์ง | ๊ฒ์ ํ์ด์ง |
+| :---------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------: |
+| ![๋ก๊ทธ์ธ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/dd7f1b16-9cc5-4fef-9916-67e5f5b911df) | ![ํผ๋](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/003c44c1-622b-45f2-962c-24ae6a43eaaa) | ![๊ฒ์](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/bc32ad5a-e1c8-4ff4-90a0-7472fb6ada15) |
### 2) ์ฑํ
-|์ฑํ
๋ชฉ๋ก, ์ฑํ
๋ฐฉ ํ์ด์ง|404ํ์ด์ง|
-|---|---|
-|![์ฑํ
๋ชฉ๋ก, ์ฑํ
๋ฐฉ ํ์ด์ง](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/1e2eddc2-fe82-42d0-99f7-5fc02e3527b6)||
+
+| ์ฑํ
๋ชฉ๋ก, ์ฑํ
๋ฐฉ ํ์ด์ง | 404ํ์ด์ง |
+| ----------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
+| ![์ฑํ
๋ชฉ๋ก, ์ฑํ
๋ฐฉ ํ์ด์ง](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/1e2eddc2-fe82-42d0-99f7-5fc02e3527b6) | |
### 3) ๊ฒ์๊ธ
-|๊ฒ์๊ธ ์์ธ ํ์ด์ง|๊ฒ์๊ธ ์์ฑ ํ์ด์ง|๊ฒ์๊ธ ์์ ํ์ด์ง|
-|---|---|---|
-|||![แแ
ฆแแ
ตแแ
ฎแฏแแ
ฎแแ
ฅแผ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/a205ccbb-0050-4ee2-a70a-f42c01783625)|
-|๊ฒ์๊ธ ์ญ์ |๊ฒ์๊ธ ์ ๊ณ |์ข์์, ๋๊ธ ๊ธฐ๋ฅ|
-|:---:|:---:|:---:|
-|![แแ
ฌแแ
ฉแผ_แแ
ฆแแ
ตแแ
ณแฏแแ
กแจแแ
ฆ_AdobeExpress](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/b885415b-a204-4f33-86f9-c46218ac2646)|||
+| ๊ฒ์๊ธ ์์ธ ํ์ด์ง | ๊ฒ์๊ธ ์์ฑ ํ์ด์ง | ๊ฒ์๊ธ ์์ ํ์ด์ง |
+| --------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
+| | | ![แแ
ฆแแ
ตแแ
ฎแฏแแ
ฎแแ
ฅแผ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/a205ccbb-0050-4ee2-a70a-f42c01783625) |
+
+| ๊ฒ์๊ธ ์ญ์ | ๊ฒ์๊ธ ์ ๊ณ | ์ข์์, ๋๊ธ ๊ธฐ๋ฅ |
+| :-----------------------------------------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------: |
+| ![แแ
ฌแแ
ฉแผ_แแ
ฆแแ
ตแแ
ณแฏแแ
กแจแแ
ฆ_AdobeExpress](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/b885415b-a204-4f33-86f9-c46218ac2646) | | |
### 4) ํ๋กํ
-|ํ๋กํ ํ์ด์ง|ํ๋กํ ์์ ํ์ด์ง|
-|---|---|
-|![แแแ
ณแ
แ
ฉแแ
ตแฏ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/205e27b1-fde8-4e4d-b263-dbd2dc711643)|![ํ๋กํ ์์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/a3ab6dbf-7404-41fb-a6e8-9e28271ce2c7)|
-|ํ๋ก์/ํ๋ก์ ํ์ด์ง|๋ก๊ทธ์์ ๊ธฐ๋ฅ|
-|:---:|:---:|
-|![แแ
กแฏแ
แ
ฉแแ
ฎแแ
ฆแแ
ตแแ
ต](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/4809b56a-f84d-4893-bbf7-01ab448fcc89)|![แ
แ
ฉแแ
ณแแ
กแแ
ฎแบ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/a3e3f93c-ec16-4170-a750-1dde2f647ecc)|
+| ํ๋กํ ํ์ด์ง | ํ๋กํ ์์ ํ์ด์ง |
+| ----------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
+| ![แแแ
ณแ
แ
ฉแแ
ตแฏ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/205e27b1-fde8-4e4d-b263-dbd2dc711643) | ![ํ๋กํ ์์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/a3ab6dbf-7404-41fb-a6e8-9e28271ce2c7) |
+| ํ๋ก์/ํ๋ก์ ํ์ด์ง | ๋ก๊ทธ์์ ๊ธฐ๋ฅ |
+| :----------------------------------------------------------------------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------: |
+| ![แแ
กแฏแ
แ
ฉแแ
ฎแแ
ฆแแ
ตแแ
ต](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/4809b56a-f84d-4893-bbf7-01ab448fcc89) | ![แ
แ
ฉแแ
ณแแ
กแแ
ฎแบ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/a3e3f93c-ec16-4170-a750-1dde2f647ecc) |
### 5) ํ๋งค ์ํ
-|์ํ ๋ฑ๋ก ํ์ด์ง|์ํ ์์ ํ์ด์ง|์ํ ์ญ์ ํ์ด์ง|
-|---|---|---|
-|![์ํ ๋ฑ๋ก ๋ฐ ํ๋งค ์ฌ์ดํธ ์ด๋](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/4ac18b0c-2c37-4e2e-93ee-38408ec09d56)|![์ํ ์์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/bcedf8f1-4df9-419f-aefd-fcc723cd9a93)|![์ํ ์ญ์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/5c4bb01c-1907-4d81-8f09-2b9e9cb2b964)|
+| ์ํ ๋ฑ๋ก ํ์ด์ง | ์ํ ์์ ํ์ด์ง | ์ํ ์ญ์ ํ์ด์ง |
+| ---------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
+| ![์ํ ๋ฑ๋ก ๋ฐ ํ๋งค ์ฌ์ดํธ ์ด๋](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/4ac18b0c-2c37-4e2e-93ee-38408ec09d56) | ![์ํ ์์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/bcedf8f1-4df9-419f-aefd-fcc723cd9a93) | ![์ํ ์ญ์ ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/assets/64193469/5c4bb01c-1907-4d81-8f09-2b9e9cb2b964) |
+
+
## โด๏ธ **10. ์์ธ ๋ด๋น ์
๋ฌด**
-### ๐ค ๊ณตํต
+### **๐ค ๊ณตํต**
- ์ปจ๋ฒค์
์ง์
- ์ปค๋ฐ ๋ฉ์์ง ์ปจ๋ฒค์
, ์ฝ๋ ์ปจ๋ฒค์
, ๋ค์ด๋ฐ ์ปจ๋ฒค์
, ๋๋ ํ ๋ฆฌ ๊ตฌ์กฐ, Styled-Components ์ปจ๋ฒค์
@@ -345,6 +379,8 @@ li๋ด์ ์คํ์ผํ ์์๊ฐ 3๊ฐ์ด์์ด๋ฉด li๋ฅผ Item์ผ๋ก ๋นผ๊ธฐ
- ๋ฒ๊ทธ ๊ด๋ฆฌ
- ์๊ตฌ์ฌํญ ๋ฌธ์ ์์ฑ
+
+
### **๐ค ๋์**
**๐จ ๋์์ธ**
@@ -384,6 +420,8 @@ li๋ด์ ์คํ์ผํ ์์๊ฐ 3๊ฐ์ด์์ด๋ฉด li๋ฅผ Item์ผ๋ก ๋นผ๊ธฐ
- ๋ก๋ฉ ํ์ด์ง
- ํ์๊ฐ์
ํ ๋ก๊ทธ์ธ ํ์ด์ง๋ก ์ด๋ํ๋ ๋ก๋ฉํ์ด์ง
+
+
### **๐ค ์ง์**
**๐ฅ๏ธ ํ๋ฉด ๊ฐ๋ฐ**
@@ -411,6 +449,8 @@ li๋ด์ ์คํ์ผํ ์์๊ฐ 3๊ฐ์ด์์ด๋ฉด li๋ฅผ Item์ผ๋ก ๋นผ๊ธฐ
- ์ต๊ทผ ๊ฒ์ ๊ธฐ๋ก์ LocalStorage์ ์ ์ฅํ์ฌ ์ต๊ทผ ๊ฒ์ ํ์
- ๊ฒ์ ๊ฒฐ๊ณผ ๋๋ณด๊ธฐ ๊ธฐ๋ฅ ๊ตฌํ
+
+
### **๐ค ๋ฏธํ**
**๐ ํ๋ก์ ํธ ์ด๊ด ๋ฐ ๋ฌธ์ํ**
@@ -466,6 +506,8 @@ li๋ด์ ์คํ์ผํ ์์๊ฐ 3๊ฐ์ด์์ด๋ฉด li๋ฅผ Item์ผ๋ก ๋นผ๊ธฐ
- BottomSheet ์ปดํฌ๋ํธ์ ์ฌ์ฌ์ฉ์ฑ์ ์ํด [์ปดํฌ๋ํธ ๋ฆฌํฉํ ๋ง](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/pull/60#issue-1762148761)
- ๋ฌดํ ์คํฌ๋กค๋ง์ ์ํ Observer API ์ ์ฉ ์ฝ๋๋ฅผ [useObserver Hooks](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/commit/f20184e1ca6d45d64c22d3759b3ddc4a8e030bf3#diff-da3b68ddf380656f1e921fab250e05fef03fd5e46c30c4cddb7d74bcd804a483)๋ก ๋ง๋ค์ด ์ฌ์ฉ
+
+
### **๐ค ๋ณด์**
**๐ฅ๏ธ ํ๋ฉด ๊ฐ๋ฐ**
@@ -503,17 +545,18 @@ li๋ด์ ์คํ์ผํ ์์๊ฐ 3๊ฐ์ด์์ด๋ฉด li๋ฅผ Item์ผ๋ก ๋นผ๊ธฐ
11-(1) ์ฃผ์ด์ง API์์ ๋ฐ์ดํฐ ํํฐ๋งํ๊ธฐ
-- ์ฃผ์ด์ง api๋ฅผ ๊ทธ๋๋ก ์ฌ์ฉํด์๋ ๋ชจ๋ ๋ฐ์ดํฐ ์ค ๋ฐฉ๊พธ์์ ๋ฐ์ดํฐ๋ง ๋ถ๋ฌ์ฌ ์ ์์์ต๋๋ค. ๋ฐ๋ผ์ content์ โspaceโ, โkeywordโ๋ฅผ ์ถ๊ฐํ์ฌ ์ด๋ค์ด ํฌํจ๋ ๋ฐ์ดํฐ๋ง ํํฐ๋งํ์ฌ ๋ชจ๋ ๋ฐ์ดํฐ๋ฅผ ๋ณด์ฌ์ฃผ์์ต๋๋ค.
+- ๊ฒ์๋ฌผ์ ๊ณต๊ฐ ์ ๋ณด์ ์ํ์ ํค์๋ ์ ๋ณด๋ฅผ ์ ์ฅํ๊ธฐ ์ํด ๋ฐฉ๊พธ์์์๋ ์ฃผ์ด์ง ๊ธฐ์กด api ๋ช
์ธ์ ๋ฐ์ดํฐ ํ์๊ณผ๋ ๋ค๋ฅธ ๋ฐ์ดํฐ ํ์์ ์๊ฐํ์ต๋๋ค. ๊ฒ์๊ธ์ content์๋ "space", "detail"์ ํค๋ฅผ ๊ฐ์ง ๊ฐ์ฒด๋ฅผ ๋ฌธ์์ด๋ก ์ ์ฅํ๊ณ , ์ํ์ itemName์๋ "name", "keyword"์ ํค๋ฅผ ๊ฐ์ง ๊ฐ์ฒด๋ฅผ ๋ฌธ์์ด๋ก ์ ์ฅํ์ฌ ์๋์ ๊ฐ์ ํํ๋ก ์ฌ์ฉ๋๊ณ ์์ต๋๋ค.
-```json
-content: '{"space":"์นจ์ค","detail":"์ฌํฐ ํจ๋ธ๋ฆญ์ผ๋ก ์นจ์ค์ ๋ถ์๊ธฐ๋ฅผ ๋ฐ๊ฟ ์๋ ์๋ต๋๋ค!"}โ
-itemName: '{"name":"๋
ธ๋์ ์คํ ๋","keywordโ:"์กฐ๋ช
"}โ
+```javascript
+content: '{"space":"์นจ์ค","detail":"์ฌํฐ ํจ๋ธ๋ฆญ์ผ๋ก ์นจ์ค์ ๋ถ์๊ธฐ๋ฅผ ๋ฐ๊ฟ ์๋ ์๋ต๋๋ค!"}',
+itemName: '{"name":"๋
ธ๋์ ์คํ ๋","keyword":"์กฐ๋ช
"}'
```
-- ๋ํ ์ฝ 6000๊ฐ์ ๋ชจ๋ ๋ฐ์ดํฐ๋ฅผ ๋ถ๋ฌ์จ ํ ํํฐ๋งํ๋ฉด ํ๋ฉด์ ๋ณด์ฌ์ฃผ๊ธฐ๊น์ง์ ์๋๊ฐ ๋งค์ฐ ๋๋ ค์ง๊ธฐ ๋๋ฌธ์ useInfiniteQuery๋ฅผ ์ฌ์ฉํ์ฌ limit๋ฅผ 100์ผ๋ก ์ค์ ํ์ฌ ๋ฐ์ดํฐ๋ฅผ 100๊ฐ์ฉ ๋ถ๋ฌ์ ํํฐ๋งํ๋ ๋ฐฉ์์ผ๋ก ๊ตฌํํ์ฌ ๋ก๋ฉ ์๋๋ฅผ ๊ฐ์ ํ์ต๋๋ค.
- [โจ feat: ํํ์ด์ง ์ ์ฒด ๋ชฉ๋ก ๋ก๋ฉ ์๋ ์ค์ด๊ธฐ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/commit/15e880b003785dd84e3aaf7cbb6e407c44be34c5)
+- ์ฃผ์ด์ง api์์ ๋ถ๋ฌ์จ ์ ์ฒด ๋ฐ์ดํฐ ์ค ๊ณต๊ฐ ์ ๋ณด๋ฅผ ๊ฐ์ง๊ณ ์๋ ๊ฒ์๋ฌผ๋ค๋ง์ ํ ํ์ด์ง์์ ๋ณด์ฌ์ฃผ๊ธฐ ์ํด์๋ ๋ณ๋๋ก ํํฐ๋ง์ ํด์ฃผ์ด์ผ๋ง ํ์ต๋๋ค.
+- ์ฝ 6000๊ฐ์ ๋ชจ๋ ๋ฐ์ดํฐ๋ฅผ ๋ถ๋ฌ์จ ํ ํํฐ๋งํ๋ฉด ํ๋ฉด์ ๋ณด์ฌ์ฃผ๊ธฐ๊น์ง์ ์๋๊ฐ ๋งค์ฐ ๋๋ ค์ง๊ธฐ ๋๋ฌธ์ useInfiniteQuery๋ฅผ ์ฌ์ฉํ์ฌ limit๋ฅผ 100์ผ๋ก ์ค์ ํ์ฌ ๋ฐ์ดํฐ๋ฅผ 100๊ฐ์ฉ ๋ถ๋ฌ์ ํํฐ๋งํ๋ ๋ฐฉ์์ผ๋ก ๊ตฌํํ์ฌ ์ฝ 5-7์ด์ ๋ก๋ฉ ์๋์์ 0.9์ด-1.85์ด๋ก ๋ก๋ฉ ์๋๋ฅผ ์ต์ 30%, ์ต๋ 61% ๋งํผ ๊ฐ์ ํ์ต๋๋ค.
+ [์์
์ปค๋ฐ - โจ feat: ํํ์ด์ง ์ ์ฒด ๋ชฉ๋ก ๋ก๋ฉ ์๋ ์ค์ด๊ธฐ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/commit/15e880b003785dd84e3aaf7cbb6e407c44be34c5)
```jsx
const {
@@ -553,7 +596,9 @@ useEffect(() => {
11-(2) STEP์ ์ฌ์ฉํ ๊ฒ์๊ธ ์
๋ก๋ ๊ณผ์
-`PostUploadPage` ์ปดํฌ๋ํธ๋ `useState` ํ
์ ํ์ฉํ์ฌ โ์ฌ์ง ์ ํโ, โ์ํํ๊ทธ ์ถ๊ฐโ, โ๊ฒ์๊ธ ์์ฑโ๊ณผ ๊ฐ์ ์
๋ก๋ ๋จ๊ณ๋ฅผ ๊ด๋ฆฌํฉ๋๋ค. ํ์ฌ `step`์ ๋ฐ๋ผ ํด๋นํ๋ ๋ ์ด์์์ ๋ ๋๋งํ์ฌ ์ฌ์ฉ์๊ฐ ๋จ๊ณ๋ณ๋ก ํ ํ์ด์ง์ ํ ๊ฐ์ง ํ๋๋ง ํ๋๋ก ์ ๋ํ์ฌ ์ฌ์ฉ์ ๊ฒฝํ์ ๊ฐ์ ํ์ต๋๋ค.
+`PostUploadPage` ์ปดํฌ๋ํธ๋ `useState` ํ
์ ํ์ฉํ์ฌ โ์ฌ์ง ์ ํโ, โ์ํํ๊ทธ ์ถ๊ฐโ, โ๊ฒ์๊ธ ์์ฑโ๊ณผ ๊ฐ์ ์
๋ก๋ ๋จ๊ณ๋ฅผ ๊ด๋ฆฌํฉ๋๋ค. [ํ ์ค ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ useFunnel](https://slash.page/ko/libraries/react/use-funnel/readme.i18n/)์์ ์ฌ์ฉ๋๋ ํผ๋ ํจํด์์ ๊ธฐ๋ฐํ์ฌ ํ์ฌ `step`์ ๋ฐ๋ผ ํด๋นํ๋ ๋ ์ด์์์ ๋ ๋๋งํ๊ณ ์ฌ์ฉ์๊ฐ ๋จ๊ณ๋ณ๋ก ํ ํ์ด์ง์ ํ ๊ฐ์ง ํ๋๋ง ํ๋๋ก ์ ๋ํ์ฌ ์ฌ์ฉ์ ๊ฒฝํ์ ๊ฐ์ ํ์ต๋๋ค.
+
+๋ํ ์ด๋ฌํ ํจํด์ผ๋ก ์ธํด ํ ํ์ด์ง์ ํ๋ฆ์ ํ ๋์ ์์๋ณผ ์ ์์๊ณ , ๊ฐ ๋จ๊ณ์ ์ํ๋ฅผ ํ ๊ณณ์์ ๊ด๋ฆฌํ๊ธฐ ์ฌ์ ์ต๋๋ค.
```jsx
export default function PostUploadPage() {
@@ -693,6 +738,7 @@ export const canSelectProductSelector = selector({
11-(4) ์ปค์คํ
ํ
`useInputs.js`
+
- input์ ์
๋ ฅํด์ผํ๋ ๊ฐ์ ๋ฐ๋ผ ์
๋ ฅ ๊ฐ์ ์ ์ฅํ๋ ํจ์, ํฌ์ปค์ค๋ฅผ ์์์ ๋ validate๋ฅผ ์ฒดํฌํ์ฌ ์๋ฌ ๋ฉ์์ง๋ฅผ ์ค์ ํ๋ ํจ์๊ฐ ํ์ํ์ต๋๋ค.
- ๋ฐ๋ผ์ useInputs ์ปค์คํ
ํ
์ ๋ง๋ค์ด ์ค๋ณต์ผ๋ก ์์ฑ๋ ์ฝ๋๋ฅผ ๋ฐฉ์งํ์์ต๋๋ค.
@@ -719,17 +765,18 @@ export const canSelectProductSelector = selector({
[โป๏ธย refactor: ๋ค๋ฅธ ์๋น์ค ์ฌ์ฉ์ ๊ฒฝ์ฐ ๊ฒ์๊ธ ๋ฐ ์ํ ์์ธ ์ฒ๋ฆฌ](https://github.com/FRONTENDSCHOOL5/final-14-BangKKuseok/pull/144)
-์ฃผ์ด์ง ์๋น์ค api๋ฅผ ๋ค๋ฅธ ์๋น์ค์ ๊ณต์ ํ๊ณ ์์ด, ๋ค๋ฅธ ์ด์ฉ์๋ ๊ฒ์๋๊ณ ํ๋ก์ฐ๋๋ ๋ฌธ์ ๊ฐ ๋ฐ์ํ์ฌ, ํด๋น ์ ์ ์ ํ๋กํ์ ๋ค์ด๊ฐ๊ฒ๋ ๊ฒฝ์ฐ ํด๋น ๊ฒ์๊ธ์๋ ์๋ฌ๊ฐ ๋ฐ์ํ์ต๋๋ค. ์ด๋ฅผ ํด๊ฒฐํด์ฃผ๊ธฐ ์ํด ๊ฒ์๊ธ์ space๊ฐ์ด ์์ ๊ฒฝ์ฐ, ์ํ์ keyword๊ฐ ์๋ ๊ฒฝ์ฐ์ ๋ํ ์์ธ์ฒ๋ฆฌ๋ฅผ ์งํํ์ต๋๋ค. ๋ํ ์๋น์ค๋ง๋ค ์ด๋ฏธ์ง๋ฅผ ๋ฐ๋ ํ์์ ์ฐจ์ด๊ฐ ์์ด ๋๋ถ๋ถ์ ๊ฒฝ์ฐ๋ฅผ ๊ณ ๋ คํ ์์ธ์ฒ๋ฆฌ๋ฅผ ํ๊ณ , ์ด๋ฏธ์ง์ ์ค๋ฅ๊ฐ ์์ ๊ฒฝ์ฐ ๊ธฐ๋ณธ์ด๋ฏธ์ง๋ก ๋์ฒดํ์์ต๋๋ค.
+์ฃผ์ด์ง ์๋น์ค api๋ฅผ ๋ค๋ฅธ ์๋น์ค์ ๊ณต์ ํ๊ณ ์์ด, ๋ค๋ฅธ ์ด์ฉ์๋ ๊ฒ์๋๊ณ ํ๋ก์ฐ๋๋ ๋ฌธ์ ๊ฐ ์์์ต๋๋ค. ํด๋น ์ ์ ์ ํ๋กํ์ ๋ค์ด๊ฐ๊ฒ๋ ๊ฒฝ์ฐ ๋ฐฉ๊พธ์ ์๋น์ค์๋ ๋ค๋ฅธ ๋ฐ์ดํฐ ํํ๋ฅผ ๊ฐ์ง๊ณ ์๊ธฐ ๋๋ฌธ์ ์ ์ ๊ฐ ์์ฑํ ๊ฒ์๊ธ ๋ชฉ๋ก๊ณผ ํ๋งค์ค์ธ ์ํ ๋ชฉ๋ก์ ์๋ฌ๊ฐ ๋ฐ์ํ์ต๋๋ค.
+
+์ด๋ฅผ ํด๊ฒฐํด์ฃผ๊ธฐ ์ํด ๊ฒ์๊ธ์ด spaceํค ๊ฐ์ ๊ฐ์ง๊ณ ์์ง ์์ ๊ฒฝ์ฐ, ์ํ์ด keyword ํค ๊ฐ์ ๊ฐ์ง๊ณ ์์ง ์์ ๊ฒฝ์ฐ์ ๋ํ ์์ธ์ฒ๋ฆฌ๋ฅผ ์งํํ์ต๋๋ค. ๋ํ ์๋น์ค๋ง๋ค ์ด๋ฏธ์ง๋ฅผ ๋ฐ๋ ํ์์ ์ฐจ์ด๊ฐ ์์ด ๋๋ถ๋ถ์ ๊ฒฝ์ฐ๋ฅผ ๊ณ ๋ คํ ์์ธ์ฒ๋ฆฌ๋ฅผ ํ๊ณ , ์ด๋ฏธ์ง์ ์ค๋ฅ๊ฐ ์์ด ๊นจ์ง ์ด๋ฏธ์ง๊ฐ ๋ณด์ผ ๊ฒฝ์ฐ๋ฅผ ๋๋นํ์ฌ ๊ธฐ๋ณธ ์ด๋ฏธ์ง๋ก ๋์ฒดํ์์ต๋๋ค.
-
-
+
11-(2) QueryClient Invalide Query ์ ์ฉํ๊ธฐ.
-- ๊ธฐ์กด์ ํ๋ก์ฐ ์์ฒญ์ ๋ณด๋ด๋ฉด, ํ๋ก์ฐ ์์ฒญ์ ์ฑ๊ณตํ์ง๋ง ๊ธฐ์กด ๋ฐ์ดํฐ๊ฐ ๊ทธ๋๋ก ์บ์๋์ด์์ด ์๋ก๊ณ ์นจ์ ํด์ผ๋ง ํ๋ก์ฐ ๋ฆฌ์คํธ๋ฅผ ๋ค์ ๋ถ๋ฌ์ ๋ฐ์๋๋ ๋ฌธ์ ๊ฐ ๋ฐ์ํ์ต๋๋ค
+- ๊ธฐ์กด์ ํ๋ก์ฐ ์์ฒญ์ ๋ณด๋ด๋ฉด, ํ๋ก์ฐ ์์ฒญ์ ์ฑ๊ณตํ์ง๋ง ๊ธฐ์กด ๋ฐ์ดํฐ๊ฐ ๊ทธ๋๋ก ์บ์๋์ด์์ด ์๋ก๊ณ ์นจ์ ํด์ผ๋ง ํ๋ก์ฐ ๋ฆฌ์คํธ๋ฅผ ๋ค์ ๋ถ๋ฌ์ ๋ฐ์๋๋ ๋ฌธ์ ๊ฐ ๋ฐ์ํ์ต๋๋ค.
```jsx
// ๊ธฐ์กด ์ฝ๋
@@ -744,7 +791,9 @@ const postFollowMutation = useMutation(postFollow, {
});
```
-
+
+
+
- ๐ช ํด๊ฒฐ ๋ฐฉ๋ฒ: react query์ Query Client์์ invalidateQueries()๋ฅผ ์ฌ์ฉํ์ฌ ๊ธฐ์กด์ ์กฐํํ๋ ์ฟผ๋ฆฌ๋ฅผ ๋ฌดํจํ์ํค๊ณ ๋ฐ์ดํฐ๋ฅผ ์๋ก ์กฐํํด์ฌ ์ ์๋ค.
@@ -760,7 +809,7 @@ const postFollowMutation = useMutation(postFollow, {
});
```
-
+
@@ -791,6 +840,7 @@ const postFollowMutation = useMutation(postFollow, {
๋
ธ์
์ ์ฒ์ ์๊ธฐ์๊ฐ๋ฅผ ์์ฑํ๊ณ , ํ๊ณ ์กฐ์ ๋ง๋ ์๋จน์๋จนํ๋ ๋๊ฐ ์์ง๋ ์๊ทธ์ ๊ฐ์๋ฐ ๋ฒ์จ 4๊ฐ์์ด๋ผ๋ ์๊ฐ์ด ์ง๋ ๋ฉ์ฌ ํ ํ๋ก์ ํธ ๋ฐํ๋ ์ด ์๋ค๋๊ฒ ์์ง๋ ๋ฏฟ๊ฒจ์ง์ง ์์ต๋๋คใ
ใ
์ ๋๋ก ํ ํ๋ก์ ํธ๋ฅผ ํด๋ณธ ๊ฑด ์ด๋ฒ์ด ์ฒ์์ด๋ผ ๊น์ ๋ค๋ฃจ๋ฉด์ ๋๋ ๋ง์ด ํ๋ฆฌ๊ณ ์ค๋ฅ๋ ๋ฌผ๋ก ๋ง์ด ๋ง์ฃผ์น๊ฒ ๋์ต๋๋ค..ใ
ใ
๋ถ์กฑํ ์ ์์์๋ ํญ์ ์ข์ ๋ฐ์์ ํด์ฃผ๊ณ , ๋์๋ ๋ง๋คํ์ง ์๊ณ ๋ฐ๋ผ์์ฃผ์ ์ค๋ฆฌ๋ถ๋ค๊ป ๊ฐ์ฌํ๋จ ๋ง์์ ๋๋ฆฌ๊ณ ์ถ์ต๋๋ค! ๋๋ถ์ ์ฐ๋ฆฌ๊ฐ ์ฒ์ ๋ชฉํํ๋ ๋ค์ํ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ์ฌ์ฉ, ํ์
๊ฒฝํ, ๊ทธ๋ฆฌ๊ณ ์ ๋ง๋ฌด๋ฆฌํ๋ ๋ฐฉ๋ฒ๊น์ง ์ฐจ๊ณก์ฐจ๊ณก ์์์ ๋ ํ๋์ ๊ธฐ์ต ์กฐ๊ฐ์ ๋ง๋ค ์ ์์์ต๋๋ค. ๋ชฉํํ๋ ๊ฒ์ ๋ฌ์ฑํ ์ด๋ฒ ๊ฒฝํ์ ํ ๋๋ก ์์ผ๋ก์ ๋ชฉํ๋ค๋ ์์ ๊ฐ ์๊ฒ 'ํ ์ ์๋ค'๋ ๋ง์์ ๊ฐ์ง๊ณ ๋์๊ฐ ์ ์๊ธธ ๋ฐ๋์! ํ ์ธ์๋ ๋์์ ์ค ๋ฉํ ๋, ๊ฐ์ฌ๋, ๋งค๋์ ๋, ๋ฉ์ฌ 5๊ธฐ ์ด๋ ค๋ถ๋ค๋ ๋๋ฌด ๊ฐ์ฌํ๊ณ , ์๊ณ ๋ง์ผ์
จ์ต๋๋ค. ์ถํ ์์ ๋ฆฌํฉํ ๋ง์์ ๋ค์ ๋ง๋์ var var๐๏ธ๐๏ธ
### ๐ ์ค์ง์
+
์ฒ์ ์ ํด๋ณธ ๋ฆฌ์กํธ๋ก ์งํํ๋ ํํ๋ก์ ํธ๋ผ ์ฒ์์ ๊ฑฑ์ ์ด ๋๊ธฐ๋ ํ์ง๋ง ์ข์ ํ์๋ถ๋ค์ ๋ง๋ ์ด๋ ๊ฒ ์ ๋ง๋ฌด๋ฆฌํ ์ ์์๋ ๊ฒ ๊ฐ์ต๋๋ค. ์ปจ๋ฒค์
์ ์ ํ๊ณ , ๊น, ๊น์ด์, pr์ ์ฌ์ฉํ์ฌ ์กฐ๊ธ ๋ ์ฒด๊ณ์ ์ผ๋ก ํ๋ก์ ํธ๋ฅผ ์งํํ๋ ๊ฒฝํ์ ํด๋ณธ ๊ฒ์ด ์ข์๊ณ ๋ฌด์๋ณด๋ค ์ ๋ฆ๊ณผ ๊ดํ๋ฌธ์ ํ์๋ถ๋ค์ด๋ ๋ค๋๋ฉด์ ๋ง๋์ ํจ๊ป ํ๋ก์ ํธ๋ฅผ ์งํํ๋ ์ ์ด ์ข์์ต๋๋ค. ๋งจ๋ ๋ชจ๋ฅด๋ ๊ฒ ํฌ์ฑ์ด๋ผ ํ์๋ถ๋ค์ ๋ง์ด ๊ดด๋กญํ์ง๋ง ์์์ ํญ์ ๋ง์ด ๋์์ฃผ์๊ณ ์์ํด์ฃผ์ ํ์๋ถ๋ค ๋๋ฌด ๊ฐ์ฌํ๊ณ ์๊ณ ๋ง์ผ์
จ์ต๋๋ค!
### ๐ฅฐย ์ด๋ณด์