8월에는 내가 무엇을 공부했나 생각해보면 3가지로 줄일 수 있을 것 같다.
Vue! React! Typescript! 생각보다 어려웠던, 지금도 어려운 기술은 typescript인 것 같다. 단순히 type 지정으로만 사용할 수 있지만 개발 편의를 높이는 여러 기능들을 사용하기 위해서는 생각보다 많은 공부가 필요하다고 생각된다.
8월 동안 vue, react, typescript를 사용해 개발했던 과제들과 공부했던 것들을 정리해보며 배우게되었던 점을 다시 상기시켜보고자 한다.
Vue를 사용한 영화 검색 서비스
OMDb PEDIA 바로가기
vue, typescript를 사용해서 영화 검색 사이트를 제작했었다.
vue는 react보단 쉽게 접근할 수 있는 부분이 많다고 생각했다.
아무래도 vue는 프레임워크이다 보니 어떤 기능 구현을 위한 접근 방법이 거의 정해져 있고 사용법만 익힌다면 금방 적용이 가능했었다. 지금 누가 react와 vue 중 어떤 걸 선택할래 라고 물어본다면 쉽게 대답할 순 없을 것 같다... 그만큼 vue도 흥미로운 기술이라고 생각한다.
이 프로젝트에서는 tailwindcss도 적용해서 왓챠피디아 레이아웃 클론코딩도 같이 진행했었다. tailwindcss 사용이 처음에는 너무 어색하고 scss나 css in js 라이브러리를 사용한 것 보다 어려웠지만 이 프로젝트를 통해 적응할 수 있었고 지금은 tailwindcss가 매력적인 css 라이브러리로 생각된다. 특히 상태에 따른 css 적용이나 peer와 같은 형제 요소 선택자는 개발 속도를 더 높혀준다고 생각한다.
잘한 점 or 배우게 된 점
- tailwindcss 사용이 초반에 비해 능숙해져서 빠른 css 적용이 가능해졌다.
- 그동안 잘 몰랐던 vue에 대해 공부하고 react와 비교해보며 vue만의 장점을 알게 되었다.
개선해야 할 점
- vue를 vue답게 쓰는 법에 대해 좀더 공부해야할 것 같다.
- 컴포넌트의 역할에 대해 다시 한번 생각해보고 구현을 해야한다.
View 네비게이션 시스템 구현(React)
React를 사용하고 react-router는 사용하지 않는 View 네이게이션 시스템 만들기 과제에서 funnel 구조를 사용해 카드 만들기 서비스를 제작했다. toss의 useFunnel과 비슷한 custom hook을 만들어
구현하려고 했지만 리렌더링 과정에서 문제가 있어서 결국 형식만 비슷하게 구현하였다.
이 과제를 하면서 느낀점은 react에 typescript를 적용을 위해서 더 공부해야겠다는 생각이 들었다. 물론 type을 적용할 순 있지만 더 깔끔한 구조로 개발자에게 적절한 타입을 제공해주는 방법들에 대한 피드백을 받고나서 공부의 필요성을 느꼈다.
typescript에 대한 사용은 미흡했지만 그래도 컴포넌트의 분리나 전체적인 구조는 나름대로 잘 구현한 것 같아서 만족스러웠다.
잘한 점 or 배우게 된 점
- 컴포넌트 분리를 잘했다.
- typescript를 최대한으로 사용하려고 노력했다.
- useFunnel에 대해 공부해보며 페이지 전환 구현 방법에 대해 공부할 수 있었다.
개선해야 할 점
- react에 typescript를 적용하는 부분이 아직 미흡한 것 같다. 더 공부가 필요하다.
- 나만의 useFunnel을 성공시켜보자.
- 외부 라이브러리 도움없이 페이지 전환 애니메이션을 적용해보자.
이펙티브 타입스크립트
이펙티브 타입스크립트를 읽고 있다. 아직 전부 읽은 것은 아니기 때문에 9월에도 이 책을 계속해서 공부할 예정이다. 이제까지 책을 읽으면서 가장 인상 깊었던 점은 타입을 집합이라고 생각하라고 말하는 부분이다. 그동안 typescript의 인터섹션과 유니온을 사용하면서 가끔 이상하다고 생각하는 부분들이 있었는데 타입들을 집합이라고 생각한 순간 궁금증을 해결할 수 있었다.
9월 계획
9월은 팀 프로젝트가 진행되는 달이다.
이번 팀 프로젝트에서 내 개인적인 목표는 요구사항과 보너스 요구사항을 모두 구현하기 위해 열심히 달려보기! 그리고 팀과 소통하고 소통하기! 이다.
9월이 지난 후 나는 typescript를 잘 이해하고 적절하게 적용하는 사람, react 주니어를 벗어난 사람이 되고 싶다!
