728x90

리액트 2

React로 쇼핑몰 만들기 (1)

React로 쇼핑몰 만들기 (1) 공부했던 React를 복습 삼아 React 웹앱을 만들어 보려고 합니다. 전에 제가 작성했던 내용 정도만 알아도 충분히 만들 수 있는 정도의 작업만 해볼 것입니다. React App을 시작하려면 필요한 것이 node.js입니다. 설치되지 않았다면 node.js를 먼저 설치해 주세요. node.js 공식사이트 node.js와 npm이 설치가 끝났다면 다음은 React App 프로젝트를 생성합니다. 다음 명령어를 통해서 React App 프로젝트를 구성할 수 있습니다. npx create-react-app project-name 위 명령어를 입력하면 react app project 폴더가 생성됩니다. 해당 폴더로 들어가서 npm start로 실행하면 react 로고가 돌아가..

JS/react 2023.07.11

React Router 설정하기, Route 사용하기

React Router 설정하기, Route 사용하기 웹 사이트 내에서 페이지 이동은 어떻게 할까요? 기본 html에서의 페이지 이동은 a 태그를 사용하여 페이지를 이동합니다. React에서는 Router라는 개념을 사용해 페이지를 이동할 수 있습니다. 실제로는 이동하는 것은 아니고 내부 페이지를 바꿔치우는 것이라고 볼 수 있습니다. React App에서 a 태그도 사용할 수는 있지만 React App에서 내부 페이지 이동과 같은 동작을 구현할 땐 Route를 설정하고 관련 기능들을 활용해 페이징 처리를 구현합니다. 먼저 React App Project에 Router를 설치하여 Router를 적용해 줍니다. react-router-dom 라이브러리 설치하기 명령어 yarn add react-router-..

JS/react 2023.07.02
728x90