[회고] 레벨 2 중간 회고 (React, 도식화, 멘탈관리)

들어가며

레벨 2 첫 미션인 '페이먼츠'가 끝난 후 많은 변화가 있었다.

상승한 미션 난이도와, 원정대 그리고 미션이 머지되는 시기가 늦어지면서 마지막 step3을 할 시간이 다들 하루 정도밖에 없었다.

급기야 밤을 새는 크루들도 생겼고, 테코톡까지 겹쳤던 안톨리니는 거의 좀비상태였다 ㅋㅋ...

그래서 코치님들과 긴급 회의를 가졌고, 장바구니 미션부터는 개인 원정대로 엄청 부담을 줄여서 진행하도록 변경했다.

아, 그리고 예전에 친구와 같이 만들었던 "틀딱 퀴즈" 를 리뉴얼했다.

바닐라 js와 html, css로 개발한 프론트를 리액트로 구현했고, fastAPI로 구현했던 백엔드와 mySql로 연결했던 DB는 다 떼버렸다.

추후에 supabase로 간단하게 백엔드를 구현해서, 관리자 페이지에 접근하면 문제 추가가 가능하도록 기능 추가할 계획이다. 

하여튼 이렇게 우여곡절 끝에 첫 미션인 페이먼츠와 원정대의 종료와 함께 레벨 2의 중간지점에 도달했다.

 

나는 무슨 변화가 있었을까?

 

도식화 공포증 극복

미션 PR를 보면 항상 아키텍처 구조라던지, 메서드 관계를 도식화하는 크루들이 종종 있다.

하지만 난 도식화는 도저히 시도를 해보지 못했다.
지금 당장 코드도 잘 이해가 되질 않고, 흐름 파악에 항상 애먹었기 때문이다.
하지만 리액트 개발로 넘어오면서, 컴포넌트 단위로 생각하다 보니 도식화가 쉬워졌다.

페이먼츠 미션 step3 설계 도식화

이렇게 명확한 UI가 정해져 있으면 컴포넌트 구조를 나누는 정도의 도식화는 이제 할 만한 것 같다.
하지만 아직도 메서드 간 관계나, 상태 흐름을 도식화하는 건 어려운 것 같다.
그래도 도식화 자체에 대한 두려움이나 부담은 많이 줄여낸 것 같다.

 

장바구니 백엔드 step1 로직 관계 도식화

이건 이번 장바구니 미션 step1 코드를 도식화해본 것이다.
백엔드 코드인 것을 감안하더라도, 아직은 로직 중심 도식화는 어색한 것 같다.
각 파일의 관계도와 메서드 설명을 따로 분리해야 더 깔끔할 것 같은데, 한눈에 그 둘을 녹아내고 싶다는 의도로 이렇게 그려보았다.
결과적으로 가독성이 좋지가 않고, 이해도 잘 되지 않는다.
그럼에도 로직에 대한 도식화도 그려보았으니, 다음이 두렵지가 않아 졌다!

 

 

학습 도구 및 환경 세팅

학습의 효율을 높이기 위해 AI를 사용하여 학습 도구와 학습 환경을 구성해 보았다.

 나의 학습이 일어나거나 통찰이 일어난 것들에 대한 기록을 하고자 요즘 핫 한 옵시디언으로 세컨드브레인을 만들어보았다.

그리고 toss FF 문서를 나의 기준점으로 잡았는데, 효과적으로 FF문서를 학습하기 위한 코치도 만들었고 자세한 내용은 이전 글에서 확인 가능하다.

 

근데 옵시디언을 쓰면서 느낀 게 있었다.

메모는 하겠다고 마음먹는데, 안 하게 된다. 귀찮아서도 있지만 그 당시 순간의 통찰을 뒤돌아보면 까먹게 된다.

그래서 중간에 바로바로 기록하자니, 흐름이 끊기는 게 싫었다.

그래서 클로드 코드에 저장 명령어를 만들었다. "오늘 대화 내용 저장해 줘" 혹은 "오늘은 여기까지"라고 프롬포트를 날리면 대화 내용에서 내가 스스로 통찰한 내용과 학습한 내용을 정리하고 알맞은 카테고리의 옵시디언 폴더에 저장된다.

폴더는 이미 나눠놨다. TIL, 우테코, 아이디어, 회고, FF코치-세션 . 분류가 애매하면 가장 비중 큰 쪽으로, 두 주제면 파일을 두 개 만든다.

폴더 구조보다 중요한 건 저장 자체가 자동이라는 거다. 그렇게 정리된 내용을 보면 내가 느꼈던 순간의 통찰이 기록되어 있어 지나갈 뻔한 좋은 인사이트를 놓치지 않게 되었다.

 

그런데 여기서 하나 더 만들었다. 

이름은 "찰리의 호기심" 이다. ㅋㅋ

단순히 뭘 배웠는지 기록하는 게 아니라, 내가 어떤 걸 궁금해했는지를 추적한다. "왜?", "뭔 차이야?", "그럼 이건?" 등의 말이 나왔던 순간들을 클로드가 찾아서 따로 정리해 준다. 

거기다가 추가로 클로드의 관찰 섹션이 붙는다. 해당 대화에서 내가 어떤 방식으로 문제를 파악했는지, 어디서 막혔는지, 결국 어떻게 해결했는지를 플로우로 정리해준다. 

 

 

소프트 스킬

레벨 2에 들어가면서 내 소프트 스킬 실험 계획을 변경했다. 

스트레스를 받는 상황에서 좌절/포기하는 대신 감정을 그대로 받아들이고 스트레스를 적극적으로 해소하려는 노력을 보이겠다.

 

구체적인 액션 플랜으로, 스트레스를 받으면 짜증 내고 있지 말고 그 상황을 잠시 벗어나는 것으로 정했다.

항상 코딩을 하다 막히면 스트레스를 받고 짜증 나기 일쑤였다. 

빨리 해결을 해야 하니 스트레스를 받아도 그냥 쭉 잡고 늘어졌다.

그러니 오히려 효율은 떨어지고 포기하고 AI를 쓰거나 다음날로 미뤄버렸다.

그래서 이 액션플랜을 세우고 나서 페이먼츠 미션 때, 개인 공부를 할 때 짜증이 확 나는 상황에 적용시켜 보았다.

 

스트레스받는 상황에서 벗어난 지 단 5분 만에 화가 수그라 들고, 머리는 차가워졌다.

그렇다 보니 감정적이지 않게 되고, 이성적인 사고로 돌아와 해결방법이 떠오르거나 다음 스텝이 명확해졌다.

 

이렇게 간단하게 해결되는 것이 의아하지만, 이번 실험은 너무 긍정적이었다.

아직 그 정도로 큰 스트레스가 없었던 걸 수도 있지만, 스트레스가 쌓이기 전에 감지하자마자 액션플랜을 실행하니 그만큼 쌓이지 않았던 것 같다. 그래서 레벨 1보다 빡빡한 스케줄에도 멘털 관리 부분에서 더욱 건강하게 지내고 있다!

 

 

마무리하며

레벨 2에서 지금까지 뜻밖의 발견이 두 가지 있었다.

하나는 나에게 있어서 도식화의 허들이 낮아졌다는 것이다.

바닐라 JS, TS 때는 코드가 어떻게 연결되는지 머릿속에서 그림이 안 그려졌다. 

그래서 도식화는 "잘하는 사람이 하는 것"처럼 느껴졌다. 

그런데 React로 넘어오면서 컴포넌트 단위로 생각하게 되니까, 자연스럽게 구조가 눈에 보이기 시작했다. 

도식화 실력이 는 게 아니라, 사고방식이 바뀐 것이었다. 정말 별거 아니었던 것이다.

 

다른 하나는 스트레스 해소 실험이다. 

막히면 그냥 붙잡고 늘어지는 것이 당연하다고 생각했다.

그런데 고작 5분만 자리를 벗어났다가 돌아오면 머리가 차가워졌다.

너무 단순해서 오히려 나 스스로가 의심스러웠다. 억지로 버티는 것보다 잠깐 쉬었다 가는 게 더 빠른 길이라는 것을 몸으로 배웠다.

 

저번주에는 안톨리니 덕분에 토스 7기 써밋과 연이 닿아, 토스 신논현 사옥에 다녀왔다.

막연하게 "저 멀리 있는 회사"였던 토스가, 실제로 가보고 나니 "정말 가고 싶은 곳"으로 바뀌었다. 

아직 갈 길이 멀다는 건 안다.

근데 불안해하면서 달리는 것보다, 지금 내 앞에 있는 것에 집중하는 게 결국 더 빠른 길이라는 걸 이번 레벨 2에서 배웠다.

스트레스 실험이 그걸 증명해 줬으니까.

다가오지도 않은 것에 불안해하며 나를 깎아내리지 않고, 매 순간 닥친 것들에 집중하며 남은 기간 열심히 달려보겠다.