분류 전체보기
-
[React] 18버전의 추가된 새로운 기능 (step- 2)카테고리 없음 2024. 2. 24. 14:02
개요 React DOM Client React DOM server Automatic batching Concurrent Feature 기타 변경 사항 ✅ React DOM Client 📦 createRoot 사용 React 18버전의 새로운 기능과 API를 사용하기 위해서는 기존에 render만을 사용해서 root를 생성하는 것이 아닌 createRoot를 사용해야 한다. before & after 더보기 before import React from 'react'; import ReactDOM from 'react-dom'; ReactDOM.render( , document.getElementById('root') ); after import React from "react"; import ReactDO..
-
[프로그래머스 1단계] 기사단원의 무기알고리즘 2024. 2. 21. 17:18
❓문제 설명 주어진 number만큼 오름차순으로 array를 만들어야 함 그 array가 각각 몇개의 약수를 가지는 지 알아야 함 그 약수의 개수가 limit보다 크다면 power로 교체해주고 넘지 않는다면 그대로 사용하면 됨 최종적으로 나온 array의 합을 구하면 됨 ✅ 문제 해결 순차적으로 진행을 하면 되기에 아래와 같이 만들었더니 시간초과가 떠서 어디서 시간을 많이 잡아먹는지를 알아야겠다. function 약수구하기 (number) { let totalNumber = 0 for (let i = 1; i 약수구하기(index + 1) > limit ? power : 약수구하기(index + 1)).reduce((a, b) => a + b, 0) return answer; } 약수를 구하는 과정에서 ..
-
[React] 18버전의 추가된 새로운 기능 (step- 1)프로그래밍/React 2024. 2. 17. 19:59
📋 개요 useId startTransition, useTransition useDefferedValue useInesrtoinEffect ✅ useId 최상위 수준에서 호출되어 고유 ID를 생성하는 React Hook으로, 접근성 속성에 전달될 수 있다. key 는 데이터 식별을 위해 사용되므로 데이터에서 생성되는 것이 더 바람직하며, 너무 많은 호출이 일어나기 때문이다. 📦 사용하는 이유) 하드코딩의 횟수를 줄이자 컴포넌트를 여러번 사용하더라도 id 속성이 겹치지 않는다. 더보기 예시) 사용자의 이름 정보를 받기 위해 input을 컴포넌트로 받아서 id값을 name이라고 하였다. 이때 이 컴포넌트를 반복해서 사용하게 된다면 id가 name인 input이 여러 개 생기게 되는데 이는 좋은 상황이 아니다..
-
[라이브러리] React-query프로그래밍 2024. 2. 15. 15:57
📋 개요 비동기 상태 라이브러리를 채택하는 이유 Get Started 페이징 처리 기법 Optimistic Update 구현 ✅ 비동기 라이브러리를 채택하는 이유 1️⃣ 등장 배경 기존의 상태 관리 라이브러리는 클라이언트 상태 작업에 적합하지만 서버 상태는 다르기에 비동기, 서버 상태 작업에 적합한 라이브러리가 필요해졌다. 데이터를 비동기적으로 가져오고, 캐싱, 동기화, 업데이트 관리의 복잡성을 해결하고, 사용자 UI와의 상태를 동기화하는 과정을 보다 쉽고 효율적으로 하기 위해 등장하게 되었다. 2️⃣ React-Query TanStack 팀에서 만든 라이브러리로 데이터 캐싱 및 기능적으로 더 많은 제어가 필요한 경우에 좋다.(기존 React 뿐만아니라 다양한 프레임워크에서 사용이 가능해 TanStack..