| ์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 |
- Java
- ํฌ๋ก์ค์ฌ์ดํธ ์คํฌ๋ฆฝํธ
- db์ํคํ ์ณ
- Node.js
- spring
- ์ฟ ๋ฒ๋คํฐ์ค
- React
- ์ค๋ธ์
- injection๊ณต๊ฒฉ
- db์ ๋ต
- node.js mysql ์ฐ๋
- ์๋ฐ
- java17
- GoogleLogin
- @scheduler
- java์ฑํ
- spring scheduler
- CICD
- oauth
- ๋์์ธํจํด
- WebScoket
- Jenkins
- ํฐ์คํ ๋ฆฌ์ฑ๋ฆฐ์ง
- MySQL
- ์ฝ๋ฉํ ์คํธ
- ์ฝํ
- ์๊ณ ๋ฆฌ์ฆ
- SpringBoot
- docker
- WebChat
- Today
- Total
๋ชฉ๋ก์ ์ฒด ๊ธ (46)
<Hello Hosung๐/>
์ด์ ๊ธ์์๋ Spring Boot Filter ์ค๊ณ๋ฅผ ์์๋ณด์๋ค.Filter๋ Servlet ๋ ๋ฒจ์์ ๋์ํ๋ฉฐ ๋ชจ๋ ์์ฒญ์ ๊ฐ์ฅ ๋จผ์ ๊ฐ๋ก์ฑ๋ ๊ตฌ์กฐ์๋ค.์ด๋ฒ ๊ธ์์๋ Spring MVC ๋ ๋ฒจ์์ ๋์ํ๋ Interceptor๋ฅผ ์ค๊ณํด๋ณด์.1. Spring Boot ์์ฒญ ์ฒ๋ฆฌ ํ๋ฆSpring Boot์ ์์ฒญ ํ๋ฆ์ ๋ค์ ๋ณด๋ฉด ๋ค์๊ณผ ๊ฐ๋ค.Client ↓Filter ↓Spring Security Filter ↓DispatcherServlet ↓Interceptor ↓Controller ↓Service ↓Mapper (MyBatis) ↓Database ํต์ฌ ํฌ์ธํธFilter ์ดํ์ ์คํ๋๋คController ํธ์ถ ์ ํ๋ฅผ ์ ์ดํ ์ ์๋คSpring MVC ๋ ๋ฒจ์์ ๋์ํ๋ค๊ทธ๋์ ๋ณดํต ์ธ์ฆ / ๊ถํ / API ..
1. Filter๋ ๋ฌด์์ธ๊ฐFilter๋ Servlet ์คํ์์ ์ ๊ณตํ๋ ๊ธฐ๋ฅ์ผ๋ก, HTTP ์์ฒญ๊ณผ ์๋ต์ ๊ฐ๋ก์ฑ์ด ๊ณตํต ๋ก์ง์ ์ฒ๋ฆฌํ ์ ์๋ ์ปดํฌ๋ํธ์ด๋ค.Spring Boot์์๋ DispatcherServlet ์ด์ ๋จ๊ณ์์ ์คํ๋๋ค.์ฆ ์์ฒญ ํ๋ฆ์ ๋ค์๊ณผ ๊ฐ๋ค.Client ↓Filter ↓DispatcherServlet ↓Spring MVC ๋ฐ๋ผ์ Filter๋ Spring MVC์ ๊ด๊ณ์์ด ๋ชจ๋ ์์ฒญ์ ์ฒ๋ฆฌํ ์ ์๋ค.2. Filter์ ์ฃผ์ ์ฌ์ฉ ๋ชฉ์ ์ค๋ฌด์์ Filter๋ ๋ณดํต ๋ค์๊ณผ ๊ฐ์ ๋ชฉ์ ์ผ๋ก ์ฌ์ฉ๋๋ค.1) ์์ฒญ ๋ก๊ทธ ๊ธฐ๋กGET /users/1POST /orders API ์์ฒญ ๋ก๊ทธ๋ฅผ ๋จ๊ธธ ๋ ์ฌ์ฉ๋๋ค. 2) TraceId ์์ฑ๋ถ์ฐ ์์คํ ์์ ์์ฒญ ํ๋๋ฅผ ์ถ์ ํ๊ธฐ ์ํ ID๋ฅผ ์์ฑํ๋ค.์..
Spring Boot ์์ฒญ ํ๋ฆ ์ดํด (Request Lifecycle) Spring Boot๋ก API ์๋ฒ๋ฅผ ๊ฐ๋ฐํ ๋ ๊ฐ์ฅ ์ค์ํ ๊ฒ ์ค ํ๋๋ ์์ฒญ(Request)์ด ์๋ฒ ๋ด๋ถ์์ ์ด๋ป๊ฒ ์ฒ๋ฆฌ๋๋์ง ์ดํดํ๋ ๊ฒ์ด๋ค.๋ง์ ๊ฐ๋ฐ์๋ค์ด Controller, Service, Repository๋ง ์ฌ์ฉํ์ง๋ง ์ค์ ์์ฒญ์ ๊ทธ๋ณด๋ค ํจ์ฌ ๋ง์ ๊ณผ์ ์ ๊ฑฐ์ณ ์ฒ๋ฆฌ๋๋ค.์ด๋ฒ ๊ธ์์๋ ํด๋ผ์ด์ธํธ ์์ฒญ์ด ์๋ฒ์ ๋์ฐฉํด ์๋ต์ด ๋ฐํ๋๊ธฐ๊น์ง์ ์ ์ฒด ํ๋ฆ์ ์ดํด๋ณธ๋ค.1. ์ ์ฒด ์์ฒญ ์ฒ๋ฆฌ ํ๋ฆSpring Boot์์ HTTP ์์ฒญ์ ์๋์ ๊ฐ์ ์์๋ก ์ฒ๋ฆฌ๋๋ค.Client Request ↓Filter ↓DispatcherServlet ↓Interceptor ↓Argument Resolver ..
์ด์ ๊ธ 1ํธ: JWT๋? - ๊ฐ๋ ๊ณผ ์๋ฆฌ ์๋ฒฝ ์ดํด์์ JWT์ ์ด๋ก ์ ์ดํด๋ดค์ต๋๋ค.์ด๋ฒ ๊ธ์์๋ Spring Boot + MyBatis๋ก JWT ์ธ์ฆ ์์คํ ์ ์ง์ ๊ตฌํํด๋ด ๋๋ค ๋ชฉ์ฐจ1. ํ๋ก์ ํธ ๊ตฌ์กฐ2. ๊ฐ๋ฐ ํ๊ฒฝ ์ค์ 3. ๋ฐ์ดํฐ๋ฒ ์ด์ค ์ค๊ณ4. JWT ํต์ฌ ๊ตฌํ5. ์ธ์ฆ API ๊ตฌํ6. ์ธํฐ์ ํฐ๋ก ํ ํฐ ๊ฒ์ฆ7. ์์ธ ์ฒ๋ฆฌ8. ํ ์คํธ1. ํ๋ก์ ํธ ๊ตฌ์กฐsrc/main/java/com/jwt/token/โโโ TokenApplication.java # ์ฑ ์์์ โโโ common/โ โโโ ApiResponse.java # ๊ณตํต ์๋ต ํ์โโโ config/โ โโโ PasswordConfig.java # ๋น๋ฐ๋ฒํธ ์ํธํ ์ค์ โ โโโ WebCon..
๐ JWT ์๋ฒฝ ๊ฐ์ด๋ ์๋ฆฌ์ฆ1ํธ: JWT๋? - ๊ฐ๋ ๊ณผ ์๋ฆฌ ์๋ฒฝ ์ดํด (ํ์ฌ ๊ธ)2ํธ: JWT ๊ตฌํํ๊ธฐ - Backend (Spring Boot)3ํธ: JWT ๊ตฌํํ๊ธฐ - Frontend (React)4ํธ: JWT ์ฌํ - Refresh Token๊ณผ ๋ณด์ ์ ๋ต์ด ๊ธ์ ๋ชฉํ"JWT๊ฐ ๋ญ์ง, ์ ์ฐ๋์ง, ์ด๋ป๊ฒ ๋์ํ๋์ง"๊ฐ๋ฐ์ ์ฒ์ ์ ํ๋ ๋ถ๋ ์๋ฒฝํ๊ฒ ์ดํดํ ์ ์๋๋ก ์ ๋ฆฌํ์ต๋๋ค.STEP 0. ์ ์ธ์ฆ์ด ํ์ํ๊ฐ?์น์ ์น๋ช ์ ์ธ ํน์ฑ: Stateless (์ํ๋ฅผ ๊ธฐ์ต ๋ชป ํจ)์น(HTTP)์ ๊ธฐ๋ณธ์ ์ผ๋ก "๊ธฐ์ต๋ ฅ์ด ์์ต๋๋ค".โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ HTTP์ Statel..
1. ํ๋ก์ ํธ ์์ฑ ๋ฐ ์์กด์ฑ ์ค์ 1-1. Spring Boot ํ๋ก์ ํธ ์์ฑ ใSpring Initializr์์ Gradle ๋๋ Maven ๊ธฐ๋ฐ ํ๋ก์ ํธ ์์ฑ ใ Java 17 ์ด์ ๊ถ์ฅ 1-2. ํ์ ์์กด์ฑ ใ Spring Web ใ Spring WebSocket ใ Spring Boot DevTools (์ ํ) ใ Lombok (์ฝ๋ ๊ฐ๊ฒฐํ, ์ ํ) ใ Spring Boot Actuator (์ด์/๋ชจ๋ํฐ๋ง, ์ ํ) ์์ (build.gradle)dependencies { implementation '..
[์๋ฆฌ์ฆ ์๋ด]ใ 2026.01.07 - [๋ถ๋ฅ ์ ์ฒด๋ณด๊ธฐ] - [Web Chat] WebSocket + STOMP ์ค์ต์ผ๋ก ์ดํดํ๊ธฐ-2 (Backend)ใ 2026.01.07 - [๋ถ๋ฅ ์ ์ฒด๋ณด๊ธฐ] - [Web Chat] WebSocket + STOMP ์ค์ต์ผ๋ก ์ดํดํ๊ธฐ-3 (Frontend)์ด ๊ธ์ ๋ชฉํ"์น ์ฑํ ์ ์ด๋ป๊ฒ ์ค์๊ฐ์ผ๋ก ๋์ํ ๊น?"๊ฐ๋ฐ์ ์ ํ ๋ชจ๋ฅด๋ ์ํ์์๋ WebSocket๊ณผ STOMP์ ๊ฐ๋ ์ ์๋ฒฝํ๊ฒ ์ดํดํ ์ ์๋๋ก ์ ๋ฆฌํ์ต๋๋ค.STEP 0. ์น ์ฑํ ์ ๋ง๋ค๋ ค๋ฉด ๋ญ๊ฐ ๋ฌธ์ ์ผ๊น?์ผ๋ฐ์ ์ธ ์น ์ฌ์ดํธ์ ๋์ ๋ฐฉ์์ฐ๋ฆฌ๊ฐ ํ์์ ์ฌ์ฉํ๋ ์น ์ฌ์ดํธ๋ ๋ค์๊ณผ ๊ฐ์ด ๋์ํฉ๋๋ค. ๐ค ์ฌ์ฉ์ ๐ฅ๏ธ ์๋ฒ ..
๐ ๋ค์ด๊ฐ๋ฉฐSpring Boot์ MyBatis๋ฅผ ํ์ฉํ ๋ฐฑ์๋ API ์๋ฒ ๊ฐ๋ฐ ์๋ฆฌ์ฆ์ ์ฒซ ๋ฒ์งธ ๋จ๊ณ์ ๋๋ค.์ด๋ฒ ํฌ์คํธ์์๋ Spring Initializr๋ฅผ ํตํ ํ๋ก์ ํธ ์์ฑ๋ถํฐ GitHub ์ ์ฅ์ ์ฐ๋๊น์ง์ ๊ณผ์ ์ ๋ค๋ฃน๋๋ค.๐ฏ ์ด๋ฒ ๋จ๊ณ์ ๋ชฉํSpring Boot ํ๋ก์ ํธ ์์ฑํ์ํ ์์กด์ฑ ์ค์ Git ์ ์ฅ์ ์ด๊ธฐํGitHub ์๊ฒฉ ์ ์ฅ์ ์ฐ๋1๏ธโฃ Spring Boot ํ๋ก์ ํธ ์์ฑSpring Initializr ์ค์ Spring Initializr์์ ํ๋ก์ ํธ๋ฅผ ์์ฑํฉ๋๋ค.ํ๋ก์ ํธ ๊ธฐ๋ณธ ์ค์ : Project: Gradle - Groovy Language: Java Spring Boot: 4.0.1 (์ต์ ์์ ๋ฒ์ ) Packaging: Jar Java: 17 ํ๋ก์ ํธ..
1. ํ๋ก์ ํธ ๋ชฉํ์ด๋ฒ ํฌ์คํ ์์๋ Expo + React Native๋ฅผ ์ด์ฉํด ์ฑ ํ๋ก์ ํธ๋ฅผ ์์ ํ ์ด๊ธฐํํ๊ณ ,ํ์ ์๋ ํ์ผ ์ ๊ฑฐ + ํด๋ ๊ตฌ์กฐ์ ์ฃผ์ ํ์ผ ์ญํ ์ ์ดํดํ๋ ๊ฒ์ ๋ชฉํ๋ก ํฉ๋๋ค.์คํ๋์ ํ๋ฉด์ ์ ์ธํ๊ณ , ์ด๋ณด์๊ฐ ํด๋/ํ์ผ ์ญํ ์ ์ดํดํ ์ ์๋๋ก ์ ๋ฆฌํฉ๋๋ค. 1๏ธโฃ ํ๊ฒฝ ์ค๋น1-1. Node.js ์ค์น ํ์ธnode -vnpm -v ๊ถ์ฅ Node.js ๋ฒ์ : LTS (์: v20.x)๋ง์ฝ ์ค๋ฅ๊ฐ ๋๋ฉด nvm ์ฌ์ฉํ์ฌ ์ค์น:nvm install --ltsnvm use --lts 1-2. Expo CLI ์ค์น ํ์ธ์ต๊ทผ Expo๋ npx create-expo-app ์ฌ์ฉ์ ๊ถ์ฅํฉ๋๋ค.npx create-expo-app --version ๊ธฐ์กด์ expo-cli ์ค์น๋์ด ์์ด๋ ์ด์ npx ์ฌ..
1๏ธโฃ Pod์ฉ๋: ์ฟ ๋ฒ๋คํฐ์ค์์ ์ปจํ ์ด๋๋ฅผ ์คํํ๋ ๊ฐ์ฅ ์์ ๋จ์ํน์ง:๋จ์ผ ๋๋ ์ฌ๋ฌ ์ปจํ ์ด๋ ์คํ ๊ฐ๋ฅPod๋ง ์์ผ๋ฉด ์ธ๋ถ ์ ์์ ๋ถ๊ฐ์ฌ์์ฑ/๋กค๋ง ์ ๋ฐ์ดํธ๋ ์ง์ ์ ๋จ์ฌ์ฉ ๊ฒฝ์ฐ:๋จ์ผ Pod ์ง์ ์์ฑํ ์คํธ/ํ์ต์ฉ ์์ PodDeployment/StatefulSet ๋ด๋ถ template ๊ตฌ์กฐPod YAML ์์apiVersion: v1kind: Podmetadata: name: my-pod labels: app: my-appspec: containers: - name: my-container image: nginx ports: - containerPort: 80 2๏ธโฃ Deployment์ฉ๋: Pod๋ฅผ ๋ฐฐํฌํ๊ณ ๊ด๋ฆฌํ๋ ๊ฐ์ฒดํน์ง:์ง์ ํ Pod ๊ฐ์(replica)๋ฅผ ํญ์..
1๏ธโฃ ๋ค์ด๊ฐ๋ฉฐSpring Boot ์ ํ๋ฆฌ์ผ์ด์ ์ ์ฟ ๋ฒ๋คํฐ์ค(K8s) ์์ ๋ฐฐํฌํ ๋ํ ํ๋ก์ ํธ ์์ ์ฌ๋ฌ API๋ฅผ ๋ง๋ค์ง, ์๋๋ฉด API๋ณ๋ก ๋ณ๋ ํ๋ก์ ํธ๋ฅผ ๋ง๋ค์ด์ผ ํ ์ง ๊ณ ๋ฏผ๋๋ ์ํฉ์์ฒญ ๋ถ์ฐ, ์ค์ผ์ผ๋ง, ์ฅ์ ๊ฒฉ๋ฆฌ ์ธก๋ฉด์์ ๋น๊ต2๏ธโฃ ์ฟ ๋ฒ๋คํฐ์ค ๊ธฐ๋ณธ ๊ตฌ์กฐDeployment: ์ ํ๋ฆฌ์ผ์ด์ ๋จ์, ํ๋(Pod) ์์ฑ/๊ด๋ฆฌService: Deployment ๋ด๋ถ ํ๋์ ์์ฒญ์ ์ ๋ฌ, ๋ก๋๋ฐธ๋ฐ์ฑIngress + Nginx: ์ธ๋ถ ์์ฒญ์ Service๋ก ๋ผ์ฐํ ํ๊ณ , ์ฌ๋ฌ ํ๋์ ๋ถ์ฐ ์ฒ๋ฆฌ [์์ฒญํ๋ฆ๊ทธ๋ฆผ]์ธ๋ถ ์์ฒญ → Ingress(์ง๋) → Nginx(ํธ๋ํฝ ๋ฐฐ๋ถ) → Service → ์ฌ๋ฌ ํ๋ Ingress: URL/๋๋ฉ์ธ ๊ท์น ๊ด๋ฆฌNginx: ํ๋ ๋จ์ ๋ก๋๋ฐธ๋ฐ์ฑ3๏ธโฃ ํ ํ๋ก์ ํธ ์์ ์ฌ๋ฌ API (..
๐งฉ ๋ฌธ์ ์ํฉJenkins์์ GitHub ์ ์ฅ์๋ฅผ ์ฒดํฌ์์ํ๋ ์ฒซ ์คํ ์์ ์๋์ ๊ฐ์ ์๋ฌ ๋ฐ์The recommended git tool is: NONE → Git ์ค์น ๋ฌธ์ ๋ ์๋ (์ด๋ฏธ ํด๊ฒฐ)์๊ฒฉ ์ฆ๋ช ๋ ์ ์ ์ฐ๊ฒฐ๋จ (using credential)Git ์ ์ฅ์๋ public์ด๊ฑฐ๋ token ๋ฑ๋ก๋ ์ ์๊ทธ๋ฐ๋ฐ๋ ๊ณ์ clone ์คํจ.๐ ์์ธJenkins์ workspace ๋๋ ํ ๋ฆฌ์ ์ด์ ๋น๋ ์คํจ๋ก ์ธํ .git ๋๋ ํ ๋ฆฌ ์์์ด ๋จ์ ์์์.์ฆ:Jenkins๋ ์ด๋ฏธ clone ๋์ด ์๋ค๊ณ ์ฐฉ๊ฐํ๊ณ fetch, config ๋ฑ์ git ๋ช ๋ น์ ์คํํ์ง๋ง.git ํด๋๊ฐ ์์ผ๋ ์คํจํ ๊ฒโ ํด๊ฒฐ ๋ฐฉ๋ฒdocker exec -it -u root jenkins-container bashcd /var/j..
Docker Compose, Docker Swarm, Kubernetes ๋ชจ๋ ๋ค ์ปจํ ์ด๋ ์ค์ผ์คํธ๋ ์ด์ ๋๊ตฌ์ธ๋ฐ, ๊ทธ ์ฐจ์ด๋ ๋ฌด์์ผ๊น์? ์ปจํ ์ด๋ ๊ธฐ๋ฐ ๊ฐ๋ฐ ํ๊ฒฝ์ด ํ์ฐ๋๋ฉด์, Docker Compose, Docker Swarm, Kubernetes ๊ฐ์ ์ค์ผ์คํธ๋ ์ด์ ๋๊ตฌ๋ค์ด ๋งค์ฐ ์ค์ํ ์ญํ ์ ํ๊ณ ์์ต๋๋ค. ํ์ง๋ง ์ด ์ธ ๊ฐ์ง ๋๊ตฌ๋ ๋ชจ๋ ๋น์ทํด ๋ณด์ด์ง๋ง, ๊ฐ์์ ๋ชฉ์ , ๊ท๋ชจ, ๊ธฐ๋ฅ์์ ํฐ ์ฐจ์ด๊ฐ ์์ต๋๋ค. ์ด ๊ธ์์๋ ๊ฐ ๋๊ตฌ์ ํน์ง์ ๋น๊ตํ๊ณ , ์ธ์ ์ด๋ค ๋๊ตฌ๋ฅผ ์ฌ์ฉํด์ผ ํ ์ง์ ๋ํด ์์๋ณด๊ฒ ์ต๋๋ค.1. Docker Compose๋ชฉ์ : ๋ก์ปฌ ๊ฐ๋ฐ ํ๊ฒฝ์์ ๋ค์ค ์ปจํ ์ด๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ด๋ฆฌํ ๋ ์ฌ์ฉ๋ฉ๋๋ค. ์ฃผ์ ํน์ง:- ๊ฐ๋จํ ์ค์ ์ผ๋ก ์ฌ๋ฌ ๊ฐ์ ์ปจํ ์ด๋๋ฅผ ํ๋์ ๋คํธ์ํฌ๋ก ๋ฌถ์ด ์คํํ ์ ์์ต..
Docker ๋คํธ์ํฌ๋ Docker ์ปจํ ์ด๋ ๊ฐ, ๋๋ ์ปจํ ์ด๋์ ์ธ๋ถ ์์คํ ๊ฐ์ ํต์ ์ ์ค์ ํ๊ณ ๊ด๋ฆฌํ๋ Docker์ ํต์ฌ ๊ธฐ๋ฅ ์ค ํ๋์ ๋๋ค. ์ด ๊ธฐ๋ฅ์ ํตํด ์ปจํ ์ด๋๊ฐ ๋ฐ์ดํฐ๋ฅผ ์ฃผ๊ณ ๋ฐ์ ์ ์์ผ๋ฉฐ, ํ์์ ๋ฐ๋ผ ๋คํธ์ํฌ๋ฅผ ๊ฒฉ๋ฆฌํ๊ฑฐ๋ ์ฐ๊ฒฐํ ์ ์์ต๋๋ค. ์๋๋ Docker ๋คํธ์ํฌ์ ๋ํด ์๊ธฐ ์ฝ๊ฒ ์ ๋ฆฌํ ๋ด์ฉ์ ๋๋ค.Docker ๋คํธ์ํฌ๋?Docker๋ ์ปจํ ์ด๋๋ฅผ ๋ ๋ฆฝ์ ์ธ ํ๊ฒฝ์์ ์คํํฉ๋๋ค. ์ด๋ ๋คํธ์ํฌ๋ ์ปจํ ์ด๋ ๊ฐ์ ๋ฐ์ดํฐ ๊ตํ์ ๊ฐ๋ฅํ๊ฒ ํ๊ณ , ์ธ๋ถ์ ์ฐ๊ฒฐ๋๋ ํต๋ก ์ญํ ์ ํฉ๋๋ค.๋คํธ์ํฌ๋ฅผ ์ฌ์ฉํ๋ฉด ์ปจํ ์ด๋ ๊ฐ์ ํต์ , ๋ณด์ ์ค์ , ๋ค๋ฅธ ์์คํ ๊ณผ์ ์ฐ๊ฒฐ์ ์์ฝ๊ฒ ๊ด๋ฆฌํ ์ ์์ต๋๋ค.Docker ๋คํธ์ํฌ์ ์ฃผ์ ๊ธฐ๋ฅ์ปจํ ์ด๋ ๊ฐ ํต์ ๊ฐ์ ๋คํธ์ํฌ์ ์ฐ๊ฒฐ๋ ์ปจํ ์ด๋๋ผ๋ฆฌ๋ ์๋ก ๋ฐ์ดํฐ๋ฅผ ์ฃผ๊ณ ๋ฐ..
1. ๋ฆฌ์กํธ ์ฑ๋ฅ ์ต์ ํ๊ฐ ์ค์ํ ์ด์ ๋ฆฌ์กํธ๋ก ๋ง๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ด ํฌ๊ณ ๋ณต์กํด์ง์๋ก ๋ ๋๋ง ์ฑ๋ฅ์ด ์ค์ํด์ง๋๋ค. ํ์ด์ง๊ฐ ๋๋ฆฌ๊ฒ ๋ก๋ฉ๋๊ฑฐ๋ ๋ถํ์ํ ์ปดํฌ๋ํธ๊ฐ ๊ณ์ ๋ฆฌ๋ ๋๋ง๋๋ ๊ฒฝ์ฐ, ์ฌ์ฉ์ ๊ฒฝํ(UX)์ด ํฌ๊ฒ ์ ํ๋ ์ ์์ต๋๋ค. ์ฑ๋ฅ ์ต์ ํ๋ ์ด๋ฌํ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ๊ณ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ฐ์ ์๋๋ฅผ ๋์ฌ์ค๋๋ค.2. ๋ถํ์ํ ๋ ๋๋ง ๋ฐฉ์ง๋ฆฌ์กํธ๋ ์ํ(state)๋ ์์ฑ(props)์ด ๋ณ๊ฒฝ๋ ๋๋ง๋ค ์ปดํฌ๋ํธ๋ฅผ ๋ฆฌ๋ ๋๋งํฉ๋๋ค. ํ์ง๋ง ๋ชจ๋ ๋ฆฌ๋ ๋๋ง์ด ํ์ํ ๊ฒ์ ์๋๋๋ค. ๋ถํ์ํ ๋ฆฌ๋ ๋๋ง์ ๋ฐฉ์งํ๋ ๋ช ๊ฐ์ง ๋ฐฉ๋ฒ์ ์ดํด๋ณด๊ฒ ์ต๋๋ค.React.memo: ํจ์ํ ์ปดํฌ๋ํธ์์ props๊ฐ ๋ณ๊ฒฝ๋์ง ์์ผ๋ฉด ๋ฆฌ๋ ๋๋ง์ ๋ง์ ์ ์์ต๋๋ค.const MyComponent = React.memo(({ data }) => {..