[react] 쇼핑몰 project - set) 리액트 생성 및 깃 허브 연결하기

리액트 프로젝트 폴더 생성하기

npx create-react-app

npx create-react-app oline_shop_react_project

깃허브에 생성해둔 레포지스토리와 연결하기

add.readme 파일 생성을 체크 안하고 레포지스토리를 생성하면 아래의 코드가 뜬다.

해당 레포지스토리와 연결한 리액프 프로젝트 디렉토리 내에서 위 또는 아래의 코드를 순서대로 입력하면? 연결완료!

성공, 깃허브 새로고침

해당 react 디렉토리 안의 파일과 폴더가 모두 잘 올라갔다!

해달 리액트 프로젝트 폴더 데이터 수정 후 재 업로드 하는 방법

수정한 내용 추가

git add *

깃에 commit 하기 (추가한 기능 등 메모 등)

git commit -m "test"

현재 폴더의 모든 파일과 폴더, git 레포지스토리에 업로드하기

git push * 

현재 작성되어있는 리액트 창에 띄우기, 미리보기

yarn start (yarn 다운받았을 경우만 사용, 더 빠르다 최신것)
npm start

// mac 다운받는 법  
$ brew install yarn

• 첫 기본 화면
  

먼저 시작할 프로젝트에 필요없는 이러한 리액트 로고 및 작성되어있는 코드 등을 삭제한다.

삭제하면 빈 화면으로 바뀐다. 이제 이 화면을 우리가 채우는 것이다.