Web / App / Data
다음 코드를 보자. redux 예제로 많이들 사용하는 counter example이다. counterActions라는 action creator를 사용해서 action을 만든다. 이 counterActions 오브젝트는 각 키에 맞는 액션 생성함수를 갖는다. (따라서, action을 생성하기 위해 counterActions.increment()를 호출한다.) 이렇게 만들어진 액션을 바로 dispatch()에 넘기는 단순한 코드다. 이 단순하지만 반복되는 dispatch의 래핑 중복을 없애고 싶었다. 간단하게 구현해보자. 대략 이런 모양이 될 것이다. 그리고 다음과 […]
최근에 진행하고 있는 프로젝트를 React + TS의 조합으로 운영해봤다. React의 생태계가 워낙 괜찮다보니 사용하면서 내가 직접 타입을 작성한 라이브러리는 react-image-annotation, react-redux-firebase 두 개 정도. 단점은 다들 알다시피 러닝커브가 있다는 것. 하지만, 타입 없이 프로그래밍 하는 것은 오른손잡이가 굳이 왼손으로 밥 먹는 바보같은 일이라고 생각한다. 가장 명확하고 직관적으로 손쉽게 잡을 수 있는 타입 에러를 굳이 런타임까지 […]
요즘 React를 다시 써보고 싶어졌다. Vue로 너무 많은 프로젝트를 진행했고, Vue도 나름 메인스트림에 올라온 것 같지만, 아직도 React의 기세는 멈출 줄을 모르는 느낌. 그래서 만만한 Flurry를 다시 작성해보기로 했다. Vue -> React, Vuex -> Relay, Bootstrap4 -> Mobile Ant Design, Front-end only -> Back-end enabled, … Test도 하나 없이 짜던 프로젝트였는데, jest, nightwatch로 테스트 세팅도 […]
최근에 PR 보내서 merge된 것이 있었다. 코드를 짠 것은 하나도 없었고 README.md 만을 수정한 PR이라서 더 간단히 승인받은 느낌. 간단히 설명하면, babel-plugin-import의 기능을 ts-loader에서 구현한 ts-import-plugin이라는 녀석이 있다. 그 기능이라 함은, lodash로 대표되는 대형 라이브러리를 수동으로 쪼개서 import할 때 import isNil from ‘lodash.nil’;로 귀찮게 작성하느니, 그것까지 babel-transpiler에서 preprocessing을 해주겠다는 것. 하지만 TypeScript는 babel을 안쓰잖아? 그래서 TS쪽에서는 […]
현재 Storybook 최신 버전에서는 Webpack3을 사용하고 있다. 본 프로젝트에서 TypeScript를 Webpack4와 사용 중이었다면, 스토리북의 Webpack3와 ts-loader가 충돌한다. ts-loader의 최신버전이 Webpack3과 완벽하게 호환되지 않기 때문이다. Webpack3과 호환되는 ts-loader는 3.5.0이 있다. ts-loader의 버전을 내리면 본 프로젝트에서 터지게 되는 딜레마에 빠진다. 다행히도, Webpack에서 TypeScript Loader는 두 가지가 공존하고 있다! 1) 본 프로젝트에서 Webpack4 + ts-loader를 사용중이었다면 awesome-typescript-loader 4.0.1을 설치하여 […]