기록 이유
약 7주 간의 짧다면 짧고 길다면 긴 프로젝트를 거치면서 React와 어느 정도 친해지는 시간은 가졌다고 생각한다. 근데 생각과는 달리 나는 이 친구를 멋지고 깔끔하게 키우고 싶은데 어느 새인가 지저분해지는 게 멋대로 자란 수염을 보는 것 같다...
그래서 해당 코드를 고쳐보자! 라고 생각하게 되었고 간단하게 지나온 프로젝트의 기록을 남기면서 이번 기회에 TypeScript도 사용해 볼 기회를 가지고자 한다.
왜 React를 사용하는가?
기존에 참가했던 프로젝트에서는 VueJS도 사용해볼 수 있는 기회가 있어 Vue를 기반으로 코드를 작성한 경험이 있었는데 뭔가 장단점을 가지고 비교할 수 있는 숙련자가 아니었을 뿐더러 React를 사용해 본 적조차 없었기 때문에 일단 가장 지금 핫한 프레임워크니까 찍어먹어보자! 라는 생각을 가지고 사용하게 되었다. 아무래도 Vue와 비교했을 때 Vue의 단점을 체감하기보단 React의 장점을 체감하는 계기가 되었던 것 같다.
생태계가 넓다
이건 수치상으로도 그렇고 많이들 잘 알려진 장점이라고 생각하는데 Vue에서 사용했던 대부분의 라이브러리들은 React에서도 사용할 수 있을 뿐더러 이쪽이 메인이고 Vue가 사은품인 느낌으로 제공이 된다는 느낌을 받았다.
직관적이다
아직 다양한 Hook을 사용하지 못해서 그런건지는 몰라도 Props를 처리하는 방식이나 코드 작성 방식 등에서 훨씬 편하다고 느꼈다.
ue의 경우는 마치 머리, 가슴, 배처럼 template, script, style을 작성하는 형태를 통해 코드 간의 구분감을 살린 느낌이었다면 React는 기본적으로 Fuction Component를 JavaScript 코드와 구분감을 주지 않는 형태로 작성하는 편이라서 변수 접근 등에 있어서 훨씬 편리함을 느꼈다.
물론 Vue처럼 분리하게 되면 코드를 읽는 것이 좀 더 편할지는 모르겠지만 작성하는 기준으로는 분명한 차이가 존재했고 지금에 와서도 둘 중에 뭘 쓸래? 라고 묻는다면 React를 사용할 것이다.
Event 처리가 편리했다
윗 내용과 어느 정도 공유되는 부분이 있는 내용인데 EventHandler를 작성할 때 Vue를 사용하던 시절에 비해 훨씬 직관적으로 적을 수 있었다고 기억한다. Vue의 경우는 Function과 Variable을 따로 구분해서 적는 파트가 많았던 것 같은데 React는 일반적인 프로그래밍 언어 사용하듯 그 자리에서 변수 선언하고 처리하는 형태가 가능하다보니 매일 먹던 백반과 같은 푸근하고 든든한 느낌을 받았다.
TypeScript를 사용하려는 이유
실제 업계에서 뽑는 장단점과는 다를 수 있겠지만 React의 위와 같은 장점을 개인적으로는 꼽을 수 있었고 여전히 Refactoring 과정에서도 React를 선택한 이유가 되었다.
마찬가지로 Refactoring을 할 때 왜 굳이 JS 대신 TS를 쓰려고 하는지에 대한 이유도 적어두는 편이 좋을 것 같아 여기에 남긴다.
오류잡이
TS의 장점으로 JS의 단점을 해결하는 부분이 굉장히 크다고 생각한다. 기본적으로 JS는 굉장히 느슨한 언어라고 생각하고 실제로도 그렇다. 그렇다보니 오류가 이상한 곳에서 발생하고 해결도 난해할 때가 가끔 존재하는데 이런 부분을 TS가 잘 잡아줄 것이라고 기대하고 있다.
익숙함
JS는 어쩔 수 없는 개발 역사에 의해 개인적으로 프로그래밍 언어스럽지 못한 부분들이 굉장히 많다고 생각한다. 하지만 TS는 분명히 JS 기반임에도 불구하고 굉장히 착착 들어맞는 구조를 제공하는 것으로 JS에서 아쉬웠던 부분을 해결해주고 있었다! 물론 손이야 더 많이 갈 수 있지만 오히려 안정된 구조의 익숙함에서 오는 편안함이 TS를 사용하도록 유도하고 있다..
맺음말
앞으로 꾸준히 기존에 사용했던 코드와 비교하면서 혹은 배운 내용을 해당 포스팅 아래로 꾸준히 남겨볼 예정이다. 얼마나 시간이 걸릴지는 모르겠으나 굉장히 보람찬 작업이 될 것이라 기대하고 있다!
