리액트 : 파일 까보기

리액트는 많은 파일이 있다. 많은 만큼 제대로 알아보자!

index.html :

보여지는 한 개의 페이지이다.

<div id="root"></div>

가 내용으로 들어가있다.

index.js :

index.html에 뿌려주는 JS이다.

root.render(<App />)

코드를 통해서 컴포넌트를 뿌려준다.

app.js (Router.js) :

뿌려지는 컴포넌트이다. 여러개의 페이지를 뿌려주기 위해 라우터를 활용한다.

<Route path="/" element={<Main / >} />
<Route path="/login" element={<Login / >} />
<Route path="/signin" element={<Signin / >} />

package.json / package-lock.json 차이점! :

package.json 이란?

package.json은 프로젝트에 대한 메타정보, 그리고 설치한 패키지의 의존성 및 버전을 관리하는 파일이다.

package-lock.json 이란?

package-lock.json은 이 package-lock.json이 생성되는 시점의 의존성 트리(node_modules)에 대한 정보를 가지고 있는 파일을 말한다.

즉!
package.json이란 버전정보를 대략적으로 저장할 때 사용한다.
package-lock.json이란 버전정보를 정확히 저장할 때 사용한다.

중요한 버그 수정이 이루어질 때 오류를 막기위해 package.json에 대략적인 정보를 저장한다.

node_modules 란?

package.json에 있는 모듈이 의존하고 있는 모듈 전부를 포함하고 있다.

.gitignore 란?

.gitignore 파일은 git의 root 디렉토리에 저장되어, git repository에 추가되지 말아야 할 폴더나 파일을 정의하는 파일이다.