[트위터 클론코딩 챌랜지] 폴더 정리 및 저장소 연결_03[MacOS환경]

이제 프로젝트를 vscode로 열겠습니다. 
그런데 남들이 터미널로 여는것처럼 code 명령어로 열려고 하면 아래와 같이 명령어를 찾을 수 없다고 나올겁니다. 

그렇다면 vscode를 열고 (cmd + shift + p)를 눌러줍니다. 그럼 커맨드 명령창이 나옵니다.

위와 같이 shell 만 입력해도 PATH에 'code' 명령 설치라고 나옵니다. 설치해주시고, 코드 명령어로 실행하면 vscode가 열리게 됩니다.

일단 npm을 설치하기 위해 vscode 내에서 터미널을 열겠습니다.
단축키 (control + shift + ~)로 터미널을 열고 npm install 또는 npm i 해주면 됩니다.

설치를 완료하고 확인을 해줍니다. npm run dev 해주시고 URL 들어가시면 

네, 진행이 잘 된걸 확인할 수 있습니다. 종료는 (control + c)

이제 필요없는 파일을 지울겁니다.

index.css와 App.css는 필요없겠군요 지워주시고 아! assets도 필요없습니다. 지워주세요.
이제 .tsx 파일을 정리할건데

이렇게 깔끔하게 만들어 주시면 됩니다. main.tsx에서 index.css가 import된 부분도 지워주세요.
그리고 다시 npm run dev 해주시면 아무것도 없는 흰 화면이 나옵니다.
index.html에서

밑줄 친 title 부분을 원하시는 웹 네임으로 바꿔주시고 Link rel='icon' ~~~ 어쩌구 저쩌구... 도 지워줍니다. vite 아이콘 쓸거 아니니까!

이제 gitHub과 연결한건데 그러기위해서는 우선 터미널에 git init 해줍니다. 원격저장소와 연결해야하는데 그럼 github에 빈 repository를 생성해줍니다.
다시 vscode 터미널 열어서

git remote add origin [복사한 주소]

이렇게 해주시면 연결됩니다.

저기에 자신의 repo 주소가 있으니 그걸 입력해줍니다.