차가운세상

현재 소규모로 커뮤니티 사이트(프로토타입)를 만들고 싶은데 생각을 해보게 되었는데... 기획 부분이 많이 부족한 상태이다. 후보중에 떠오르는 구성은 다음과 같았다. 1. React + Express 2. Next + NestJs 3. Gatsby CMS를 이용하여서 하여야 되는 부분이 있어서 Gatsby가 편리한 부분도 있지만, 제약적인 부분이 많다고 생각이 들어서 적합하지 않다고 판단이 되었다. Gatsby로 블로그를 (3. Gatsby) 배포 완료 후, 인디 게임 리뷰 프로젝트를 진행할 예정 ( 2- Next + NestJS). 현재 프로젝트 목표: 블로그 선정 이유: 개인적인 일상, 생각 등을 관리하기 위한 목적이다. 고려 대상: 1. 도메인 구매 2. 어떤 서비스에 배포 ( github , gat..

대표적으로 많이 쓰이는 Redux, Mobx가 State관리하는 라이브러리인데요. Redux가 Mobx보다 많이 사용되어져서 Context와 비교해보게 되었습니다. 왜 React에서 16.3부터 context 를 제공하였을까요? class 기반의 사용하였을 경우 provider,consumer를 이용하여 쓰기에는 조금 불편하였습니다. hook이 나온 이후에는 useContext, useReducer를 이용하면 편리해졌습니다. 그러면 왜? 아직도 많은 업체들은 Redux를 사용할까? 대략적으로 비교를 해보았습니다. Context Redux store 또는 관리하는것이 없다. 하나의 store에 하나의 object로 관리 되어진다. React Components에서만 작동 React Components 밖에..

web worker란? - 스크립트 작업이 오래 걸린다고 해서 페이지를 멈추고 기다릴 필요가 없어졌다. 웹 워커는 자바스크립트 코드를 UI 쓰레드와는 별도인 백그라운드에서 수행될 수 있도록 하는 표준적인 방법을 제공하기 때문에 웹 페이지를 가로막지 않고 스크립트를 돌릴 수 있게 되었다. Web worker를 언제 사용해야 될까? - 매우 복잡한 수학적 계산 작업 - 원격지에 있는 리소스에 대한 액세스 작업(또는 로컬 스토리지를 액세스 하는 경우) - 백그라운드에서 조용히 오랜시간 작업애햐 하는 경우 - UI 쓰레드에 방해 없이 지속적으로 수행해야 하는 작업 등 - 현재 프로젝트에 트래픽 높은 네트워크 통신에 의해서 UI화면이 멈추는 증상이 있어서 알아보게 되었다. Web worker VS React Vi..

드디어 React-Redux 버전 7.1(배포일 2019/6/11)이 정식 배포 되었습니다. 사실 리덕스 문서를 보러 들어갔다가 알게된 사실입니다. 에헴.... 이제 connect함수를 사용하지 않고도 각각의 dispatch,state를 쉽게 사용가능해졌습니다. 어떻게 써야하는지 간단한 예제로 시작해보겠습니다. Action, Reducer 는 생략 하겠습니다. 예제 기존방식 import React from "react"; import { connect } from 'react-redux' import { incrementAction, decrementAction } from "./Actions"; const counterSelector = state => state.counter; cons..

정식 React 참고 문서에는 구성(composition) vs 상속(inheritance)에 Children을 쓰는 이유를 나와있다. (https://reactjs-kr.firebaseapp.com/docs/composition-vs-inheritance.html) 간단히 말하면 children는 재사용을 위해서 사용된다. 자식 컴포넌트 const Picture = (props) => { return ( {props.children} ) }부모 컴포넌트 render () { return (

타입스크립트와 React와 연동하여서 개발을 연습하고 있는중 많은 부분에서 에러가 발생하는 부분이 있었다.tslint에서 설정을 하는데 아직 정확하게 이해는 하지 못했다. 하지만 다른사람들이 설정해놓은 값으로 하니 에러가 발생하지 않았다.https://github.com/wmonk/create-react-app-typescript/issues/216 많은 부분이 설정에 들어가는데 하나씩 들여다 봐야 하지만 우선 문제가 생기면 하나씩 뜯어봐야할듯 하다. { "extends": ["tslint-react", "tslint-config-prettier"], "rules": { "ban": false, "class-name": true, "comment-format": [true, "check-space"], ..