개발할래 운영할래?

참고 : [모노레포 새 프로젝트 환경설정하기] 참고 한 포스트는 모노레포 기준이지만, 아래에서 셋팅 할 일반 레포 (react app 하나만 있는 repo) 에도 적용 가능 1. cra with typescript yarn create react-app newproject --template typescript 2. set yarn version as berry yarn set version berry 3. change typescript version [tsconfig.json] yarn remove typescript yarn add -D typescript@4.9.3 (yarn berry 와 매칭 가능한 버전 중 최상위 버전) 4. set eslint [.eslintrc.json] yarn add ..

1. react-query 의 isLoading, error 를 Suspense 및 ErrorBoundary 로 대체했다. (좀더 선언적이며 JSX/TSX 친화적이게) [commit link] a. 우선 react-query client 에 'suspense' 를 사용한다고 {suspense: true} option을 줘야 한다. b. react-query의 useQuery 훅이 반환하는 isLoading,error 를 각각 suspense, errorBoundary 로 대체한다. 빨간색 표시 : isLoading -> suspense (참고 : Suspense with React-Query 사용법) 보라색 표시 : error -> ErrorBoundary c. ErrorBoundary 는 아직까진 Re..

1. 어떤 챌린지 이고 어떤 강의일까? 원티드 프리온보딩 챌린지란? 원티드에서 매달 프리온보딩 챌린지를 하고 있다. 강의도 해 주면서 원티드를 통해 채용연계(물론 지원은 스스로 해야하죠 ^^7) 및 상금 수여까지 한다. (높은 강의 퀄리티를 보면 채용연계 보단 공짜로 개발자 교육시켜주고 싶어서 안달난 것 같은...크흠... 원티드 애용하겠읍니다.) 회차가 꽤 된 것 같던데, 지난 11월에야 이런 좋은 교육을 알게 됐다니. 후회가 된다. 12월 챌린지(monorepo) 때 강의 내용이 너무 좋았어서 이번 강의도 신청하게 됐다. 이번 챌린지의 주제/내용 React Query 를 적용해 TODO List CRUD 기능이 있는 웹서비스를 만들어 보는 주제였으며, 강의를 들으면서 사전과제를 발전시키는 방식으로 과..

Interface vs Class : interface 는 typescript 가 컴파일 타임(코딩할 때)에 타입 체크를 해주기 위한 '구조체' 같은 것(객체 타입을 정의하는 게 아님! 타입 체크를 위해 임시로 만드는 dummy 타입 이라 생각하자). 즉 컴파일 돼서 js 화 되면 사라진다. 반면에 class 는 객체 타입을 새로 정의하는 것이며, 객체 프로퍼티/메소드 를 갖고 있고, 컴파일 해서 js 화 해도 (런타임) 남아 있다. 불필요한 메모리/파일크기 낭비를 막기 위해선 interface 를 쓰면 되겠고, 클래스 로써의 기능이 꼭 필요한 경우라면 class 를 쓰면 되겠다. 참고 : https://stackoverflow.com/questions/51716808/when-use-a-interfac..

최근 시작하는 몇 개의 사이드 프로젝트에서 '게시판' 기능이 필요했기에 아예 해당 컴포넌트를 라이브러리로 npm 에 배포해 사용하고자 npm 라이브러리를 만들었다. 라이브러리 결과물 : https://www.npmjs.com/package/vue-board-component vue-board-component ## This reusable component is bulletin board ('table' based on 'div( display: table )'). Latest version: 0.2.8, last published: 10 hours ago. Start using vue-board-component in your project by running `npm i vue-board-compon..