Copyright 2021.devkimsonAll rights reserved.
Categories
Tags
8
16
32
react-router-dom에는 미들웨어 설정이 따로 없다. 아예 없는 것은 아닙니다만 리액트에서 미들웨어처럼? 사용하는 방법이 있습니다. 필요한 예로는 로그인하지 않은 상태에서 로그인이 필요한 서비스에 접근하려할 때 등인데요, 아래는 예시 코드로서 기록해둡니다.
2022년 09월 07일
Typescript Study 이번 프로젝트에 사용하지는 않지만 추후 어떻게 될지 모르기도 하고, 타입스크립트를 배워둬야 하는 상황이라 이번 스터티를 타입스크립트로 정했습니다. 내용이 많이 부실할 수 있습니다. 참조한 링크를 포스팅 하단에 정리해두고 있으니 자세한 내용을 꼭 참조하시기 바랍니다.
2022년 06월 19일Slow Render를 위한 startTransition 이제 막 입사하고 `react`와 `next`를 공부한지 3주째가 됩니다. 아직 방대한 데이터를 처리하고 최적하한 경험은 없지만, `hooks`를 자유자재로 다루기 위해 여러 강의를 보던 중 `useTransition`을 알게 되었습니다. useTransition은 왜 나왔나 대게 사람들은 0.2초에 화면이 반응하지 않으면 페이지가 느리다고 생각합니다. 즉각적인 변화를 기대하는 반면에 화면에 나타나는 변화를 지연해야 할 때도 있습니다. `useTransition`으로 인해 해결되는 문제들이 있는데, 예로는 많은 데이터를 리스트로 출력한다고 가정한다면, 데이터 필터링이나 필드 값 제어를 할 경우 화면에서 수많은 일들이 발생할 수 있습니다. 사용방법은 아래와 같습니다.
2022년 06월 07일문제 상황 문제상황은 이렇다. 위 코드와 같이 `state`의 형태가 배열 내에 객체가 있고, 객체 내에 배열이 있다. 문제는 깊이 있는 배열은 최초 생성 시 배열에 담겨 새로운 `task`가 생성되어야 하고, 같은 날짜에 내용을 등록한다면 해당 날짜의 `tasks`에 `task`가 배열에 추가되어 업데이트 되야하는 상황이다.
2022년 05월 30일useState Hook `useState`훅은 `React` 버전 `16.8`부터 새로 추가되었다. `Hook`을 이용해서 기존에는 `Class` 바탕의 코드 작성이었지만, 그럴 필요없이 함수형 컴포넌트에서도 사용할 수 있게 되었다. 그 중에서도 `useState`라는 기초되는 기능을 정리하고자 한다.
2022년 05월 26일JSX와 특징 이 글은 리액트 홈페이지의 내용을 토대로 작성되었습니다. React 시작하기 01 에 이어서 작성 중입니다. 버전이 `v18.x`로 업데이트된 시점에서 변경된 부분과 자세한 내용을 적기 위해서 이전 포스팅과 겹치는 이야기가 있지만 양해바랍니다. `JSX`와 `Root`의 지정, `어트리뷰트` 사용, `JSX자식 요소` 정의에 대해 정리해보려합니다.
2022년 05월 13일React 시작하기 Frontend의 3대 끝판왕이라 하더군요. 제가 아직 React나 Angular, Vue를 써본적이 없어 얼마나 좋은지 아직 상상도 안됩니다. 그래서 오늘부터 Vue를 병행 공부하며, 이후에는 Spring과 연동하여 프로젝트를 테스트 해보고자 합니다. 요즘에 Python이 자주 보여서 Python도 조금씩 시작하면서 포스팅하면 어떨까 합니다. 결국 하나를 파더라도 주변의 것들도 알아둬야 할 것 같다는 생각이 듭니다.
2021년 08월 11일