Wanted | 프리온보딩 프론트엔드 코스 [ 3주차 | 주간회고 ]

어느덧 코스의 반이 넘어버렸다.
무거운 마음을 좀 버리고 내가 챙겨야 하는 것들을 챙기고 있었다. 어느 정도 리액트 라이브러리와 typescript를 적용해서 사용하는 것까지 익숙해졌다. 우리 팀에서는 3주 동안 UI, 기능 구현하는 팀원들과, 통신 모듈, 전역 상태 관리 로직을 담당하는 팀원이 거의 고정되어 있었는데 앞으로 서로 역할을 바꿔서 골고루 익힐 수 있는 시간을 갖기로 했다.
이번 코스를 시작할 때 지친 상태(AI 서비스 회사에 FE 개발자로 입사해서 2달 동안 플젝을 했었는데 입사 첫 주를 제외하고는 플젝 막바지라 계속되는 야근에 지쳐있었다...)로 시작해서 그런지 아침부터 밤까지 진행되는 코스가 버거웠었다. 2주 차까지 주말에도 쉬지 않고 공부를 했는데 다음날 되면 기억이 하나도 안나는 상황도 있었다. 이런 경험을 처음이라 많이 당황스러웠고 그래서 이번 한 주간은 저번 주에 세운 규칙처럼 무리하지 않고 또 주말에는 푹 쉬려고 했다. 다행히 좀 몸이 회복한 거 같다. 앞으로 코스가 남은 2주 동안은 무엇을 얻어가야 하는지 정리해보았다.

- 전역 상태 관리
- 보일러 플레이트 
- 프로젝트 구조

위의 3개만 2주동안 잘 챙겨가도 내가 이번 코스에서 배워가려는 것들을 잘 챙기는 것이다. 원티드 프리온 보딩 코스에서는 매주 수요일과 토요일에 강사님의 강의 + 다른 팀들이 어떻게 개발했는지 발표하는 시간이 있다. 다른 팀들의 발표를 보면서 내가 모르는 것들도 알 수 있고, 개발할 때 관점이 넓어지는 느낌도 많이 받았다.
이번 주에 조금 쉬어가는 한 주였다면 다시 회복해서 내가 배우고 싶었던 것들을 잘 챙겨 나가야겠다.!

- 리액트 (기획서를 보고 개발하면 구현 가능한 실력)
- 리액트 라우터 
- 전역 상태 관리 (리코일, context API, redux) + react query
- typescript
- 클린코드 
- 헷갈리는 자바스크립트 개념

그리고 이번 주에 우리 팀에서 살짝 특별한 시도를 해봤었다.
바로 보일러 플레이트를 만들자! 였는데, 4번째 프로젝트를 시작할 때였고, 매번 사용하는 라이브러리들도 비슷한데 초기 프로젝트를 설정하는 시간이 꽤 오래 걸렸다. 그래서 우리 팀의 입맛에 맞는 보일러 플레이트를 만들어 초기 프로젝트 설정 시간을 줄이자라는 이유로 시도했지만 결과적으로 실패했다 😢. 실패 이유는 무지에서 시작해서 헤매는 시간이 많았고, 또 처음 보일러 플레이트를 만드는 것이기에 잘 만들어진 보일러 플레이트를 따라가며 만들려 했고, 기준으로 잡은 보일러 플레이트와 현재의 웹팩 버전이 조금씩 달라려서 똑같이 만들었을 때 오류 대방출 파티였다. 결국 우선순위에 밀려 기업과제부터 하고 다음번에 한 번 더 시도해 보는 것으로 마무리했다. 하지만 이 과정 속에서 배운 것이 많다.
그래도 모두가 어떤 의미로 이런 작업을 하는지, 웹팩, 바벨을 선정한 이유는 무엇인지? 이런 설정은 왜 필요한지 의견을 공유했고, 모르는 내용이 많을 땐 시간을 정해서 30분정도 공식문서를 읽어보고 진행을 한다던가 또 같이 해결이 안될땐 각자 고민해보고 시도한 다음 방법을 공유한다 던가하는 방법들을 통해 문제를 해결해 가는 과정들이 흥미로웠다.
그리고 내가 해결한 문제도 하나 있는데 ...‼
기존 package.json 파일에서 Mac OS를 사용하는 사람에겐 스크립트를 실행했을때 나는 오류가 없었는데 Window OS를 사용하는 사람에겐 스크립트 실행 오류가 났었다. 나는 Mac OS를 사용해서 이런 문제가 있는지도 몰랐었다..😅

// 기존 코드 
"lint": "eslint src/**/*.{ts,tsx}",
"lint:fix": "eslint --fix 'src/**/*.{js,jsx,ts,tsx}'",
"format": "prettier --write 'src/**/*.{js,jsx,ts,tsx,css,md}' --config ./.prettierrc"

// 스크립트 이스케이프 처리 
"lint": "eslint \"src/**/*.{js,ts,jsx,tsx}\"",
"lint:fix": "eslint --fix \"src/**/*.{js,jsx,ts,tsx}\"",
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,css,md}\" --config ./.prettierrc"//

스크립트 이스케이프 처리를 하면서 문제를 해결헸다.
다음번엔 다들 웹팩에 대한 공부를 한 이후에 다시 보일러 플레이트를 만들어 보기로했다. 실패했지만 실패만은 남은 것은 아닌 보일러 플레이트 후기!