CRA(Creact-React-App)을 통해 편한게 리액트 환경의 프로젝트를 만들 수 있다.
그리고 덕분에 필요없는 코드와 파일도 함께 생성되는데, 이런 불필요한 파일들을 정리해주자
** 공통 : 주석은 당연히 모두 지워도 된다.
1. public /
- public 폴더 내에 존재하는 파일들을 가르킨다.
1-1. robots.txt -> 삭제
-> 웹 크롤러가 쓴다고 하는데, 프론트 개발할 때 크게 필요한 경우는 없을 것 같다.
1-2. logo192, logo512.png -> 삭제
1-3. manifest.json -> 삭제
1-4. index.html -> 코드 수정
|
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
-> 위 두줄의 코드를 삭제한다.
-> apple-touch-icon 의 경우 PWA로 제작할 때 필요하다, 혹시 PWA 제작을 원한다면 지우면 안 된다.
-> 깔끔하게 코드를 바꿀 때 title도 프로젝트에 맞게 이름을 바꿔주자
이렇게 하면 public 폴더 내엔 favicon.ico, index.html만 남는다.
favicon도 나중에 본인이 원하는 이미지의 ico형태로 바꿔주면 좋다.
2. src /
- src 폴더 내에 존재하는 파일들을 가르킨다.
2-1. reportWebVitals.js -> 삭제
-> 보통 PWA로 프로젝트를 만들 때 자주 사용된다고 한다, PWA 프로젝트가 아닌 이상 필요없을 듯 하다.
2-2. setupTest.js -> 삭제
2-3. logo.svg -> 삭제
2-4. appTest.js -> 삭제
2-5. App.js -> 코드 수정
|
import logo from './logo.svg';
<img src={logo} className="App-logo" alt="logo" />
|
- 위에서 logo.svg를 삭제했기 때문에 없는 파일을 import, 사용하면 에러 난다.
2-6.index.js -> 코드 수정
|
import reportWebVitals from './reportWebVitals';
reportWebVitals();
|
- 위와 동일하게 파일을 지웠기 때문에 import, 사용하면 에러난다.
준비 끝 리액트를 사용하자