
React 프로젝트 생성
React 프로젝트 생성 원하는 프로젝트에서 cmd에 들어간 후, npx create-react-app 프로젝트명 입력
- Front-End Study/React
- · 2023. 9. 8.
& 선택자 1. & 선택자 - CSS에서 부모 요소를 나타내는 선택자 - 주로 Sass(SCSS)와 같은 CSS전처리기에서 사용 - 중첩된 선택자를 나타내는데 사용됨 2. 예시 See the Pen Untitled by NewBean0312 (@newbean0312) on CodePen.
@function 1. @function - 사용자 정의 함수를 만들어 스타일 시트에서 재사용 가능한 코드를 작성하는데 사용 - 스타일 속성을 계산하거나 값을 조작할 수 있으며, 더욱 유연한 스타일링 가능 2. 사용법 See the Pen Tistory_Front-End Study_Sass_@function_2. 사용방법 by NewBean0312 (@newbean0312) on CodePen.
React 프로젝트 빌드하는 법 1. React 프로젝트 빌드 - #1. vsCode에서 터미널에 들어간 후, npm run build라고 입력 - #2. 생성된 build 파일을 미리 만들어 놓은 깃허브 repository에 넣음
immer 1. immer - React와 함께 사용되며, JavaScript에서 불변성을 관리하기 위한 라이브러리 중 하나 - 상태 관리 및 업데이트를 보다 간편하게 만들어줌 - 불변성을 지키면서 상태 업데이트 가능 2. 사용방법 ※ immer 사용 시, 설치 필요 (npm install immer or yarn add immer) - produce 함수를 사용하여, 업데이트할 데이터를 전달하고, 업데이트할 내용을 함수 안에서 변경함 const userState = { name: 'Kim', age: 15, }; const newState = userState(state, (draft) => { draft.age += 1; }); console.log(newState); - 중첩된 객체와 배열의 업데이..
React 프로젝트 생성 원하는 프로젝트에서 cmd에 들어간 후, npx create-react-app 프로젝트명 입력
useParams 1. useParams - React 애플리케이션에서 동적 URL 파라미터를 추출하는데 사용되는 훅 - 사용자 정의 데이터를 전달하는 데 유용 - 이를 통해, 블로그 게시물 ID or username과 같은 정보를 URL에 포함시킬 수 있음