배경'프론트엔드에서 테스트 코드가 중요하다 vs 중요하지 않다' 항상 나오는 말이다. 시리즈 b 스타트업에서 일하는 3년차 프론트개발자인 나의 시선은 어떨까? 정리되어 있지 않은 내면의 생각들을 정리해보고 싶어졌다. 아마 조금만 시간이 지나면 지금 나의 생각도 바뀌게 될 것이다. 생각이 바뀌기전에, 지금의 기억을 잊어버리기 전에 정리해보겠다.테스트 코드와 개발 시간최근에 유스콘이라는 곳에서 `자동차 정비사 개발자가 되다`라는 세션을 들었다. 정비를 하려면 자동차를 뜯고 고장난 곳을 고치고 다시 조립해서 테스트를 한다고 했다. 그리고 정비가 잘못되었다면 다시 뜯어야하는데 길게 걸리는 경우는 일주일동안 뜯어야하고 힘도 많이 든다고 했다. 그런데 개발자는 딸깍 하니 테스트 코드가 바로 나오니 얼마나 쉽냐는..
배경이런 저런 이유로 백엔드 공부를 시작했다. 사실 예전부터 미루고 미뤄왔던 일이기도 하다. 개발자가 왜 되었냐고 한다면 명확히 대답할 수 있지만 프론트 개발자가 왜 되었냐고 묻는다면 약간 대답하기가 애매해진다. 프론트가 싫었던 적도 지금 싫지도 않다. 다만 내가 프론트로 취업한 이유는 프론트를 더 잘하기 때문이다. 애초에 취직전까지는 풀스택으로 공부했었다. 보통 비전공자가 혼자서 풀스택으로 공부하다보면 자연스럽게 프론트를 더 많이 공부하고 잘하게 된다. 그리고 그건 나도 예외가 아니였다. 그리고 그렇게 취직한지 2년 4개월이라는 시간이 흘렀다. 쓸 얘기는 많지만 이정도에서 배경 설명은 마무리 하겠다. 중요한건 백엔드 공부를 시작했다! 공부 방법회사다니는 동안 nestjs 강의를 하나 듣고 블로그에 글..
배경 react는 기본적으로 state와 props로 데이터를 관리한다. 그리고 props로 데이터를 몇 단계씩 넘기다보니 데이터 관리가 너무 어려워졌다. 이를 props 드릴링이라고 부른다. 이 props 드릴링 문제를 해결하기 위해서 redux같은 상태관리 라이브러리를 도입해서 해결했다. 그러면 이제 모든게 행복하게 해결된걸까? 전역상태관리라이브러리에 접근해서 의존성주입없이 데이터와 UI가 강결합되었다. 이게 결코 옳은 방향은 아니다. presentation component와 container component 과거부터 데이터와 UI를 분리하려는 노력은 계속되어왔다. 과거 리액트는 리덕스를 사용하는게 거의 표준이였다. 그리고 리덕스와 함께 presentation component와 container..
배경 저번 글에서는 웹에서 데이터를 저장하기 위한 방법 중의 하나인 웹 스토리지를 잘 사용하는 방법에 대해 얘기했다. 사실 웹에서 데이터를 저장하기 위한 방법중에 웹 스토리말고 다른 방법도 존재한다. 예를 들어보자. 나는 쇼핑몰에서 20대이상 남성 필터를 걸었다. 그리고 내가 필터를 건 페이지를 친구에게 공유하고 싶다. 그런데 웹 스토리지는 컴퓨터마다 브라우저마다 독립적으로 동작한다. 이럴때 사용할 수 있는 방법이 쿼리파람이다. 기본적인 맥락은 프론트 개발을 하다보면 누구나 쿼리파람을 사용한다. 쿼리파람 리약트로 예시를 들어보자. 저번 글에서 설명한 로컬스토리지와 유사한 부분은 가볍게만 설명하고 넘어가겠다. 1. 쿼리파람 연동하기 1. useState로 상태를 관리하고 있었다. 2. 그 상태를 쿼리파람에..
배경 그동안 개발하면서 참 이런 거 모호하다 라고 느꼈던 것들이 있다. 그런 것들을 정리해보겠다. 1편은 웹 스토리지, 2편은 queryParam, 3편은 props 드릴링 문제를 다룰 것이다. 웹 스토리지(로컬스토리지) 웹에서는 로컬스토리지, 세션스토리지, 쿠키 등등의 가벼운 스토리지가 있다. 그리고 모든 것을 백엔드에 저장할 수도 있지만 상황에 따라 웹 스토리지를 사용해야 하는 경우가 있다. 리액트와 로컬스토리지로 예시를 들어보자. 1. 로컬스토리지 연동하기 1. useState로 상태를 관리하고 있었다. 2. 그 상태를 로컬스토리지에 저장해달라는 요청을 받았다. 3. useState의 initialState와 setState부분에 localStorage를 연동한다. 문제점 localStorage를 ..
배경 개발자로 취업한 지 1년이 넘었다. 벌써? 라는 생각도 들고 아직도? 라는 생각이 들기도 한다. 기록하지 않으면 지금 내 생각을 기억할 수 없으니 조금 구체적으로 회고할 생각이다. 그리고 그동안은 개발에 관련된 내용만 블로그에 적었는데 그 외의 것들도 조금씩 적어보겠다. 회사 가장 먼저 회사 얘기를 해야 할 것 같다. 회사에 들어가서 정말 많은 것들을 배웠다. 다른 회사에 다닌 적이 없어서 모르겠지만 지금 회사에 다녀서 배운 점이 많다고 생각한다. 하나하나 회고 내용을 적고 싶지만 블로그에 쓰는 게 적절하다고 생각하지 않아서 세부적으로는 적지 않겠다. 그리고 블로그에 적지 않은 것이지 개인적으로 많은 시간을 투자해서 회고했다. 사실 회사 일에 집중하느라 생각보다 공부를 많이 못 하기도 했다. 하지..
배경 최근에 서버와 프론트의 공통 타입을 관리하면 좋을것같다는 얘기를 들었다. 예전부터 이런 생각을 했지만 서버와 프론트의 pacakge.json을 합치면 너무 방대해질것같아서 적용하지는 않았었다. 생각해보기 타입스크립트와 프리티어, 린트정도를 전체 패키지에서 설치를 하고 서버와 클라이언트에서 각각의 패키지를 설치하면 괜찮을 것 같다. 즉흥에서 얘기했지만 괜찮은 방법이라고 생각한다. 나의 경우에 프리티어는 공통 타입으로 관리하고 린트와 타입스크립트는 설정이 다르다. 그러면 전체 패키지에서 중복되는 프리티어, 린트, 타입스크립트를 설치하고 프리티어만 패키지에서 관리하면 된다. 그리고 타입스크립트를 공통 타입을 위해 사용되기 때문에 기본이 되는 tsconfig를 설정해주고 프론트 서버에서도 tsconfig를..