[React] yarn을 이용해 CRA 진행하기(feat. git 레포지토리 생성)

안녕하세요? 제 대학생활의 마지막 기말고사를 치루고 오랜만에 포스팅 합니다 ㅎㅎ 마지막 시험은 정말 잘 마무리하고 싶어서 잠시 제 본업을 놓았었네요... 반성합니다 3주동안 비어진 잔디들을 보고 많이 현타가 왔네요 다시 열심히 달려봅시다!

---

저는 NHN 웹사이트의 리뉴가 거의 끝나가서 Studio Dragon사의 웹사이트 리뉴를 시작해보려고 합니다.
그래서 오늘의 포스팅은 yarn을 이용해서 새로운 프로젝트를 생성하고, git에 레포지토리를 생성하는 것까지의 과정을 간단하게 담아보려고 합니다.

-

1. 컴퓨터 폴더에서 프로젝트를 생성할 폴더로 들어간다.

 

2. 폴더의 빈공간 아무곳에나 오른쪽 버튼을 눌러 Git Bash Here을 눌러 명령창을 연다.

 

3. yarn을 처음 써본다면, 즉 yarn을 설치하지 않았다면 다음 명령어로 설치한다.

npm install -g yarn

 

4. 설치가 되었다면, 다음 명령어로 원하는 프로젝트명을 넣어 입력한다.

yarn create react-app 원하는프로젝트명

설치가 5분 이상은 걸리더군요 당황하지 말고, 짜증내지 않고 다른 것을 하고 있다보면 설치가 되어있으니 침착 쓰 ~

5. 마지막 줄에서 ~어쩌고 Happy hacking! 이라는 글귀를 보셨다면 프로젝트 폴더 생성완료!

 

---

다음은 이렇게 만든 폴더를 git에 repository로 생성하는 방법입니다.

1. 자신의 git에 접속한다.

 

2. 오른쪽 상단에서 자신의 프로필을 클릭한다.

3. Your repositories를 클릭한다.

 

4. 우측에서 New 초록색 버튼을 클릭한다.

 

5. Repository name만 원하는 이름으로 설정한다. (나중에 수정이 가능합니다.)

완료 버튼을 누르면 코드들이 있는 페이지가 뜨는데 끄지 않고 냅둔다.

 

6. 이제 vscode를 열어서 아까 위에서 create한 폴더를 Open Folder 한다.

 

7. 폴더를 열었으면 터미널창을 연다. (ctrl + shift + `)

 

8. 다음 코드를 터미널 창에 작성한다.

git init

 

9. 아까 코드가 있는 페이지에서 다음 코드 들만 복사해온다.

저 세 줄을 ctrl c해서 터미널에다가 ctrl v 한다. 위의 저 코드는 저의 프로젝트 코드라 반드시 여러분의 코드를 복사해서 쓰셔야 합니다요

10. Git에서 Repositories 메뉴에 들어가 보면 레포지토리가 생성되어 있다.