2021 Dev-Matching: 웹 프론트엔드 개발자(상반기) 후기

매 해마다 프로그래머스에서는 상반기, 하반기 두번에 하여 분야별 코딩테스트를 진행을 한다.

취업과 연결되는 테스트이기 때문에, 나와 같은 취준생들은 물론이고 자기의 실력을 테스트해보고자 응시하는 사람들도 있는것 같았다.

특이하게도 알고리즘 문제를 해결하는것이 아닌, 어떠한 프로젝트를 완성시키는 것이 테스트 였다.

하지만 생각해보면 단순히 완성이 목표가 아니라, 디자인패턴, 코딩컨벤션, 리펙토링, 효율성 등등을 좀더 따져보는 테스트 인것 같다.

실제로도, 추가 요구사항에 그러한 항목이 있었다.

결과적으로 말하면 시험에는 합격했다. 필수기능 한가지는 구현을 하지 못하였는데, 이유는 중간에 한번 갈아엎었기 때문..

작년 상반기에도 테스트를 한번 해보았었는데, 이번에 테스트를 진행하면서도 시험이라는 불안감에 그때와 마찬가지로 기능구현에만 우선을 두고 진행을 하는 모습을 보았고, 중간쯔음에 이건아니라 생각하여 전반적으로 수정을 하였다

테스트 진행중에 이런다는첨이 참.. 한심하기도하고 부족함을 느꼈다.

테스트는 프레임워크 사용이 아닌 바닐라 자바스크립트를 사용하는것이 규정이였다. 이번에는 작년과는 다르게 다른사람이 보기에도 이해하기 쉽고, 최대한 돔에 접근하는 경우를 줄여가며 또한 역할에 따라 함수화 하여 구분짓자는 것이 큰 목적이였다.

중앙 상태값 활용을 통한 단방향 데이터 흐름

BreadCrumb라는 현재 디렉토리의 위치를 표시하는 view와 Nodes라는 파일을 표시하는 view가 있었는데, 서로가 데이터를 공유해야하는 상황이였기 때문에, 외부 하나의 store에서 상태값을 관리하고, 각각의 컴포넌트에서의 요청을 type을 갖고있는 action으로 보내서 reducer에서 처리를 하는 식으로 진행을 하였다.

DOM접근 최소화

BreadCrumb와 같이 view를 그려야 하는 컴포넌트의 경우, map과 같은 순회함수 내부에서 돔을 접근하는것이 아닌, 최초 한번 상수에 지정을 하고 생성된 템플릿을 먹여? 주는 식으로 하였다.

재사용 가능하도록 순수한 컴포넌트 생성

Image와 같이 action함수를 호출할 필요가 없는 컴포넌트들은 최대한 재활용할 수 있도록 설계하였다.

이런 구조를 잡고 설계를 하는데에 좀 더 많은 시간을 투자하였기 때문에, 필수 요구사항 한가지, 가산점 요구사항 한가지는 완성하지 못했다. 다만, 두가지 모두 해결할 수 있는 방법은 알고있었어서 주석처리로 글을 써놓았었는데 이해해주신건지.. 감사할따름

사실 다 만들고 나서 보니 React에서 Redux를 사용한것과 매우 흡사해보였다.

이 때는 Redux를 매우 좋아하긴 했었는데, 지금생각해보면 Redux처럼 할 필요 없이, 그냥 상위 App 에서 하나의 state와 setState 식으로 처리하는것이 훠 얼 씬 가독성이 좋았을거라는 생각을 하곤 한다. 그랬다면, Nodes나 BreadCrumb또한 사이드이팩트가 없는 순수함수의 역할을 할 수 있었을 수도..?

해설

2021 Dev-Matching: 웹 프론트엔드 개발자(상반기) 해설

이번 테스트에대한 해설이 올라왔고, 모두 읽어보았다.

확실히 해설에서 나온 테스트 풀이도 React나 Vue등의 최신 프레임워크와 같이 최소한의 돔에 접근을 하며, 최상위 상태값을 통해 의존성이 낮은 컴포넌트들을 통하여 view를 그려나가는 방식이였다.

테스트 당시 비슷한 방식으로 해결하긴 하였지만, Redux처럼 상태값을 따로 분리시켜놓는것이 아닌 그냥 최상위 App에다 하셨고, 나 또한 요즘 Redux를 무조건 사용해야하는것이 아니라는 생각이 커지고 있고 애초에 규모가 작은 프로젝트였기 때문에 그 방법이 더 효율적인것 같다고 생각한다.

근황

어쨌든, Dev-Matching에 합격하고 선택했던 5개 기업에 이력서가 전달된후, 추가적인 테스트를 진행중인 기업도 있고 불합격된 기업도 있고, 아직 연락이 없는 기업도 있다.

연락이 없는 기업을 제외한 나머지는 모두 재지원했던 기업인데, 불합격한 세 기업은 모두 6개월 이내 지원했던 곳 이였다.

심지어 한달 전 도 있음 읍읍…

재지원한 텀이 너무 짧아서 볼 필요도 없었을 수도..?

꽤 여러 기업의 과제물을 수행하고, 피드백 요청 - 복습을 통해 코딩 스타일등을 많이 수정해왔다.

합격한 한 곳은 딱 1년이 되었는데, 그래서 나를 잊어먹으신건지 기회를 한번 더 주신건지 과제를 수행하게 되었다.

과제는 작년과 동일한 과제였는데 진행하면서 확실히 많이 달라졌다는 생각을 하게 되었다.

작년에 했던 과제 또한 깃 리포지토리에 갖고있었는데, 한번 쓱 보고 든 생각이

내가봐도 모르겠네

이번에 과제를 완료하고 작년것과 비교를 해보니 진짜 환골탈태가 따로 없더라. 효율성이나, 가독성, 메모이제이션, 재활용, 코딩컨벤션 등등등 전반적으로 훠 얼 씬 좋았다.

프론트엔드에 깊이있게(?) 공부를 한지 1년? 1년 2개월? 그정도 되는것 같은데 이번 Dev-Matching테스트와 재지원한 기업의 과제물을 수행하면서 확실히 성장을 해왔다는 것이 눈에 보여서 보람이라는것을 느끼는것 같다.