다이앤이 남은 레벨 2가 어떻게 흘러갈지 타로를 봐주었는데,
허영심을 조심하라고 했다. 남보단 나에게 더 집중하는 레벨 2가 되자! 🃏

---

🎯 이번주 Action Plan 회고하기

• 1. 회복 계획표 만들어보기
• 2. 크루 2명에게 페이먼츠 미션에서 받은 가장 인상 깊은 리뷰 1개씩 물어보기
• 3. 쓰고 싶은 영어 표현 모아두기

1. 회복 계획표

여러 크루들의 얘기를 듣고 만들었다.

이제 하나씩 해보면서 회복 관리를 해봐야겠다.
추후엔 준, 리사는 어떻게 회복을 관리하는 지 물어봐야지.

쉬는 시간	할 일	만족도 (1 ~ 5)
5분	찬물로 세수하기	-
5분	눈 감고 아무 생각도 하지 않기	-
5분	좋아하는 노래 부르기	-
5분	방 👉 화장실 👉 거실 👉 창고 순으로 걷기	-
5분	책상 청소하기	-
10분	독서하기	-
10분	선릉캠 주변 산책하기	5
10분	간식 먹기	5
15분	설거지 하기	-
20분	집 주변 산책하기	-
30분	밥 먹기	-
40분	노래방 가기	-
60분	좋아하는 OTT 프로그램 보기	-

---

2. 가장 인상 깊은 리뷰 1개씩 물어보기

레벨 1 때보다 미션 리뷰에 대해 서로 물어보는 시간이 줄었는데,
이렇게 시간을 내서 이야기하니 좋았다.

이야기는 머핀, 퐁쥬에게 물어보며 시지프도 함께하게 되었다. 가장 인상 깊었던 이야기는 버튼이 컴포넌트 트리에서 아주 깊은 하위에 있을 때, 그 버튼을 누르면 모달은 트리의 어디에서 띄워져야 하느냐는 주제였다.

1️⃣ 가설 첫 번째, 모달이 버튼과 같은 컴포넌트 내에서 띄워진다면?

• 장점: Props Drilling을 막을 수 있다.
• 단점: 모달이 트리의 깊은 하위에 있음에도 보여지는 UI는 상위에 있는 것처럼 보인다.

2️⃣ 가설 두 번째, 모달이 버튼의 위치와 상관없이 트리의 상위 컴포넌트에서 띄워진다면?

• 장점: 띄워지는 위치와 보여지는 위치가 동일해서 자연스럽다.
• 단점: 엄청난 Props Drilling이 예상된다.

이때 시지프가 두 방법의 장점을 모두 가져갈 수 있는 방법인 Portal을 제안했다. Portal을 사용하면 모달을 트리의 상위에 두면서도 Props Drilling 문제를 해결할 수 있다고 했다. 처음 접하는 개념이라 흥미로웠다. 당장 필요한 개념은 아니지만 필요할 때 학습해봐야겠다.

---

3. 영어 표현 모아두기

• She thinks I look like a puppy
  • 현재형인 이유: She thinks → 지금도 여전히 그렇게 생각하고 있기 때문.
• Like, I get the message, but the delivery is a little awkward.
  • Delivery in this context is 말투
• I'm getting off the subway
• I'm riding the subway
• I'll have coffee
• My mom cooked food at home, so I'll eat that
• I'll eat my mom's cooking at home
• I enjoy it
• I'm enjoying it
• What's your fucking problem?
• Go fuck yourself
• Wizard: 마법사 (보통 남성)
• Witch: 마녀 (보통 여성)

---

제이슨과 원오원

역할보다 책임을 먼저 생각하라

Car 클래스에는 name과 position 필드가 있었다. 그런데 돌아보니, position과 관련된 기능을 클래스 외부에서 구현해두고 있었다. 분명 역할과 책임을 나눠서 구현했다고 생각했는데 왜 그랬을까?

돌이켜보면, 클래스를 먼저 만들고 책임은 나중에 고민했기 때문이다. 그 과정에서 놓친 책임이 생겼고, 결국 역할에 대한 책임 분배가 어긋난 것이다.

제이슨은 "책임이 외부로 분산되면 복잡도가 올라간다"고 했다. 실제로 이 부분 때문에 내 코드의 복잡도가 올라가 있었다. 이때 역할보다는 책임을 먼저 고민해야 한다는 말이 조금 와닿았다. 테스트 코드를 먼저 작성하면 이 부분을 해소할 수 있을 거란 조언도 받았다.

요즘 수업 시간에 ‘역할보다 책임을 먼저 생각하는’ 연습을 하고 있는데, 아직은 쉽지 않다. 그래도 제이슨이 내 코드에 대해 "OOP 관점이 잘 적용되었다"고 말해줘서 기분이 좋았다.

내 코드를 쓱- 보고도 바로 이해한 걸 보고, 제이슨에게 놀랐고
원오원 10번 더 하고 싶다고 했다 ☺️ (React에 OOP 관점을 어떻게 적용할지 물어봐야 한다.)

+ 최근에 제이슨이 DH에 다녀오셨다. 유럽 시장은 프론트엔드 시장보다 네이티브 시장이 활성화 되는 추세라고 우리나라랑 반대라고 해주시면서 "본인의 바운더리를 프론트엔드로 한정 짓지 말아라"라는 조언을 받았다. 흥미로웠다. 🙇

이타심과 이기심

(전 강남언니 개발자) 워니의 글을 보며 든 이타심, 이기심에 대한 생각.

세상 사람들이 모두 나와 같은 생각을 하고, 같은 고민을 한다는 착각에 빠질 때가 있다.

워니는 이를 “사람이 온전히 알 수 있는 대상은 자기 자신뿐이기에,
세상을 바라볼 때 자신을 투영하게 되는 것이다”라고 말했다.

내가 이기적으로 살면, 다른 사람도 이기적으로 살 것 같다는 생각이 들고
내가 베풀며 살면, 다른 사람도 베풀 수 있다는 가능성이 열리게 된다.

그러니 따뜻한 세상에서 살고 있다는 착각에 빠져서 살 수 있도록,
나는 사소한 일에, 남에게 더 감사하고 사랑해야겠다.

마침표 찍기를 하다

크론과 원오원을 통해 ‘마침표 찍기’라는 액션 플랜을 얻었다. 이후 벌써 세 번 실천해봤고, 그때마다 정말 도움이 됐다.

‘마침표 찍기’란 상처되는 말을 들었을 때, 허허 웃으며 넘기지 않고 나를 방어하는 말을 분명히 하는 것이다. 예를 들면 “그 말은 기분이 별로 안 좋네요” 같은 한마디다. 표현은 간단하지만, 나에게는 그 한마디가 쉽게 나오지 않았다.

이번에 세 번의 실천 중 두 번은, 같은 시간대에 운동하는 한 회원에게 했다. 그 사람 때문에 운동을 그만둘까 고민할 정도로 힘들었지만, 우테코 일정 때문에 시간을 바꾸는 것도 쉽지 않았다.

그래서 이번에는 그 사람과의 대화 속에서 용기를 내어, 상처받는 말에 마침표를 찍었다. 그러자 이런 말을 들었다. “나는 너를 남들과 비교해서 자존감을 내려야 악바리가 생길 줄 알았지.”

충격적이었다. 그 사람이 그런 생각을 하고 있었다는 게, 정말 대단하다고 느껴질 정도였다.

하지만, 그 상황에서 나는 크론 덕분에 나를 지킬 수 있었다. 앞으로도 누군가가 너무 무례한 말을 한다면, 그 자리에서 나를 지킬 수 있는 사람이 되고 싶다.

이런저런 생각

• Headless 컴포넌트란?
  • UI를 직접 렌더링하지 않고, 로직이나 상태 관리 등 다른 기능을 제공하는 컴포넌트.
  • 그래서 이번에 만든 Compound Pattern을 적용한 컴포넌트도 UI를 직접 렌더링하지 않고, children이나 다른 컴포넌트를 조합해 사용하는 구조라면 Headless 컴포넌트라고 볼 수 있다.
  • 커스텀 훅도 넓은 의미에서 Headless 컴포넌트처럼 역할을 한다고 생각할 수 있다. (컴포넌트는 아니다.)
• input 태그에 padding을 주면 width가 왜 늘어날까?
  • 이유: input에 padding을 주면 기본적으로 전체 너비(width)에 padding이 포함되지 않기 때문이다.
  • 해결 방법: box-sizing: border-box 설정
  • 기본 값: box-sizing: content-box 설정
    • content-box: width는 content(내용) 만의 너비를 의미한다.
    • border-box: width는 content + padding + border 전체 크기를 포함한다.

padding을 줬더니 input이 부모 요소를 벗어났다 👇

아직 고민 중인 주제

• CDD, 아토믹 디자인이 레벨 1과 연관성이 있을까?
• React에서 조합이 단점으로 작용할 때가 있을까? 현재 Compound 패턴으로 조합을 쓰고 있는데 딱히 단점을 모르겠다.
• flex와 fle-grow 차이는?
• postion이 z-index에 영향을 줄까? z-index는 어떤 기준을 가질까?

🍵 마무리

1)
요즘은 회고 분량이 길어져서 고민이다.
레벨 1부터 들인 생각하는 습관 덕에 생각의 용량이 커진 건지,
레벨 1에 비해 레벨 2가 생각할 거리를 많이 던져주는 건지 모르겠다.
필요한 부분만 딱 적고 싶은데 고르기가 어렵다.

2)
시지프가 해준 말 중 인상 깊었던 한마디가 있다. “긴급하지 않지만 중요한 일부터 해라.” 미션은 긴급하고 중요한 일이기 때문에 무조건 해낼 수밖에 없다. 하지만 시지프가 말한 건, 예를 들면 ‘공식 문서 읽기’처럼 긴급하지는 않지만, 장기적으로 꼭 필요한 일을 놓치지 말라는 조언이었다. 나는 그동안 미션을 항상 1순위에 두고, 이 일이 끝나면 그제야 다른 일을 시작하곤 했다. 그런데 이제는 미션만 끝내는 식이 아니라, 긴급하지 않지만 중요한 일도 병렬적으로 수행하며 시간을 분배해야겠다는 생각이 들었다.

🎯 다음주 Action Plan 은?

• 회복 계획표 실천하기
• 밀린 React 공식문서 스터디 내용 정리하기