Web / App / Data
최근에 진행하고 있는 프로젝트를 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을 설치하여 […]
나는 백엔드 스택을 빡세게 쌓지 않았다. 그 결과, 퓨어 리액트로만 프론트엔드를 구현해서 프로덕션에서 돌리다보니 여러가지 문제가 생겼는데, 그 중 하나가 페이스북에 홈페이지링크를 공유하려고 하니 내가 정성스럽게 react-helmet으로 정성스레 넣어준 html > head 안의 태그들이 나오질 않다는 것. 조금 검색해보니, 구글은 크롤러가 자바스크립트 엔진을 돌리면서 퓨어 프론트엔드 자바스크립트로만 짜여있는 페이지라도 렌더링해서 리액트 돔트리를 렌더링 해주는 것 같았는데, […]