String.prototype.localeCompare

javascript의 localeCompare는 java의 compareTo와 비슷한 느낌이다. 이제 더 이상 문자열 정렬에서 if (str1 < str2) { return -1; } … 과 같은 장황한 코드를 사용하지 않아도 된다. 꽤나 예전부터 지원된 함수이니, 부담없이 사용해도 되고, 내가 이걸 도대체 왜 몰랐을까 싶을 정도로 후회된다. 특히나 localeCompare 링크를 들어가보면 Do NOT rely on exact return values of -1 or 1! 라고 되어있다. 바닐라 js를 조금 더 믿어보자. 정말 아무것도 없는 언어인 것은 맞다만…

Vue & Vuex Convention

Vue 프로젝트를 진행하면서 만든 Convention들을 정리해본다. Vue2와 관련된 설정이니 (나중에 이 글을 보게된) Vue3의 사용자들은 감안해주시길. Project Structure vue-cli를 쓰지 않을 이유가 없다. 심지어 create-react-app보다 더 완성도 있다고 생각한다. 물론, React 진영은 워낙 스택이 중구난방이라 모든 옵션을 다 넣어준다는 것도 이상하긴 하다만… 아무튼 이 상황에서 우리가 신경써야하는 structure는 다음과 같다. 손쉬운 이해를 위하여 User가 Post에 […]

Vuex-ORM 소개

최근에 리팩토링을 진행하면서 Vuex-ORM을 사용해봤다. 좋다. 추천해본다. 장점 별 수고없이(생각없이) Immutability를 높인다. Nested된 데이터를 다룰 때 매우 좋다. Query를 유연하게 짤 수 있다. 작성자 -> 게시글 -> 댓글 -> 대댓글을 JOIN으로 불러오면서 각 단계에서 orderBy를 다르게 먹일 수 있다. 어려움 없이 JSON object를 Vuex-ORM에 로딩할 수 있다. Vuex getter의 부족함을 많이 메꿔준다. getter를 getter에서 호출하지 […]

타입 손실 없이 actionCreator를 dispatch로 래핑하기

다음 코드를 보자. redux 예제로 많이들 사용하는 counter example이다. counterActions라는 action creator를 사용해서 action을 만든다. 이 counterActions 오브젝트는 각 키에 맞는 액션 생성함수를 갖는다. (따라서, action을 생성하기 위해 counterActions.increment()를 호출한다.) 이렇게 만들어진 액션을 바로 dispatch()에 넘기는 단순한 코드다. 이 단순하지만 반복되는 dispatch의 래핑 중복을 없애고 싶었다. 간단하게 구현해보자. 대략 이런 모양이 될 것이다. 그리고 다음과 […]

Rails ujs pitfall

Rails + Vue로 작업하는 프로젝트가 하나 생겼다. 위와 같이 임포트 한 뒤에, rails의 ujs는 JSON를 완벽하게 지원하지 않기 때문에 위와 같이 데이터를 준비하고, 이런 방식으로 쏴주면 되는데, 이 때 주의사항이 있다. assignee_id는 null일 수도, 어떤 값을 가질 수도 있다. this.someUserId가 null인 경우, 해당 라우팅을 처리하는 컨트롤러의 메소드에서는 0으로 들어온다. null과 실제 0을 구별하지 못하게 되는 […]