글쓰기 개발기록/React3 [React] React-router-dom 리액트 라우터 리액트는 SPA(Single Page Application)방식으로, 페이지를 새로고침하지 않고 변경된 부분만 자바스크립트를 통해 업데이트하는 방식이다 리액트에서 외부 라이브러리를 사용하여 SPA 페이지를 구현하는 방법에는 여러가지가 있다 그 중에서 React-router-dom을 사용해서 라우팅을 구현해보자 여기서는 빠른 페이지 구현을 위해, CRA으로 만든 리액트앱에서 프로젝트를 진행해보겠다 1. react-router-dom 설치 npx create-react-app router-tutorial 또는 npm create-react-app router-tutorial 을 통해 리액트앱을 생성해준다 (나는 지난번에 만들어둔 my-app을 사용했다) 다음으로 명령프롬프트에서 해당 디렉토리로 이동한다 cd.. 2022. 2. 5. [React] 리액트 웹팩으로 시작하기 지난 포스팅에서 CRA를 이용하여 쉽고 빠르게 리액트 개발환경을 구축해보았다. https://spectrum20.tistory.com/entry/React-CRA%EB%A1%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%8B%9C%EC%9E%91%ED%95%98%EA%B8%B0-%EC%84%A4%EC%B9%98%EB%B6%80%ED%84%B0-%EC%84%A4%EC%A0%95%EA%B9%8C%EC%A7%80 [React] CRA로 리액트 시작하기 - 설치부터 설정까지 왕초보의 구구절절한 리액트 개발을 시작합니다. Create React App(CRA)는 리액트를 배우기에 간편한 환경이다 - (리액트 문서 참조) CRA을 이용하면 웹팩이나 바벨같은 복잡한 설정을 몰라도 리액트를 spectr.. 2022. 2. 2. [React] 리액트 시작하기 - Create React App(CRA) 왕초보의 구구절절한 리액트 개발을 시작합니다. Create React App(CRA)는 리액트를 배우기에 간편한 환경이다 - (리액트 문서 참조) CRA을 이용하면 웹팩이나 바벨같은 복잡한 설정을 몰라도 리액트를 쉽게 시작할 수 있다. 웹팩 그런거 나는 잘 모르겠고~ 일단 무작정 CRA를 통해 리액트를 시작해보겠다. 1. node.js 설치 먼저, 초기 설정을 위해 node.js를 설치해준다. (react는 node.js 기반의 라이브러리로, CRA는 node.js 서버에서 실행되기 때문에 node.js를 설치) (리액트 문서에는 Node 14.0.0 이상의 버전 및 npm 5.6 상위버전이 필요하다고 나와있다) https://nodejs.org/ko/download/ 다운로드 | Node.js Node.. 2022. 2. 1. 이전 1 다음 반응형
