[7/12] 1차 스터디 1일차

🌱  [인프런] 따라하며 배우는 노드, 리액트 시리즈 - 기본강의 

 

[무료] 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의 - 인프런 | 강의

 

 

 # boiler-plate 만들기 (#1  ~ 6)

 

 

1.  Node.js 다운로드

 

cmd창에서 node -v  로 node.js가 설치되어있는지 확인

 

 

 

2.  npm init

 

npm init  :  npm package를 만들기 위함

 

바탕화면에 boiler-plate 폴더 생성 후 해당 폴더에서 cmd창 열고 npm init

npm init 이후 나오는 것들은 엔터로 넘겨도 무방

완료되면 해당 폴더에 package.json이 생성됨

 

 

 

3.   index.js  파일 생성

 

index.js가 백엔드 서버의 시작점이라고 생각하면 됨

 

 

 

4.  Express.js 다운로드    

 

터미널에서 npm install express --save

 

--save  :   package.json의 dependencies 부분에 express가  추가됨

                  다른 사람이 봤을 때도 이걸 쓰고있구나 알수있게 해주는 역할

 

완료되면 node_modules 폴더 생섬됨

node_modules 폴더  :  다운받은 dependency들이 이 폴더에 들어가 있음

 

 

 

5.  index.js 작성 

Express 앱 만들기 : Express 공식문서 https://expressjs.com/ko/starter/hello-world.html

// index.js

const express = require('express')	// express 모듈가져오기
const app = express()			// 새로운 express app 생성
const port = 5000			// 포트번호는 아무거나 상관없음

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

위와 같이 index.js 작성하고나서

 

package.js 의  scripts 부분에 "start": "node index.js", 추가

// package.json

"scripts": {
	"start": "node index.js",
	"test": "echo \"Error: no test specified\" && exit 1"
},

 

그리고나서 터미널에서 npm run start 하면 

-  터미널  :   "Example app listening on port 5000"  찍힘

-  localhost:5000 접속 시  :  "Hello World!"  보임

 

 

6. MongoDB 연결하기

 

1)  MongoDB 가입하고 클러스터 생성 (free tier available로)

 

2)  MongoDB 유저생성

클러스터에서 Connect 버튼 클릭

->  Create a database user  (! username이랑 password 기억하기)

->  Create MongoDB User 클릭

->  Choose a connection method

->  Connect your application

->  Connection string only 부분 Copy 해놓기

 

3)  mongoose 다운

mongoose  :  MongoDB를 편하게 쓸 수 있게 해주는 툴

npm install mongoose --save

 

4)  MongoDB 연결

// index.js

const express = require('express')
const app = express()
const port = 5000

// ============== 이 부분 추가
const mongoose = require('mongoose');
mongoose.connect('복사해놓은 Connection string only 부분', {	// password를 아까 유저 생성할때 썼던 비밀번호로 바꾸기
    // useNewUrlParser: true, useUnifiedTopology: true, useCreateIndex: true, useFindAndModify: false
    // 강의에서는 이부분 쓰고 진행하는데 현재 시점에서 몽구스 버전이 6.0이상이라면 몽구스는 기본으로 항상 위에처럼 기억하고 실행해서 안써줘도됨
}).then(() => console.log('MongoDB Connected...'))   // 연결한 다음에 콘솔창에 메세지 띄우기
.catch(err => console.log(err))   // 에러있으면 에러띄우기
// ============== 

app.get('/', (req, res) => {
  res.send('Hello World! 안녕하세요')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

 

index.js 작성완료했으면 npm run start로 연결잘되는지 확인하기

콘솔에 "MongoDB Connected... "가 뜬다면 정상적으로 연결됨

 

! 만약, MongooseServerSelectionError: connection <monitor> to 숫자 closed  에러가 뜬다면

MongoDB 좌측메뉴 중 Network Access에서 ADD IP ADDRESS 클릭 -> add current ip address 추가해주기

 

 

 

7. 유저 모델 생성

 

model  :  schema를 감싸주는 역할

스키마는 뭔지는 아는데 제대로 정의 찾아보기

 

models 폴더 생성 -> models폴더 안에 User.js 생성

// User.js

const mongoose = require('mongoose');

const userSchema = mongoose.Schema({
  name: {
    type: String,
    maxlength: 50
  },
  email: {
    type: String,
    trim: true,     // 공백없애는 역할
    unique: 1       // 유니크하게
  },
  password: {
    type: String,
    minlength: 5
  },
  lastname: {
    type: String,
    maxlength: 50
  },
  role: {
    type: Number,    // 1이면 관리자, 0이면 일반유저 이런식으로
    default: 0
  },
  image: String,
  token: {    // 유효성 관리 등을 위한
    type: String
  },
  tokenExp: {
    type: Number
  }
});

const User = mongoose.model('User', userSchema);    // mongoose.model('모델이름', 스키마)

module.exports = { User } // User모델을 다른곳에서도 쓸수잇게 export해주기

 

 

 

8. BodyParser

 

BodyParser  :  클라이언트에서 주는 정보를 지금 만들고있는 서버에서 받으려면 필요한 디펜던시