React (4) 썸네일형 리스트형 내가 만든 것을 빌드와 배포를 해보자!!! ( feat. React 편) 빌드와 배포의 의미는 빌드 소스 코드 파일을 컴퓨터나 휴대폰에서 실행할 수 있는 독립 소프트웨어 가공물로 변환하는 과정을 의미합니다. 배포 나의 개발해서 빌드한 어플을 사용자에게 전달하는 과정을 의미합니다.리액트에서는 빌드는 build 명령어로 배포는 serve 명령어로 가능합니다. 1. build 명령어로 통해서 컴퓨터에서 실행할수 있는 소프트웨어로 변경합니다.andan@LAPTOP-7I2GF3EM MINGW64 ~/Desktop/gitStory/my-ui-app (dev)$ npm run build> my-ui-app@0.1.0 build> react-scripts buildCreating an optimized production build...One of your dependencie.. 예제로 알아보는 Redux 사용법 (1) Redux toolkit 기존의 리덕스는 왜 안쓰고 Redux toolkit을 사용하는 걸까요???? 왜 리덕스 툴킷을 사용할까요? 리덕스 대신에 리덕스 툴킷을 사용하는 이유는 무엇일까요 ? 저는 이 이유를 리덕스 툴킷 공식문서에 가져왔습니다. 저 또한 리덕스를 사용하면서 react-redux , redux 패키지를 설치해야되고 , 리덕스에서 액션 변수와 같은 상용구도 지금은 2개인데 10개 , 100개 , 1000개되면 상용구 코드가 많이 필요하게 되어서 간편화된 리덕스 툴킷이 좋습니다. 1. 리덕스 툴킷으로 만든 전역 상태관리 저장소 combineReducer >>> createStore 의 과정이 간소화해졌습니다. import { configureStore } from "@reduxjs/t.. 예제로 알아보는 Redux 사용법 (1) Redux 오늘 예제는 모달 열기와 닫기입니다.이번 모달은 한 페이지 뿐만 아니라 다른 페이지에서도 사용될수 있다고 가정합니다. [1] 다음 모달 열기 버튼이 있습니다. 저는 위에서 모달버튼의 현재 상태를 한 페이지 뿐만 아니라 다른 페이지에서도 쓰이기에 전역상태로 관리합니다. [2] 프로젝트에서 리덕스 폴더 구조를 세팅합니다. 1. store 폴더를 만듭니다.2. config 폴더를 만듭니다. 전역 상태관리 저장소인 store 파일을 보관합니다. 3. modules 폴더를 만듭니다. 리덕스 모듈을 보관할 파일을 보관합니다. [3] 전역 상태 관리 저장소를 만듭니다. >>> 액션 변수 , 액션 함수 , 리듀서가 담겨있는 파일을 만듭니다. >>> 루트 컴포넌트에 전역 상태관리 저장소를 Provider.. <React.StrictMode> 는 뭘까 React.StrictMode에 대해서 쓸모를 못느끼고 지우는 사람도 있다. 나는 리액트에 React.StrictMode는 왜 있는가가궁금해서 살펴보게 되었습니다. [1] React.StrictMode는 왜 있는 것일까 ? 리액트 공식문서에서는 다음과 같이 설명을 하였습니다. StrictMode 는 개발 초기에 발생할 수 있는 버그들을 찾아줍니다. 라고 나왔습니다. [2] StrictMode는 리액트 코드에서는 어떤 모습일까요 index,js 에서 App 컴포넌트를 감싸고 있습니다. 그러면 여기에서만 쓰이는 것일까요? 아니요, 리액트 공식문에서는 어플리케이션의 다른 부분에서도 사용이 가능하다고 말합니다. function App() { const teams = [ { .. 이전 1 다음