1️⃣Tanstack Query 탠스택 쿼리(TanStack Query)는 데이터 fetching, 캐싱, 동기화, 업데이트를 쉽게 관리하도록 돕는 React 라이브러리 Mutation (useMutation)useMutation은 데이터를 서버에 생성, 수정, 삭제 등의 작업을 수행할 때 사용한다.이 코드에서는 createPlaylist API 호출을 처리하기 위해 사용되었다. const createPlayListMutation = useMutation({ mutationFn: createPlaylist, onSuccess: () => { queryClient.invalidateQueries({ queryKey: ['playlists'] }) handleToastSucces..
https://www.acmicpc.net/problem/20546문제 요약목표: 두 투자자, 준현이와 성민이의 투자 전략 중 어떤 것이 더 높은 수익률을 내는지 비교한다.제공 정보:초기 현금14일 동안 매일 변하는 주식 가격 리스트투자 전략:준현이의 "BNP" 전략:주식을 살 수 있으면 최대한 많이 산다.한 번 산 주식은 절대 팔지 않는다.성민이의 "TIMING" 전략:주식 가격이 3일 연속 상승하면 보유 주식을 전부 판다.주식 가격이 3일 연속 하락하면 보유 현금으로 최대한 많이 산다.결과 계산:14일째 (마지막 날) 각자의 총 자산을 계산합니다.자산 = 남은 현금 + (보유 주식 수 × 마지막 날 주식 가격) 문제를 풀기 위한 가정투자 제한:주식을 매수할 때는 가진 돈으로만 사고, 빚을 내지 않습니..
React.FC란?Function Component의 줄임말로 React + TypeScript 조합으로 개발할 때 사용하는 타입함수형 컴포넌트 사용 시 타입 선언에 쓸 수 있도록 React에서 제공하는 타입React.FC 사용해보기 type UserProps = { name: string;}; const Profile: React.FC = ({name}) => { 안녕하세요, {name}님 );export default Profile;React.FC를 사용하는 경우 위와 같이 props의 타입을 Generics로 넣어서 사용한다. React.FC 사용을 지양해야 하는 이유우선 지난 문서이긴 하지만 CRA에서 기본 템플릿에 FC를 빼야한다는 PR이 올라왔고, 그것이 실제로 반영되었다고 한다. 그 이유는..
리액트 context가 무엇인지, 어떻게 사용하는지, 언제 사용하고 사용해서는 안되는지 알아보자 리액트 context란?리액트 context 는 앱에서 컴포넌트에 props를 사용하지 않고 필요한 데이터를 넘겨주며 사용할 수 있게해준다.▶ 리액트 context는 컴포넌트들이 데이터(state)를 더 쉽게 공유할 수 있도록 함리액트 context를 사용해야 할때앱의 모든 컴포넌트에서 사용할 수 있는 데이터를 전달할때 유용- 테마데이터- 사용자 데이터(현재 인증된 사용자)- 로케일 데이터 (언어 혹은 지역) 데이터는 자주 업데이트할 필요없는 리액트 context에 위치해야한다.왜??context는 전체적인 상태관리를 위해 만들어진게 아니라 쉽게 사용하기 위해 만들어짐 > 리액트 context는 컴포넌트를 ..