프로젝트 프로세스 기록(JavaScript)

완전 무無, 백지상태에서 유有를 만들어내는 프로젝트의 첫 시작.

그 과정을 기록해보고자 한다.

이것은 순전히 나의 기록용/공부용이며, 프로젝트를 하며 잊어버리는 과정들을 적어놓으려고 하는 목적이고, 내가 처음 공부할때 너무 애먹었던 것들이 나중에 누군가에게 도움이 되길 바라며 글을 쓰게 되었다.

 

 

 

#npminit

 

 

아무것도 없는 완전 빈 백지에서 무언가 시작하려고 할때 너무나도 막막한 기분이 들곤 했다.

이럴때 어떤 순서로 진행해야 하는지 기록해두려고 한다.

 

 

 

 

 

#package.json #package.json설명

 

 

1. 제일먼저 해야할것: npm init

npm init 명령어는 package.json 패키지를 만들어주는 명령어이다.

터미널 창에 npm init을 입력하고, 엔터를 쭉 (4번정도?) 치면 기본 내용고 함께 package.json 파일이 생성 된다.

 

 

 

2. npm init으로 패키지파일을 만들게 되면 기본적으로 main: index.js이라고 써있는것을 볼 수 있다

생성된package.json파일을 들어가보면 보이는 main: index.js 뜻은,

프로젝트를 시작할때 제일 먼저 시작하는 파일이 index.js파일이라는 뜻이다.

(그렇기 때문에 생성후 index.js파일도 바로 만드는게 좋다. 이건 일단 만들었다고 치고 넘어갈것임)

 

 

 

3. 필요한 dependencies 받기

npm i express(받을패키지) 또는

yarn add express(받을패키지) 를 입력해서 필요한 패키지들을 하나씩 추가한다. 

 

 

 

 

4. npm install

패키지들을 받았으면 npm install을 통해서 내 프로젝트 폴더에 설치될 수 있도록 한다.

는 yarn이 아니라 npm으로 설명하지만, yarn으로 설치하는 분들은 yarn으로 모두 설정하면된다.

(나는 처음 배운것이 npm이다보니 익숙해서 자꾸 npm만 쓰게 된다)

 

 

 

 

!!    잠깐 여기서,      npm init과 npm install이 하는 역할의 차이    !!

 

npm init은 프로젝트 시작의 '기본 베이스'를 만들어주는것과 같다. 우리가 프로젝트를 시작할때 처음 폴더를 만드는것 처럼, 처음 새로 프로젝트를 시작할 때 npm init을 통해 모듈들이 들어갈 폴더들을 처음 만들어주는 것이다.

npm i express / npm i babel : 폴더를 만들었으면, 그 곳에 npm i express 등을 통해 내가 쓸 모듈들을 받는다.

--> npm i express로 설치를 했다고 자동으로 모든 의존성들이 다 설치가 되는것이 아니다.

이건 말 그대로 express가 가지고 있는 패키지 내용을 쓰겠다고 이름만 추가 한것뿐이다.

(편한 예시로 npm i express, npm i babel등은 zip파일로 원하는 패키지를 받은것과 같은 것)이다.

 

 

npm install :여러가지 의존성(dependency)을 사용하는 것이다. 즉, 받은 의존성들의 zip을 풀어주는 것과 똑같다. 

그래서, 프로젝트를 할때 순서는,

 

 

<요약>

▶ npm init 

▶ 의존성 추가( npm i express, npm i babel, npm i dotenv 등으로 원하는것을 추가) 

▶ npm install (의존성으로 받은 파일들을 진짜 쓸수 있게 해주는 역할 // zip으로 받은 파일들을 압축 해제하는것과 같다)

 

 

 

그래서 꼭 의존성을 새로 추가해 주었다면 

꼭! npm install을 다시한번 실행해 주어야 새로 받은 dependency를 실제로 사용할 수 있게 된다. 

 

협업을 할때에도 package.json에 의존성들이 많이 받아져있을텐데, 그대로 그냥 실행을 하면 에러가 나는 경우가 많다.

package.json에 이름만 올라가 있는 의존성들을 그냥 내용만 받아 온거고, 그걸 실제로 내가 사용하기 위해서는 필시 npm install을 통해 package.json안에 있는 파일들을 사용할수 있게 (zip을 풀어주는 역할을 꼭! 실행!! ) 해야 하는것. 

 

 

4. index.js 파일 작성

가장 먼저 실행되는 파일이 바로 index.js라고 설정을 했기 때문에, 처음에 제일 먼저 index.js부터 파일을 작성해주면 된다.

나는 가장 먼저 sql과 연결을 하는 코드를 짰고 제대로 작동하는지 nodemon으로 확인해 보았다.

 

 

 

여기까지 정말 기초적인 프로젝트 시작 프로세스 기록 1차 끝.