Replies: 48 comments 2 replies
-
야미의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
라잇의 타임라인1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
1. 가브리엘의 타임라인공통
다시, 점심뭐먹지
페이먼츠
장바구니 협업
2. 학습 키워드 3가지를 선정하기
3. 3가지 키워드에 대해 왜 중요했는지, 어떤 경험을 했고, 생각이 어떻게 변했는지를 구체적으로 이야기 나눠봅니다. 그리고 그 키워드를 문장으로 구체화 해보기recoilrecoil에서 상대적으로 덜 주목받는 기능 중 하나인 비즈니스 로직을 커스텀 훅으로 분리하는 방법도 있겠지만, recoil에서 작업을 하는 것이 계층 분리에 좀 더 적합하다고 생각하였습니다. 메모이제이션리액트에서 최적화를 할 때 메모이제이션을 고려하게 됩니다. 다만, 메모이제이션이 됐다 안됐다 하는 현상은 다소 이해하기 어려울 때가 있었습니다. 이 과정에서 리액트18새로 나온 훅(useSyncExternalStore, useTransition, useDeferredValue, useLayoutEffect 등)들이 어떤 역할을 하는지, 이 훅들을 사용하여 어떻게 사용자 경험을 개선할 수 있는지를 알게됐습니다. 기존 훅으로도 충분히 리액트 프로젝트를 작성하는데 아무런 문제가 없지만, 새로 나온 훅들로 연산의 우선순위를 조정한다거나 사용자에게 더 편한 UI를 제공할 수 있다는 사실을 알게됐습니다. 세밀한 렌더링 순서 조절을 지원하려는 리액트18의 신규 기능들은 러닝커브가 다소 있다고 생각하지만, 한번 익히게 되면 분명히 유용한 기능으로 활용이 가능하다는 사실을 알게됐습니다. 4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
파인의 레벨2 돌아보기🍍1. 타임라인공통
다시, 점심뭐먹지
페이먼츠
장바구니
장바구니 협업
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
|
Beta Was this translation helpful? Give feedback.
-
타미의 레벨 2 회고1. 타임라인점심 뭐 먹지
페이먼츠
장바구니
2. 타임라인에서 나에게 중요하고 의미있었던 학습 키워드 3가지를 선정하기storybook과 컴포넌트, 비동기, 상태관리 3. 3가지 키워드에 대해 왜 중요했는지, 어떤 경험을 했고, 생각이 어떻게 변했는지를 구체적으로 이야기 나눠봅니다.스토리북과 컴포넌트 CDD를 경험하며 작은 단위의 컴포넌트부터 만들어나가는 연습을 할 수 있었다. 테스팅하기 쉬운 컴포넌트는 어떻게 설계해야할까에 대한 고민을 많이 했다. 컴포넌트를 어떻게 설계하면 재사용 가능할지, 컴포넌트가 어떤 역할을 해야할 지 고민을 많이 했다. 아직도 컴포넌트가 어디까지 감당해야할지는 잘은 모르겠다. 아쉬운 점은 스토리북의 테스팅 등의 사용을 익히지 못했다. 비동기 비동기에서 나오는 상태들에 대해 유저들에게 어떤 화면을 보여줄 것인가를 고민했다. 에러 또한 상황에 따라 page routing이 필요할 수도 있고 토스트 팝업이 필요할 수도 있다. 사용자들이 에러에 대해서 얼마나 자세히 알아야 하는지에 대해 고민을 했다. 그리고 비동기 요청을 보내는 코드를 작성할 때 어떻게 추상화 해서 사용할 때 편리하게 사용할지 모듈화와 custom hook을 만드는데 고민을 했다. 상태관리 불필요한 상태 제거하기, 어떤 것이 전역으로 관리되어야하는가에 대한 고민을 할 수 있었다. 생각보다 불필요한 상태나 useEffect 로직을 사용하고 있었다. 라이브러리를 사용할 때도 선택의 기준을 만들어나가고 싶다. 4. 다음 레벨3에서 변화를 만들어 보고 싶은 액션 플랜 작성나만의 라이브러리 배포해보기 이 작업을 하며 재사용 가능한 컴포넌트 설계, 스토리북을 사용한 UI 테스팅을 할 예정. 레벨2 동안 부족하다고 생각했던 부분을 충족시키고 싶음 |
Beta Was this translation helpful? Give feedback.
-
헤다의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
1, 타임 라인공통
다시, 점심뭐먹지
페이먼츠
장바구니
장바구니 협업
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
레벨 2 돌아보기 - 유스1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
루루의 타임라인1. 타임라인점심뭐먹지
페이먼츠
장바구니
장바구니 협업
2. 학습 키워드 선정
3. 문장으로 만든 학습키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
가람의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
1. 타임라인
2.학습 키워드 3가지
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
제레미의 레벨2 돌아보기1. 타임라인점심뭐먹지
페이먼츠
장바구니
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
도리의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
mock server w 4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
아이크의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
황펭 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습키워드
4. 액션 플랜ErrorBoundary 구현해보기. |
Beta Was this translation helpful? Give feedback.
-
점심 뭐 먹지 페이먼츠 장바구니 Api 통신 Api 통신: 서버가 가지고 있는 데이터를 불러와 시각화 할 수 있다는 것이 너무 흥미로운 경험이었습니다. 홈페이지를 끄고 다시 들어와도 보여줄 수 있고 심지어 컴퓨터를 꺼도 보여줄 수 있으니 참 매력적이라고 생각했습니다. Api 통신의 중요성을 잘 몰랐는데 이번에 협업을 진행하며 중요성을 알게 되었습니다.
|
Beta Was this translation helpful? Give feedback.
-
참새의 레벨2 돌아보기1. 타임라인점심 뭐 먹지
페이먼츠
장바구니
2. 학습 키워드 세 가지
3. 세 가지 키워드를 문장으로 구체화하기
4. 액션 플랜!Suspense, Errorboundary를 활용한 비동기 처리 및 낙관적 업데이트 실패 상황 잘 찾아서 블로그에 정리하기! |
Beta Was this translation helpful? Give feedback.
-
1. 레벨2 학습 과정의 타임라인을 같이 그려보기우디점심 뭐 먹지
페이먼츠
장바구니
2. 타임라인에서 나에게 중요하고 의미있었던 학습 키워드 3가지를 선정하기
3. 3가지 키워드에 대해 왜 중요했는지, 어떤 경험을 했고, 생각이 어떻게 변했는지를 구체적으로 이야기 나눠봅니다. 그리고 그 키워드를 문장으로 구체화 해보기
4. 다음 레벨3에서 변화를 만들어 보고 싶은 액션 플랜 작성레벨2를 진행하며 가장 크게 느낀점은 기술적인 것도 물론 중요하지만 결국은 UX가 가장 중요하다는 것이었다. 예를 들어, 옵티미스틱 업데이트를 적용하는 대신 적절하게 애니메이션을 사용하는 것이 더 좋을 수 있는 등 UX만으로 해결할 수 있는 문제가 많다. 이 UX를 게을리하지 않고 다양한 시도를 해 볼 것이다. |
Beta Was this translation helpful? Give feedback.
-
|
Beta Was this translation helpful? Give feedback.
-
타임라인1️⃣ 점심 뭐먹지
2️⃣ 페이먼츠
3️⃣ 쇼핑
중요한 학습 키워드1️⃣ 리액트 상태2️⃣ 컴포넌트액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
아커의 레벨2 돌아보기1. 타임라인다시 점심 뭐먹지
페이먼츠
장바구니
협업
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 다음 레벨3에서 변화를 만들어 보고 싶은 액션 플랜 작성방학 동안, 레벨1,2에서 학습한 내용 체화하기! |
Beta Was this translation helpful? Give feedback.
-
쵸파의 레벨 2 돌아보기타임라인다시 점심 뭐먹지
페이먼츠
장바구니
협업
선정한 3가지 키워드
키워드를 문장으로 구체화 해보기
액션플랜
|
Beta Was this translation helpful? Give feedback.
-
1. 타임라인
2. 학습 키워드 선정UX, 상태 관리, 에러 처리 3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
타임라인점심 뭐 먹지
페이먼츠
장바구니
키워드 3가지
키워드에 대한 경험커스텀 훅컴포넌트에서 UI 로직과 비즈니스 로직을 분리 시키고 싶었습니다. UI를 제외한 다른 로직들은 모두 커스텀 훅으로 분리를 했습니다. 나중에 알고보니 이런 방식이 Headless 컴포넌트의 구현 방식 중 하나였더군요. 이렇게 사용하니 관심사 분리가 확실히 되어 유지 보수성나 가독성에서 기존보다 많이 개선되는 효과를 얻을 수 있었습니다. 또한 비즈니스 로직 분리 측면 뿐만 아니라 재사용이 가능한 커스텀 훅에 대해 계속해서 고민하고 적용했었습니다. 컴포넌트재사용이 가능한 컴포넌트는 무엇일까 많이 고민했던 것 같습니다. 구조를 파악하기 쉬운 컴포넌트를 만들고 싶었습니다. 비동기 처리기존에는 비동기 처리를 할 때 성공 여부만 고려를 했었는데, 성공 외에도 대기, 실패의 상황에서도 대응하는 방법을 학습했습니다. isLoading, isError 와 같은 상태를 만들어서 처리 할 수 도 있지만, 컴포넌트 내의 관심사를 분리 하기 위해 Suspense, ErrorBoundary를 사용하여 대응하도록 했습니다. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
엽토 레벨 2 회고레벨 2 학습 과정 타임라인
나에게 중요하고 의미 있었던 학습키워드 세가지
문장으로 만든 학습 키워드
액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
우스의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
1. 레벨2 학습 과정의 타임라인
2. 학습 키워드 3가지
3. 학습 키워드 문장으로 구체화
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
슬링키의 레벨2 돌아보기1. 타임라인
2. 학습 키워드 선정
3. 문장으로 만든 학습 키워드
4. 액션 플랜
|
Beta Was this translation helpful? Give feedback.
-
1. 타임라인
2. 타임라인에서 나에게 중요하고 의미있었던 학습 키워드 3가지를 선정하기cdd msw 비동기 통신 3. 3가지 키워드에 대해 왜 중요했는지, 어떤 경험을 했고, 생각이 어떻게 변했는지를 구체적으로 이야기 나눠봅니다.
4. 다음 레벨3에서 변화를 만들어 보고 싶은 액션 플랜 작성
|
Beta Was this translation helpful? Give feedback.
-
회고 순서
1. 레벨2 학습 과정의 타임라인을 같이 그려보기
어떤 학습 주제가 있었고, 그 주제를 적용하고 학습하기 위해 어떤 경험을 했는지 작성해보세요.
참고로 타임라인에는 키워드만 작성해주시면 됩니다.
2. 타임라인에서 나에게 중요하고 의미있었던 학습 키워드 3가지를 선정하기
이 3가지는 개인적으로 잘한 부분 뿐만 아니라 아쉬웠던 부분도 포함할 수 있습니다.
3. 3가지 키워드에 대해 왜 중요했는지, 어떤 경험을 했고, 생각이 어떻게 변했는지를 구체적으로 이야기 나눠봅니다. 그리고 그 키워드를 문장으로 구체화 해보기
'컴포너트', '스토리북'과 같이 커리큘럼상의 학습 키워드를 그대로 작성하기 보다, 나에게 의미 있었고 중요하다고 느낀 단어로 바꿔보세요. 기존에 '스토리북'이라는 키워드를 선택했다면, 이는 단순히 해당 도구를 사용해봤다는 사실을 반영할 뿐, 그 도구가 나의 학습과 프로젝트에 어떤 영향을 끼쳤는지를 명확히 보여주지 못할 수 있어요. 그래서 이를 좀 더 구체화하고 개인화하는 것이 중요해요.
예를 들어, '스토리북을 이용한 UI 컴포넌트 테스팅'이라는 키워드를 선택할 수 있어요. 이 키워드는 단순히 스토리북을 사용했다는 사실 이상으로, 스토리북이 어떻게 UI 컴포넌트 테스팅에 도움이 되었는지, 그리고 그 과정에서 어떤 경험을 했는지를 보여줄거에요.
또는 '스토리북으로 컴포넌트 재사용성 높이기'와 같은 문장으로도 개선시켜볼 수 있을것 같아요. 이 키워드는 스토리북을 통해 어떻게 컴포넌트의 재사용성을 향상시켰는지, 그 과정에서 어떤 이해나 인사이트를 얻었는지를 반영하게 될거에요.
4. 다음 레벨3에서 변화를 만들어 보고 싶은 액션 플랜 작성
단, 이 때 1달 안에 달성할 수 있고 그 경험을 눈으로 볼 수 있으면 더 좋아요. 예를 들어, '리액트 공식 문서를 돌아보겠다' 대신에 '앞의 회고에서 뽑은 키워드 3가지에 대해 React 공식문서를 통해 공부하고, 이에 대한 나의 생각과 경험을 글로 작성해 공유하겠다'와 같은 목표는 어떨까요? 이를 위한 스터디도 가능하구요!
실패하기 쉬운 목표 설계는 공부 시간을 2-3배 늘리겠다와 같이 물리적 노력을 양적으로 늘려서 설계하는 거에요. 예를 들면, 내가 이제 까지 학교 시험을 치는데 수학 점수가 안좋았다고 가정해볼게요. 그 사람은 다음번에 시험을 잘 치겠다고 생각했을 때, 이번에도 수학 공부를 많이 하기 어려울꺼라는 가정하에 작전을 설계하는게 필요해요. 예전 보다 2-3배 이상 시간을 투자할거다라는 작전은 실패할 확률이 높습니다. 시간을 많이 투자하기 힘들 수 있다는 가능성이 높다는걸 염두해두고 (물론 공부를 안하라는게 아니에요! ㅋㅋ) 그걸 극복할만한 요소를 설계하는거에요.
5. 타임라인과 액션 플랜을 공유
작성한 타임라인과 액션 플랜을 디스커션에 작성하여 공유합니다.
디스커션 코멘트 작성 예시
Beta Was this translation helpful? Give feedback.
All reactions