본문 바로가기

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 = [ { ..