개인공부

[ Naming ] Index.js / App.js 의 차이

chsua 2023. 2. 14. 13:24

프리코스 때에 우테코에서 준 파일들의 형식은 App.js가 기본이 되었다.

이 위에 input/output/constant 등을 require/exports 하며 운용했다. 

 

하지만 이번 파일의 이름은 index.js였다.

이에 대해 우리팀(나의 페어를 포함하여 3쌍의 페어)는 아래와 같이 행동했다.

 

1. index.js 속에 class app을 만들고 파일 Controller.js를 만들어 연결하고  controller중심으로 코드를 짠다.

2. index.js 속에 class app을 만들고 여기를 중심으로 코드를 짠다. (나!)

3. app.js를 index.js로 수정한 후 파일 Controller.js를 만들어 연결하고  controller중심으로 코드를 짠다.

 

여기에서 잘못된 코드는 없다..

늘,,, 언제나 생각을 해보라는 답뿐..

 

그래서 생각을 해보자면 왜 이번에는 app이 아닌 index로 파일이 주어졌을까?

내가 리액트를 맨 처음 배울때 HTML, CSS, JS의 이름이 모두 index인 것이 생각났다.

둘다 기본 파일로 사용하는 것이면 왜 두 이름이 굳이 구분되어있는걸까.

 

그렇게 찾은 결과는, 관습적으로 아래와 같이 사용된다고 한다.

index.js =  application, 응용 프로그램의 출입구. app을 구동하기 위한 랜더링에 대한 논리가 포함됨.

app.js = application의 구성요소로, 기능을 구현하기 위한 여러 계층 중 가장 상위로 앱에서 계층구조를 유지하는 느낌.

 

검색을 하면서 해당 단어들이 react와 연결되어서 출력되었다. (영어로 쳐야 나와영,,)

아마 리액트를 통해서 user의 입력을 받고 출력하기 때문에 해당 부분과 기능부분의 분리를 하기 위함이 아닐까 했다.

 

그리고 우테코에서 console을 이용하는 것 외에 홈페이지를 통해 input을 받는 것도 하기 때문에

이번에 index.js를 파일명으로 설정하지 않았나 싶다.

(이번에는 console이 중심이었지만)