frontend/React 3

[react-i18next] 한영 번역 라이브러리

다른 블로그들에선 i18next 도 설치해서 쓰던데, 공식문서보니 그럴 필요는 없는것 같다. 라고 생각했는데 해야한다. ㅎㅎ; simple-multi-namespaces에 있는 코드 한번 보세요 한영 변환 코드 const NavBar = () => { const { t, i18n } = useTranslation() const toggle = useCallback(() => { i18n.changeLanguage(locale) },[i18n]) return ( toggle('en')} title="영어" style={{ color: 'white', paddingRight: '10px' }}> en toggle('ko')} title="한글" style={{ color: 'white' }}> ko ) } ..

frontend/React 2023.10.20

Redux-toolkit을 사용해야하는 이유 (Feat.미들웨어)

redux는 SinglePageApplication framework와 함께 사용 가능하다. redux는 복잡성, 많은 패키지와 보일러플레이트 코드로 인해 redux-toolkit으로 대체되고 있다. 공식 홈페이지에선, Redux Toolkit은 Redux 코어 뿐 아니라 저희가 Redux 앱을 만들 때 필수적이라고 느낀 패키지들을 포함 (Redux Thunk나 Reselect 등)한다고 한다. 실은, react를 배울때 멋진 팀원덕에 처음부터 redux-toolkit을 써서 redux의 불편함을 잘 알진 못한다. (이에 자세히 알고 싶다면 참고 링크를 보길 바랍니다.) 그래서 왜 redux-toolkit을 썼나요? 라는 질문에 대답을 못했다. 찾아보던중 middleware에 대한 개념을 잘 못잡고 있는..

frontend/React 2022.12.17

[오류] Type '{ children: Element[]; }' has no properties in common with type 'IntrinsicAttributes'.

문제의 코드, children에 계속 밑줄이 그어짐 const TodosContextProvider: React.FC = (props) => { return ( {props.children} ) } 해결 type Props = { children?: React.ReactNode; }; children 정의. react 18 에선 children지원하지 않는다고 함. 리액트 18의 타입스크립트 타입 변경점 React(리액트) 18이 얼마 전에 출시했습니다. 개발하시는 프로젝트에 이미 업데이트 했거나 조만간 업데이트 하실 계획일텐데요. 리액트와 Typescript(타입스크립트)를 같이 사용했던 프로젝트라면 blog.shiren.dev

frontend/React 2022.09.04