리액트 기초(하나하나 따라해보기) 10편

이번 시간에는 지금까지 배운 걸 응용해서 쇼핑몰을 만들 예정이다.

 

1편처럼 폴더를 하나 생성한다음 npx create-react-app shop 을 파워쉘로 입력한다. 아 그리고 파워쉘을 여는 방법은 그 폴더에 들어가서

 

이렇게 폴더를 열고 파일을 눌러보면 윈도우파워쉘 열기가 있는데 이걸 클릭 후 저 명령어를 입력하면 리액트 프로젝트가 생성이 된다.

 

다음은 디자인을 예쁘게 만들기 위해 리액트 부트스트렙에 들어간다

https://react-bootstrap.github.io/

React-Bootstrap

 

그 후 get start 로 들어가고

다큐먼트를 따라하면 됩니다.

 

 

여기있는 두 방법중 원하는 방법을 적용하면 된다.

아래 방법 같은 경우는 퍼블릭 폴더의 index.html 파일 안에 들어가서 넣어주면 된다.

 

나는 아래의 방법을 적용시키겠다.

 

이제 코드로 4번째 줄의 버튼 컴포넌트를 추가해 주고 9줄부터 11번째 줄의 코드를 추가해주면 버튼이 생성되는 것을 알 수 있다.