분류 전체보기22 [React] React 19에서 react-query 안될 때 오랜만에 react + ts 뇌를 다시 깨우면서 과거에 유료결제 했던 강의를 보고 있는데그 당시 버전으로는 되었던 것들이 이제 와서는 충돌이 생긴다 ㅠㅠ 최신 버전에 맞춰서 오류를 해결해가며 한 번 프로젝트를 작성해보자그러다보니이젠 CRA도 안쓰고 vite를 사용하여 react 프로젝트를 v19로 생성하는데,더이상 react-query는 해당 버전을 지원하지 않는 것이었다. ( v18 까지만 지원 ) 이유를 찾아보니 " Vue나 Svelte 등의 다른 프레임워크에서도 활용할 수 있도록 기능이 확장되며 TanStack Query라는 이름으로 변경되었다 " 라고 한다 ㅡ.ㅠ heropy님 블로그를 참고하여 TanStack Query를 설치하여 이용하자https://www.heropy.dev/p/HZaKIE .. 2025. 7. 21. [React] 리액트 라우터 사용 방법 ( React router , v6, v7 ) React Router 은 React 앱에서 페이지 이동을 도와주는 도구다.예를 들어 홈페이지에서 로그인 페이지로, 로그인 페이지에서 마이페이지로 이동할 때 필요한 기능들을 제공한다. 2024년 11월 22일 React Router가 v7을 출시하면서 그 이전 버전인 v6과는 차이점이 있으니유의하여 다루어 보도록 하자1. Vite로 프로젝트 생성npm create vite@latest이후 원하는 react 프로젝트 생성 2. React rotuer 설치v6npm install react-router-domv7npm install react-router 이제는 패키지 하나로 모든 기능을 쓸 수 있어서 react-router만 설치해주면 된다.기존 코드를 v6에서 v7로 업그레이드할 때에도 import 부분.. 2025. 7. 21. [React] styled-component 사용법 React에 css를 적용하는 기본적인 방법은 세 개로 나눌 수 있다.1. Css 파일 import하기2. style prop에 js 객체로 스타일 코드 넣어주기3. Css 모듈 사용 하지만 styled-component를 사용하면css 파일을 나눌 필요도 없으며, 기본 html 태그에 커스텀 이름을 붙여줄 수 있다. 설치 및 설정우선 npm create vite로 react 프로젝트를 생성하자.그다음 styled-components 라이브러리를 install 하자npm i styled-components 기본 컴포넌트 생성styled.HTML태그명 에 템플릿 리터럴을 사용하여 CSS를 작성한다.import styled from 'styled-components';const Button = styled... 2025. 7. 17. [모던 자바스크립트 Deep Dive][15] let, const 키워드와 블록 레벨 스코프 var 키워드로 선언한 변수의 문제점변수 중복 선언 허용만약 동일한 이름의 변수가 선언되어 있는 것을 모르고 변수를 중복 선언하면서 값을 할당했다면 먼저 선언된 변수 값이 변경되는 부작용이 발생한다.var x = 1;var y = 1;// var 키워드로 선언된 변수는 같은 스코프 내에서 중복 선언을 허용한다.// 초기화문이 있는 변수 선언문은 자바스크립트 엔진에 의해 var 키워드가 없는 것처럼 동작한다.var x = 100;// 초기화문이 없는 변수 선언문은 무시된다.var y;console.log(x); // 100console.log(y); // 1 함수 레벨 스코프var 키워드로 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다.함수 레벨 스코프는 전역 변수를 남발할 가능성을 높.. 2024. 10. 25. 이전 1 2 3 4 ··· 6 다음
